X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBaseGame.vue;h=715d2fb75d7253ac9f7bafc36ec100df0a9a72b9;hb=6dd02928259482332d639bb71d2c44ff684fcfb5;hp=ceadcd3a6762c06df1510f2957d77ae090bdedfa;hpb=a6088c906bbe6fae95707dc7028e45023fe39981;p=vchess.git diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue index ceadcd3a..715d2fb7 100644 --- a/client/src/components/BaseGame.vue +++ b/client/src/components/BaseGame.vue @@ -6,11 +6,12 @@ .card.smallpad.small-modal.text-center label.modal-close(for="modalEog") h3#eogMessage.section {{ endgameMessage }} - Board(:vr="vr" :last-move="lastMove" :analyze="analyze" :user-color="mycolor" - :orientation="orientation" :vname="variant.name" @play-move="play") + Board(:vr="vr" :last-move="lastMove" :analyze="analyze" + :user-color="gameInfo.mycolor" :orientation="orientation" + :vname="vname" @play-move="play") .button-group - button(@click="play") Play - button(@click="undo") Undo + button(@click="() => play()") Play + button(@click="() => undo()") Undo button(@click="flip") Flip button(@click="gotoBegin") GotoBegin button(@click="gotoEnd") GotoEnd @@ -37,29 +38,48 @@ export default { Board, //MoveList, }, - props: ["variant","analyze","players"], + // "vr": VariantRules object, describing the game state + rules + // fenStart, players, mycolor + props: ["vname","analyze","vr","gameInfo"], data: function() { return { st: store.state, - vr: null, //VariantRules object, describing the game state + rules + // NOTE: all following variables must be reset at the beginning of a game endgameMessage: "", orientation: "w", score: "*", //'*' means 'unfinished' - // userColor: given by gameId, or fen in problems mode (if no game Id)... - mycolor: "w", - fenStart: "", - moves: [], //all moves played in current game + moves: [], cursor: -1, //index of the move just played lastMove: null, }; }, + watch: { + // gameInfo (immutable once set) changes when a new game starts + "gameInfo": function() { + // Reset all variables + this.endgameMessage = ""; + this.orientation = this.gameInfo.mycolor || "w"; //default orientation for observed games + this.score = this.gameInfo.score; //mutable (if initially "*") + this.moves = this.gameInfo.moves; //TODO: this is mutable; make a copy instead + const L = this.moves.length; + this.cursor = L-1; + this.lastMove = (L > 0 ? this.moves[L-1] : null); + }, + analyze: function() { + if (this.analyze) + { + // Switched to analyze mode: game is over + this.endGame("*"); + } + }, + }, computed: { showMoves: function() { return true; //return window.innerWidth >= 768; }, showFen: function() { - return this.variant.name != "Dark" || this.score != "*"; + return this.vname != "Dark" || this.score != "*"; }, }, methods: { @@ -93,11 +113,11 @@ export default { getPgn: function() { let pgn = ""; pgn += '[Site "vchess.club"]\n'; - pgn += '[Variant "' + this.variant.name + '"]\n'; + pgn += '[Variant "' + this.vname + '"]\n'; pgn += '[Date "' + getDate(new Date()) + '"]\n'; - pgn += '[White "' + this.players[0] + '"]\n'; - pgn += '[Black "' + this.players[1] + '"]\n'; - pgn += '[Fen "' + this.fenStart + '"]\n'; + pgn += '[White "' + this.gameInfo.players[0] + '"]\n'; + pgn += '[Black "' + this.gameInfo.players[1] + '"]\n'; + pgn += '[Fen "' + this.gameInfo.fenStart + '"]\n'; pgn += '[Result "' + this.score + '"]\n\n'; let counter = 1; let i = 0; @@ -117,7 +137,7 @@ export default { }, showScoreMsg: function(score) { this.setEndgameMessage(score); - let modalBox = document.getElementById("modal-eog"); + let modalBox = document.getElementById("modalEog"); modalBox.checked = true; setTimeout(() => { modalBox.checked = false; }, 2000); }, @@ -187,8 +207,6 @@ export default { move.fen = this.vr.getFen(); if (this.st.settings.sound == 2) new Audio("/sounds/move.mp3").play().catch(err => {}); - // Send the move to web worker (including his own moves) - this.compWorker.postMessage(["newmove",move]); if (!navigate && (this.score == "*" || this.analyze)) { // Stack move on movesList at current cursor @@ -207,15 +225,8 @@ export default { else //just show score on screen (allow undo) this.showScoreMsg(score); } - // subTurn condition for Marseille (and Avalanche) rules - else if ((this.mode == "computer" && (!this.vr.subTurn || this.vr.subTurn <= 1)) - && (this.subMode == "auto" || this.vr.turn != this.mycolor)) - { - this.playComputerMove(); - } - // https://vuejs.org/v2/guide/list.html#Caveats (also for undo) - //if (navigate) - // this.$children[0].$forceUpdate(); //TODO!? + if (!this.analyze) + this.$emit("newmove", move); //post-processing (e.g. computer play) }, undo: function(move) { let navigate = !move; @@ -231,18 +242,16 @@ export default { if (this.st.settings.sound == 2) new Audio("/sounds/undo.mp3").play().catch(err => {}); this.incheck = this.vr.getCheckSquares(this.vr.turn); - if (navigate) - this.$children[0].$forceUpdate(); //TODO!? - else if (this.analyze) //TODO: can this happen? + if (!navigate) this.moves.pop(); }, gotoMove: function(index) { - this.vr = new V(this.moves[index].fen); + this.vr.re_init(this.moves[index].fen); this.cursor = index; this.lastMove = this.moves[index]; }, gotoBegin: function() { - this.vr = new V(this.fenStart); + this.vr.re_init(this.fenStart); this.cursor = -1; this.lastMove = null; },