X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBaseGame.vue;h=cb65f033fd3e77fdffa254f8c7ad90d4947fd14c;hb=e50a802531b99829c533f22ecd21e359e7e1e049;hp=e99c194e81d38d2a44a44c3c77e07e04d69a63dc;hpb=c3f02a0e9d1104911f3dc70ca9b531f73b1bd769;p=vchess.git diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue index e99c194e..cb65f033 100644 --- a/client/src/components/BaseGame.vue +++ b/client/src/components/BaseGame.vue @@ -51,11 +51,12 @@ div#baseGame :firstNum="firstMoveNumber" :moves="moves" :cursor="cursor" + :vname="game.vname" @download="download" @showrules="showRules" @analyze="toggleAnalyze" @goto-move="gotoMove" - @reset-arrows="resetArrows" + @redraw-board="redrawBoard" ) .clearer @@ -86,6 +87,7 @@ export default { endgameMessage: "", orientation: "w", mode: "", + gameMode: "", score: "*", //'*' means 'unfinished' moves: [], cursor: -1, //index of the move just played @@ -105,7 +107,7 @@ export default { return this.st.tr[ (this.vr.turn == 'w' ? "White" : "Black") + " to move"]; } - // Cannot flip: racing king or circular chess + // Cannot flip (racing king or circular chess), or Monochrome return ( this.vr.movesCount == 0 && this.game.mycolor == "w" ? this.st.tr["It's your turn!"] @@ -121,19 +123,26 @@ export default { // TODO: is it OK to pass "computed" as properties? // Also, some are seemingly not recomputed when vr is initialized. showMoves: function() { - return this.game.score != "*" - ? "all" - : (!!this.vr ? this.vr.showMoves : "none"); + return ( + !!this.game.score && this.game.score != "*" + ? "all" + : (!!this.vr ? this.vr.showMoves : "none") + ); }, showTurn: function() { return ( - this.game.score == '*' && - !!this.vr && (this.vr.showMoves != "all" || !this.vr.canFlip) + !!this.game.score && this.game.score == '*' && + !!this.vr && + ( + this.vr.showMoves != "all" || + !this.vr.canFlip || + this.vr.showFirstTurn + ) ); }, canAnalyze: function() { return ( - this.game.mode != "analyze" && + (!this.game.mode || this.game.mode != "analyze") && !!this.vr && this.vr.canAnalyze ); }, @@ -142,8 +151,8 @@ export default { }, allowDownloadPGN: function() { return ( - this.game.score != "*" || - (!!this.vr && this.vr.showMoves == "all") + (!!this.game.score && this.game.score != "*") || + (!!this.vr && !this.vr.someHiddenMoves) ); } }, @@ -195,9 +204,8 @@ export default { if (e.deltaY < 0) this.undo(); else if (e.deltaY > 0) this.play(); }, - resetArrows: function() { - // TODO: make arrows scale with board, and remove this - this.$refs["board"].cancelResetArrows(); + redrawBoard: function() { + this.$refs["board"].re_setDrawings(); }, showRules: function() { // The button is here only on Game page: @@ -212,32 +220,46 @@ export default { this.moves = JSON.parse(JSON.stringify(game.moves || [])); // Post-processing: decorate each move with notation and FEN this.vr = new V(game.fenStart); + this.inMultimove = false; //in case of + if (!!this.$refs["board"]) + // Also in case of: + this.$refs["board"].resetCurrentAttempt(); + let analyseBtn = document.getElementById("analyzeBtn"); + if (!!analyseBtn) analyseBtn.classList.remove("active"); const parsedFen = V.ParseFen(game.fenStart); const firstMoveColor = parsedFen.turn; this.firstMoveNumber = Math.floor(parsedFen.movesCount / 2) + 1; let L = this.moves.length; if (L == 0) { - this.incheck = []; - this.score = "*"; + // Could be started on a random position in analysis mode: + this.incheck = this.vr.getCheckSquares(); + this.score = this.vr.getCurrentScore(); + if (this.score != '*') { + // Show score on screen + const message = getScoreMessage(this.score); + this.showEndgameMsg(this.score + " . " + this.st.tr[message]); + } } - this.moves.forEach((move,idx) => { - // Strategy working also for multi-moves: - if (!Array.isArray(move)) move = [move]; - const Lm = move.length; - move.forEach((m,idxM) => { - m.notation = this.vr.getNotation(m); - m.unambiguous = V.GetUnambiguousNotation(m); - this.vr.play(m); - const checkSquares = this.vr.getCheckSquares(); - if (checkSquares.length > 0) m.notation += "+"; - if (idxM == Lm - 1) m.fen = this.vr.getFen(); - if (idx == L - 1 && idxM == Lm - 1) { - this.incheck = checkSquares; - this.score = this.vr.getCurrentScore(); - if (["1-0", "0-1"].includes(this.score)) m.notation += "#"; - } + else { + this.moves.forEach((move,idx) => { + // Strategy working also for multi-moves: + if (!Array.isArray(move)) move = [move]; + const Lm = move.length; + move.forEach((m,idxM) => { + m.notation = this.vr.getNotation(m); + m.unambiguous = V.GetUnambiguousNotation(m); + this.vr.play(m); + const checkSquares = this.vr.getCheckSquares(); + if (checkSquares.length > 0) m.notation += "+"; + if (idxM == Lm - 1) m.fen = this.vr.getFen(); + if (idx == L - 1 && idxM == Lm - 1) { + this.incheck = checkSquares; + this.score = this.vr.getCurrentScore(); + if (["1-0", "0-1"].includes(this.score)) m.notation += "#"; + } + }); }); - }); + } if (firstMoveColor == "b") { // 'start' & 'end' is required for Board component this.moves.unshift({ @@ -259,19 +281,25 @@ export default { }, toggleAnalyze: function() { // Freeze while choices are shown (and autoplay has priority) - if (this.$refs["board"].choices.length > 0 || this.autoplay) return; + if ( + this.inPlay || + this.$refs["board"].choices.length > 0 || + this.autoplay + ) { + return; + } if (this.mode != "analyze") { // Enter analyze mode: - if (this.inMultimove) this.cancelCurrentMultimove(); this.gameMode = this.mode; //was not 'analyze' this.mode = "analyze"; + if (this.inMultimove) this.cancelCurrentMultimove(); this.gameCursor = this.cursor; this.gameMoves = JSON.parse(JSON.stringify(this.moves)); document.getElementById("analyzeBtn").classList.add("active"); } else { // Exit analyze mode: - this.mode = this.gameMode ; + this.mode = this.gameMode; this.cursor = this.gameCursor; this.moves = this.gameMoves; let fen = this.game.fenStart; @@ -411,7 +439,12 @@ export default { // "light": if gotoMove() or gotoEnd() play: function(move, received, light, autoplay) { // Freeze while choices are shown: - if (this.$refs["board"].choices.length > 0) return; + if ( + !!this.$refs["board"].selectedPiece || + this.$refs["board"].choices.length > 0 + ) { + return; + } const navigate = !move; // Forbid navigation during autoplay: if (navigate && this.autoplay && !autoplay) return; @@ -432,13 +465,13 @@ export default { this.stackToPlay.unshift(move); return; } - this.inPlay = true; if (this.mode == "analyze") this.toggleAnalyze(); if (this.cursor < this.moves.length - 1) // To play a received move, cursor must be at the end of the game: this.gotoEnd(); + this.inPlay = true; } - // The board may show some the possible moves: (TODO: bad solution) + // The board may show some possible moves: (TODO: bad solution) this.$refs["board"].resetCurrentAttempt(); const playSubmove = (smove) => { smove.notation = this.vr.getNotation(smove); @@ -483,8 +516,9 @@ export default { (function executeMove() { const smove = move[moveIdx++]; // NOTE: condition "smove.start.x >= 0" required for Dynamo, - // because second move may be empty. - if (animate && smove.start.x >= 0) { + // because second move may be empty. noHighlight condition + // is used at least for Chakart. + if (animate && smove.start.x >= 0 && !smove.end.noHighlight) { self.animateMove(smove, () => { playSubmove(smove); if (moveIdx < move.length) setTimeout(executeMove, 500); @@ -586,8 +620,13 @@ export default { }, // "light": if gotoMove() or gotoBegin() undo: function(move, light) { - // Freeze while choices are shown: - if (this.$refs["board"].choices.length > 0 || this.autoplay) return; + if ( + this.autoplay || + !!this.$refs["board"].selectedPiece || + this.$refs["board"].choices.length > 0 + ) { + return; + } this.$refs["board"].resetCurrentAttempt(); if (this.inMultimove) { this.cancelCurrentMultimove(); @@ -614,7 +653,13 @@ export default { } }, gotoMove: function(index) { - if (this.$refs["board"].choices.length > 0 || this.autoplay) return; + if ( + this.autoplay || + !!this.$refs["board"].selectedPiece || + this.$refs["board"].choices.length > 0 + ) { + return; + } this.$refs["board"].resetCurrentAttempt(); if (this.inMultimove) this.cancelCurrentMultimove(); if (index == this.cursor) return; @@ -633,7 +678,13 @@ export default { this.emitFenIfAnalyze(); }, gotoBegin: function() { - if (this.$refs["board"].choices.length > 0 || this.autoplay) return; + if ( + this.autoplay || + !!this.$refs["board"].selectedPiece || + this.$refs["board"].choices.length > 0 + ) { + return; + } this.$refs["board"].resetCurrentAttempt(); if (this.inMultimove) this.cancelCurrentMultimove(); const minCursor = @@ -646,11 +697,8 @@ export default { this.emitFenIfAnalyze(); }, gotoEnd: function() { - if (this.$refs["board"].choices.length > 0 || this.autoplay) return; - this.$refs["board"].resetCurrentAttempt(); if (this.cursor == this.moves.length - 1) return; this.gotoMove(this.moves.length - 1); - this.emitFenIfAnalyze(); }, flip: function() { if (this.$refs["board"].choices.length > 0) return;