dao-game / commit

Fixed bug with undo.

550d4a053a8d8faa8db61eca0c97c5d8f08cde10 · Pavel Safronov · 2022-03-01 01:31:45 -0800 · parents 019797d35440

Fixed bug with undo.

 game.js | 40 +++++++++++++++++++++++++++++-----------
 1 file changed, 29 insertions(+), 11 deletions(-)

diff --git a/game.js b/game.js
index 19547fc..365b8d3 100644
--- a/game.js
+++ b/game.js
@@ -123,6 +123,7 @@ const player = {
 const defaultRedPiece = document.getElementById('default-red-piece');
 const defaultBluePiece = document.getElementById('default-blue-piece');
 const cells = () => Array.from(document.querySelectorAll("td"));
+const allPieces = () => Array.from(document.querySelectorAll('.piece'));
 const redPieces = () => Array.from(document.querySelectorAll('.red-piece:not(#default-red-piece'));
 const bluePieces = () => Array.from(document.querySelectorAll('.blue-piece:not(#default-blue-piece'));
 const redTurnText = () => Array.from(document.querySelectorAll(".red-turn-text"));
@@ -161,6 +162,16 @@ const resetBoard = () => {
         cell.classList.remove(constants.blinkingClassName);
     });
 
+    // reset pieces
+    allPieces().forEach(piece => {
+        if (piece.classList.contains(constants.activePlayerPieceClassName)) {
+            piece.classList.toggle(constants.activePlayerPieceClassName);
+        }
+        if (piece.classList.contains(constants.selectedPieceClassName)) {
+            piece.classList.toggle(constants.selectedPieceClassName);
+        }
+    });
+
     // remove all listeners
     listenerManager.removeListeners();
 };
@@ -252,9 +263,7 @@ const nextMove = () => {
             const previousSelectedPieceId = player.selectedPieceId;
             if (previousSelectedPieceId !== undefined) {
                 const previousPiece = document.getElementById(previousSelectedPieceId);
-                if (previousPiece.classList.contains(constants.selectedPieceClassName)) {
-                    previousPiece.classList.toggle(constants.selectedPieceClassName);
-                }
+                previousPiece.classList.remove(constants.selectedPieceClassName);
                 cells().forEach(cell => {
                     cell.classList.remove(constants.blinkingClassName);
                 });
@@ -299,12 +308,6 @@ const nextMove = () => {
             pp.classList.add(constants.activePlayerPieceClassName);
             listenerManager.addListener(pp, 'click', selectPiece);
         });
-        const otherPieces = player.isRedTurn ? bluePieces() : redPieces();
-        otherPieces.forEach(op => {
-            if (op.classList.contains(constants.activePlayerPieceClassName)) {
-                op.classList.toggle(constants.activePlayerPieceClassName);
-            }
-        });
     };
 
     // reset text
@@ -439,23 +442,38 @@ const init = () => {
     });
 
     // hook up buttons
+    let blockActions = false;
     resetButton.addEventListener('click', () => {
+        if (blockActions) {
+            return;
+        }
         if (player.moveHistory.length === 0) {
             return;
         }
 
+        blockActions = true;
         if (confirm('Reset?')) {
             window.location.reload();
         }
+        blockActions = false;
     });
-    undoButton.addEventListener('click', () => {
+    undoButton.addEventListener('click', async () => {
+        if (blockActions) {
+            return;
+        }
         if (player.moveHistory.length === 0) {
             return;
         }
 
+        blockActions = true;
+
+        player.selectedPieceId = undefined;
+        resetBoard();
+
         const { destIndex, sourceIndex } = player.moveHistory.pop();
-        movePiece(destIndex, sourceIndex);
+        await movePiece(destIndex, sourceIndex);
         nextMove();
+        blockActions = false;
     });
 };