moved gameover check after a new state, fix go2next bugs

src/view/DoudizhuGameView.js

@@ -57,6 +57,7 @@ class DoudizhuGameView extends React.Component {
 
     generateNewState(){
         let gameInfo = deepCopy(this.state.gameInfo);
+        if(this.state.gameInfo.turn === this.moveHistory.length) return gameInfo;
         // check if the game state of next turn is already in game state history
         if(this.state.gameInfo.turn+1 < this.gameStateHistory.length){
             gameInfo = deepCopy(this.gameStateHistory[this.state.gameInfo.turn+1]);
@@ -73,17 +74,40 @@ class DoudizhuGameView extends React.Component {
                 } else {
                     console.log("Cannot find cards in move from player's hand");
                 }
+                // check if game ends
+                if(remainedCards.length === 0){
+                    doubleRaf(()=>{
+                        const winner = this.state.gameInfo.playerInfo.find(element => {
+                            return element.index === newMove.playerIdx;
+                        });
+                        if(winner){
+                            gameInfo.gameStatus = "over";
+                            this.setState({ gameInfo: gameInfo });
+                            if(winner.role === "landlord")
+                                setTimeout(()=>{
+                                    alert("Landlord Wins");
+                                }, 200);
+                            else
+                                setTimeout(()=>{
+                                    alert("Peasants Win");
+                                }, 200);
+                        }else{
+                            console.log("Error in finding winner");
+                        }
+                    });
+                    return gameInfo;
+                }
                 gameInfo.considerationTime = this.initConsiderationTime;
-                gameInfo.completedPercent += 100.0 / this.moveHistory.length;
+                gameInfo.completedPercent += 100.0 / (this.moveHistory.length - 1);
             }else {
                 console.log("Mismatched current player index");
             }
-        }
+            // if current state is new to game state history, push it to the game state history array
-        // if current state is new to game state history, push it to the game state history array
+            if(gameInfo.turn === this.gameStateHistory.length){
-        if(gameInfo.turn === this.gameStateHistory.length){
+                this.gameStateHistory.push(gameInfo);
-            this.gameStateHistory.push(gameInfo);
+            }else{
-        }else{
+                console.log("inconsistent game state history length and turn number");
-            console.log("inconsistent game state history length and turn number");
+            }
         }
         return gameInfo;
     }
@@ -105,6 +129,7 @@ class DoudizhuGameView extends React.Component {
                 this.gameStateTimer();
             }else{
                 let gameInfo = this.generateNewState();
+                if(gameInfo.gameStatus == "over") return;
                 gameInfo.gameStatus = "playing";
                 if(this.state.gameInfo.toggleFade === "fade-out") {
                     gameInfo.toggleFade = "fade-in";
@@ -140,7 +165,9 @@ class DoudizhuGameView extends React.Component {
                 });
                 // the first player should be landlord
                 gameInfo.currentPlayer = res.playerInfo.find(element=>{return element.role === "landlord"}).index;
-                this.gameStateHistory.push(gameInfo);
+                if(this.gameStateHistory.length === 0){ // fix replay bug
+                    this.gameStateHistory.push(gameInfo);
+                }
                 this.setState({gameInfo: gameInfo}, ()=>{
                     if(this.gameStateTimeout){
                         window.clearTimeout(this.gameStateTimeout);
@@ -154,30 +181,7 @@ class DoudizhuGameView extends React.Component {
     };
 
     runNewTurn(prevTurn){
-        // check if the game ends
+        this.gameStateTimer();
-        if(this.state.gameInfo.hands[prevTurn.currentPlayer].length === 0){
-            doubleRaf(()=>{
-                const winner = this.state.gameInfo.playerInfo.find(element => {
-                    return element.index === prevTurn.currentPlayer;
-                });
-                if(winner){
-                    let gameInfo = deepCopy(this.state.gameInfo);
-                    gameInfo.gameStatus = "over";
-                    this.setState({ gameInfo: gameInfo });
-                    if(winner.role === "landlord")
-                        setTimeout(()=>{
-                            alert("Landlord Wins");
-                        }, 200);
-                    else
-                        setTimeout(()=>{
-                            alert("Peasants Win");
-                        }, 200);
-                }else{
-                    console.log("Error in finding winner");
-                }
-            });
-        }else
-            this.gameStateTimer();
     }
 
     pauseReplay(){
@@ -276,6 +280,7 @@ class DoudizhuGameView extends React.Component {
 
     go2NextGameState() {
         let gameInfo = this.generateNewState();
+        if(gameInfo.gameStatus === "over") return;
         gameInfo.gameStatus = "paused";
         gameInfo.toggleFade = "";
         this.setState({gameInfo: gameInfo});

src/view/LeducHoldemGameView.js

@@ -57,24 +57,17 @@ class LeducHoldemGameView extends React.Component {
         let gameInfo = deepCopy(this.state.gameInfo);
         const turn = this.state.gameInfo.turn;
         if(turn >= this.moveHistory[this.state.gameInfo.round].length){
-            if(this.state.gameInfo.round === 0){
+            gameInfo.turn = 0;
-                // todo: if it's the first round, then reveal the public card and start the second round
+            gameInfo.round = 1;
-                gameInfo.turn = 0;
+            // check if the game state of next turn is already in game state history
-                gameInfo.round = 1;
+            if(gameInfo.turn < this.gameStateHistory[gameInfo.round].length){
-                gameInfo.latestAction = ["", ""];
+                gameInfo = deepCopy(this.gameStateHistory[gameInfo.round][gameInfo.turn]);
-                gameInfo.currentPlayer = this.moveHistory[1][0].playerIdx;
-                gameInfo.considerationTime = this.initConsiderationTime;
-                // gameInfo.completedPercent += 100.0 / this.moveHistoryTotalLength;
-                this.setState({ gameInfo: gameInfo });
-            }else{
-                gameInfo.gameStatus = "over";
-                this.setState({ gameInfo: gameInfo });
-                setTimeout(()=>{
-                    // TODO: show winner
-                    alert("Game Ends!");
-                }, 200);
                 return gameInfo;
             }
+            gameInfo.latestAction = ["", ""];
+            gameInfo.currentPlayer = this.moveHistory[1][0].playerIdx;
+            gameInfo.considerationTime = this.initConsiderationTime;
+            this.setState({ gameInfo: gameInfo });
         }else{
             // check if the game state of next turn is already in game state history
             if(turn+1 < this.gameStateHistory[gameInfo.round].length){
@@ -113,9 +106,19 @@ class LeducHoldemGameView extends React.Component {
                         console.log("Error in player's latest action");
                 }
                 gameInfo.turn++;
+                if(gameInfo.round !== 0 && gameInfo.turn == this.moveHistory[gameInfo.round].length){
+                    gameInfo.gameStatus = "over";
+                    this.setState({gameInfo: gameInfo});
+                    setTimeout(()=>{
+                        // TODO: show winner
+                        alert("Game Ends!");
+                    }, 200);
+                    return gameInfo;
+                }
                 gameInfo.currentPlayer = (gameInfo.currentPlayer+1)%2;
                 gameInfo.considerationTime = this.initConsiderationTime;
                 gameInfo.completedPercent += 100.0 / this.moveHistoryTotalLength;
+                gameInfo.gameStatus = "playing";
                 this.setState({ gameInfo: gameInfo });
             }else{
                 console.log("Mismatch in current player & move history");
@@ -176,14 +179,16 @@ class LeducHoldemGameView extends React.Component {
                 res = res.data;
                 // init replay info
                 this.moveHistory = res.moveHistory;
-                this.moveHistoryTotalLength = this.moveHistory.reduce((count, round) => count + round.length, 0);
+                this.moveHistoryTotalLength = this.moveHistory.reduce((count, round) => count + round.length, 0) - 1;
                 let gameInfo = deepCopy(this.initGameState);
                 gameInfo.gameStatus = "playing";
                 gameInfo.playerInfo = res.playerInfo;
                 gameInfo.hands = res.initHands;
                 gameInfo.currentPlayer = res.moveHistory[0][0].playerIdx;
                 gameInfo.publicCard = res.publicCard;
-                this.gameStateHistory[gameInfo.round].push(gameInfo);
+                if(this.gameStateHistory.length !== 0 && this.gameStateHistory[0].length === 0){
+                    this.gameStateHistory[gameInfo.round].push(gameInfo);
+                }
                 this.setState({gameInfo: gameInfo}, ()=>{
                     if(this.gameStateTimeout){
                         window.clearTimeout(this.gameStateTimeout);
@@ -271,13 +276,10 @@ class LeducHoldemGameView extends React.Component {
 
     go2NextGameState() {
         let gameInfo = this.generateNewState();
-        if(gameInfo.gameStatus === "over") {
+        if(gameInfo.gameStatus === "over") return;
-            this.setState({gameInfo: gameInfo});
+        gameInfo.gameStatus = "paused";
-        }else{
+        gameInfo.toggleFade = "";
-            gameInfo.gameStatus = "paused";
+        this.setState({gameInfo: gameInfo});
-            gameInfo.toggleFade = "";
-            this.setState({gameInfo: gameInfo});    
-        }
     }
 
     render(){