Refactor Problems view: should now handle better long problems lists

[vchess.git] / client / src / components / BaseGame.vue

diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue
index 8c96e39..c4ffe5c 100644 (file)
--- a/client/src/components/BaseGame.vue
+++ b/client/src/components/BaseGame.vue
@@ -191,7 +191,8 @@ export default {
         this.moves.unshift({
           notation: "...",
           start: { x: -1, y: -1 },
-          end: { x: -1, y: -1 }
+          end: { x: -1, y: -1 },
+          fen: game.fenStart
         });
       }
       this.positionCursorTo(this.moves.length - 1);
@@ -207,9 +208,7 @@ export default {
         } else {
           this.lastMove = this.moves[index];
         }
-      }
-      else
-        this.lastMove = null;
+      } else this.lastMove = null;
     },
     analyzePosition: function() {
       let newUrl =
@@ -292,7 +291,7 @@ export default {
       if (this.game.mode == "analyze") {
         this.$emit(
           "fenchange",
-          this.lastMove ? this.lastMove.fen : this.game.fenStart
+          !!this.lastMove ? this.lastMove.fen : this.game.fenStart
         );
       }
     },
@@ -308,30 +307,26 @@ export default {
       }
       const navigate = !move;
       const playSubmove = (smove) => {
-        if (!navigate) smove.notation = this.vr.getNotation(smove);
+        smove.notation = this.vr.getNotation(smove);
         this.vr.play(smove);
         this.lastMove = smove;
-        // Is opponent in check?
-        this.incheck = this.vr.getCheckSquares(this.vr.turn);
-        if (!navigate) {
-          if (!this.inMultimove) {
-            if (this.cursor < this.moves.length - 1)
-              this.moves = this.moves.slice(0, this.cursor + 1);
-            this.moves.push(smove);
-            this.inMultimove = true; //potentially
-            this.cursor++;
-          } else {
-            // Already in the middle of a multi-move
-            const L = this.moves.length;
-            if (!Array.isArray(this.moves[L-1]))
-              this.$set(this.moves, L-1, [this.moves[L-1], smove]);
-            else
-              this.$set(this.moves, L-1, this.moves.concat([smove]));
-          }
+        if (!this.inMultimove) {
+          if (this.cursor < this.moves.length - 1)
+            this.moves = this.moves.slice(0, this.cursor + 1);
+          this.moves.push(smove);
+          this.inMultimove = true; //potentially
+          this.cursor++;
+        } else {
+          // Already in the middle of a multi-move
+          const L = this.moves.length;
+          if (!Array.isArray(this.moves[L-1]))
+            this.$set(this.moves, L-1, [this.moves[L-1], smove]);
+          else
+            this.$set(this.moves, L-1, this.moves.concat([smove]));
         }
       };
       const playMove = () => {
-        const animate = V.ShowMoves == "all" && (received || navigate);
+        const animate = (V.ShowMoves == "all" && !!received);
         if (!Array.isArray(move)) move = [move];
         let moveIdx = 0;
         let self = this;
@@ -352,24 +347,27 @@ export default {
           }
         })();
       };
+      const computeScore = () => {
+        const score = this.vr.getCurrentScore();
+        if (score != "*" && this.game.mode == "analyze") {
+          const message = getScoreMessage(score);
+          // Just show score on screen (allow undo)
+          this.showEndgameMsg(score + " . " + this.st.tr[message]);
+        }
+        return score;
+      };
       const afterMove = (smove, initurn) => {
         if (this.vr.turn != initurn) {
           // Turn has changed: move is complete
-          if (!smove.fen) {
+          if (!smove.fen)
             // NOTE: only FEN of last sub-move is required (thus setting it here)
             smove.fen = this.vr.getFen();
-            this.emitFenIfAnalyze();
-          }
+          // Is opponent in check?
+          this.incheck = this.vr.getCheckSquares(this.vr.turn);
+          this.emitFenIfAnalyze();
           this.inMultimove = false;
-          if (!noemit) {
-            var score = this.vr.getCurrentScore();
-            if (score != "*" && this.game.mode == "analyze") {
-              const message = getScoreMessage(score);
-              // Just show score on screen (allow undo)
-              this.showEndgameMsg(score + " . " + this.st.tr[message]);
-            }
-          }
-          if (!navigate && this.game.mode != "analyze") {
+          if (!noemit) var score = computeScore();
+          if (this.game.mode != "analyze") {
             const L = this.moves.length;
             if (!noemit)
               // Post-processing (e.g. computer play).
@@ -390,13 +388,13 @@ export default {
         // The move to navigate to is necessarily full:
         if (this.cursor == this.moves.length - 1) return; //no more moves
         move = this.moves[this.cursor + 1];
-        if (light) {
-          // Just play the move, nothing else:
-          if (!Array.isArray(move)) move = [move];
-          for (let i=0; i < move.length; i++) this.vr.play(move[i]);
-        }
-        else {
-          playMove();
+        // Just play the move:
+        if (!Array.isArray(move)) move = [move];
+        for (let i=0; i < move.length; i++) this.vr.play(move[i]);
+        if (!light) {
+          this.lastMove = move[move.length-1];
+          this.incheck = this.vr.getCheckSquares(this.vr.turn);
+          computeScore();
           this.emitFenIfAnalyze();
         }
         this.cursor++;
@@ -437,10 +435,13 @@ export default {
         this.incheck = this.vr.getCheckSquares(this.vr.turn);
       } else {
         if (!move) {
-          if (this.cursor < 0) return; //no more moves
+          const minCursor =
+            this.moves.length > 0 && this.moves[0].notation == "..."
+              ? 1
+              : 0;
+          if (this.cursor < minCursor) return; //no more moves
           move = this.moves[this.cursor];
         }
-        // Caution; if multi-move, undo all submoves from last to first
         undoMove(move, this.vr);
         if (light) this.cursor--;
         else {
@@ -469,15 +470,13 @@ export default {
     },
     gotoBegin: function() {
       if (this.inMultimove) this.cancelCurrentMultimove();
-      while (this.cursor >= 0)
-        this.undo(null, null, "light");
-      if (this.moves.length > 0 && this.moves[0].notation == "...") {
-        this.cursor = 0;
-        this.lastMove = this.moves[0];
-      } else {
-        this.lastMove = null;
-      }
-      this.incheck = [];
+      const minCursor =
+        this.moves.length > 0 && this.moves[0].notation == "..."
+          ? 1
+          : 0;
+      while (this.cursor >= minCursor) this.undo(null, null, "light");
+      this.lastMove = (minCursor == 1 ? this.moves[0] : null);
+      this.incheck = this.vr.getCheckSquares(this.vr.turn);
       this.emitFenIfAnalyze();
     },
     gotoEnd: function() {