From 64f4b649b358d5721d5487b9a0267e235ef78533 Mon Sep 17 00:00:00 2001
From: Songyi Huang <songyih1996@gmail.com>
Date: Tue, 25 Feb 2020 13:10:54 -0800
Subject: [PATCH] add game end dialog & make probability value for leduc holdem
 sample json more reasonable

---
 server/sample_data/sample_leduc_holdem.json | 58 ++++++++++-----------
 src/view/DoudizhuGameView.js                | 35 ++++++++++++-
 src/view/LeducHoldemGameView.js             | 34 +++++++++++-
 3 files changed, 94 insertions(+), 33 deletions(-)

diff --git a/server/sample_data/sample_leduc_holdem.json b/server/sample_data/sample_leduc_holdem.json
index 4b92154..b01c350 100644
--- a/server/sample_data/sample_leduc_holdem.json
+++ b/server/sample_data/sample_leduc_holdem.json
@@ -22,7 +22,7 @@
         "probabilities": [
           {
             "move": "Check",
-            "probability": 0.35
+            "probability": 0.7661
           },
           {
             "move": "Raise",
@@ -34,7 +34,7 @@
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.2339
           }
         ]
       },
@@ -44,11 +44,11 @@
         "probabilities": [
           {
             "move": "Raise",
-            "probability": 0.9
+            "probability": 0.4123
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": 0.4983
           },
           {
             "move": "Call",
@@ -56,7 +56,7 @@
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.0894
           }
         ]
       },
@@ -66,19 +66,19 @@
         "probabilities": [
           {
             "move": "Call",
-            "probability": 0.9
+            "probability": 0.5251
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": -1
           },
           {
             "move": "Raise",
-            "probability": 0.02
+            "probability": 0.1803
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.2946
           }
         ]
       },
@@ -88,19 +88,19 @@
         "probabilities": [
           {
             "move": "Check",
-            "probability": 0.9
+            "probability": 0.7435
           },
           {
             "move": "Raise",
-            "probability": 0.05
+            "probability": 0.2324
           },
           {
             "move": "Call",
-            "probability": 0.02
+            "probability": -1
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.0241
           }
         ]
       }
@@ -112,19 +112,19 @@
         "probabilities": [
           {
             "move": "Raise",
-            "probability": 0.9
+            "probability": 0.5031
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": 0.2138
           },
           {
             "move": "Call",
-            "probability": 0.02
+            "probability": -1
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.2931
           }
         ]
       },
@@ -134,19 +134,19 @@
         "probabilities": [
           {
             "move": "Call",
-            "probability": 0.9
+            "probability": 0.4363
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": -1
           },
           {
             "move": "Raise",
-            "probability": 0.02
+            "probability": 0.3512
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.2485
           }
         ]
       },
@@ -156,19 +156,19 @@
         "probabilities": [
           {
             "move": "Raise",
-            "probability": 0.9
+            "probability": 0.6402
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": 0.2563
           },
           {
             "move": "Call",
-            "probability": 0.02
+            "probability": -1
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.1035
           }
         ]
       },
@@ -178,19 +178,19 @@
         "probabilities": [
           {
             "move": "Call",
-            "probability": 0.9
+            "probability": 0.6042
           },
           {
             "move": "Check",
-            "probability": 0.05
+            "probability": -1
           },
           {
             "move": "Raise",
-            "probability": 0.02
+            "probability": -1
           },
           {
             "move": "Fold",
-            "probability": 0.01
+            "probability": 0.3958
           }
         ]
       }
diff --git a/src/view/DoudizhuGameView.js b/src/view/DoudizhuGameView.js
index aff711a..7beb6ae 100644
--- a/src/view/DoudizhuGameView.js
+++ b/src/view/DoudizhuGameView.js
@@ -17,6 +17,11 @@ import ReplayRoundedIcon from '@material-ui/icons/ReplayRounded';
 import NotInterestedIcon from '@material-ui/icons/NotInterested';
 import SkipNextIcon from '@material-ui/icons/SkipNext';
 import SkipPreviousIcon from '@material-ui/icons/SkipPrevious';
+import DialogTitle from "@material-ui/core/DialogTitle";
+import DialogContent from "@material-ui/core/DialogContent";
+import DialogContentText from "@material-ui/core/DialogContentText";
+import DialogActions from "@material-ui/core/DialogActions";
+import Dialog from "@material-ui/core/Dialog";
 
 class DoudizhuGameView extends React.Component {
     constructor(props) {
@@ -47,6 +52,8 @@ class DoudizhuGameView extends React.Component {
             gameInfo: this.initGameState,
             gameStateLoop: null,
             gameSpeed: 0,
+            gameEndDialog: false,
+            gameEndDialogText: "",
             fullScreenLoading: false
         };
     }
@@ -89,11 +96,13 @@ class DoudizhuGameView extends React.Component {
                             this.setState({ gameInfo: gameInfo });
                             if(winner.role === "landlord")
                                 setTimeout(()=>{
-                                    alert("Landlord Wins");
+                                    const mes = "Landlord Wins";
+                                    this.setState({gameEndDialog: true, gameEndDialogText: mes});
                                 }, 200);
                             else
                                 setTimeout(()=>{
-                                    alert("Peasants Win");
+                                    const mes = "Peasants Win";
+                                    this.setState({gameEndDialog: true, gameEndDialogText: mes});
                                 }, 200);
                         }else{
                             Message({
@@ -311,6 +320,10 @@ class DoudizhuGameView extends React.Component {
         this.setState({gameInfo: gameInfo});
     }
 
+    handleCloseGameEndDialog() {
+        this.setState({gameEndDialog: false, gameEndDialogText: ""});
+    }
+
     render(){
         let sliderValueText = (value) => {
             return value;
@@ -348,6 +361,24 @@ class DoudizhuGameView extends React.Component {
 
         return (
             <div>
+                <Dialog
+                    open={this.state.gameEndDialog}
+                    onClose={()=>{this.handleCloseGameEndDialog()}}
+                    aria-labelledby="alert-dialog-title"
+                    aria-describedby="alert-dialog-description"
+                >
+                    <DialogTitle id="alert-dialog-title" style={{"width": "200px"}}>{"Game Ends!"}</DialogTitle>
+                    <DialogContent>
+                        <DialogContentText id="alert-dialog-description">
+                            {this.state.gameEndDialogText}
+                        </DialogContentText>
+                    </DialogContent>
+                    <DialogActions>
+                        <Button onClick={()=>{this.handleCloseGameEndDialog()}} color="primary" autoFocus>
+                            OK
+                        </Button>
+                    </DialogActions>
+                </Dialog>
                 <Navbar gameName={"Doudizhu"} />
                 <div className={"doudizhu-view-container"}>
                     <Layout.Row style={{"height": "540px"}}>
diff --git a/src/view/LeducHoldemGameView.js b/src/view/LeducHoldemGameView.js
index c89d868..c46b741 100644
--- a/src/view/LeducHoldemGameView.js
+++ b/src/view/LeducHoldemGameView.js
@@ -17,6 +17,11 @@ import ReplayRoundedIcon from '@material-ui/icons/ReplayRounded';
 import NotInterestedIcon from '@material-ui/icons/NotInterested';
 import SkipNextIcon from '@material-ui/icons/SkipNext';
 import SkipPreviousIcon from '@material-ui/icons/SkipPrevious';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogContentText from '@material-ui/core/DialogContentText';
+import DialogTitle from '@material-ui/core/DialogTitle';
 
 class LeducHoldemGameView extends React.Component {
     constructor(props) {
@@ -48,6 +53,8 @@ class LeducHoldemGameView extends React.Component {
             gameInfo: this.initGameState,
             gameStateLoop: null,
             gameSpeed: 0,
+            gameEndDialog: false,
+            gameEndDialogText: "",
             fullScreenLoading: false
         }
     }
@@ -102,7 +109,8 @@ class LeducHoldemGameView extends React.Component {
                         gameInfo.gameStatus = "over";
                         this.setState({ gameInfo: gameInfo });
                         setTimeout(()=>{
-                            alert(`Player ${foldedId} folded, player ${winnerId} wins!`);
+                            const mes = `Player ${foldedId} folded, player ${winnerId} wins!`;
+                            this.setState({ gameEndDialog: true, gameEndDialogText: mes });
                         }, 200);
                         return gameInfo;  
                     default:
@@ -118,7 +126,7 @@ class LeducHoldemGameView extends React.Component {
                     this.setState({gameInfo: gameInfo});
                     setTimeout(()=>{
                         // TODO: show winner
-                        alert("Game Ends!");
+                        this.setState({gameEndDialog: true, gameEndDialogText: ""});
                     }, 200);
                     return gameInfo;
                 }
@@ -307,6 +315,10 @@ class LeducHoldemGameView extends React.Component {
         this.setState({gameInfo: gameInfo});
     }
 
+    handleCloseGameEndDialog() {
+        this.setState({gameEndDialog: false, gameEndDialogText: ""});
+    }
+
     render(){
         let sliderValueText = (value) => {
             return value;
@@ -344,6 +356,24 @@ class LeducHoldemGameView extends React.Component {
 
         return (
             <div>
+                <Dialog
+                    open={this.state.gameEndDialog}
+                    onClose={()=>{this.handleCloseGameEndDialog()}}
+                    aria-labelledby="alert-dialog-title"
+                    aria-describedby="alert-dialog-description"
+                >
+                    <DialogTitle id="alert-dialog-title" style={{"width": "200px"}}>{"Game Ends!"}</DialogTitle>
+                    <DialogContent>
+                        <DialogContentText id="alert-dialog-description">
+                            {this.state.gameEndDialogText}
+                        </DialogContentText>
+                    </DialogContent>
+                    <DialogActions>
+                        <Button onClick={()=>{this.handleCloseGameEndDialog()}} color="primary" autoFocus>
+                            OK
+                        </Button>
+                    </DialogActions>
+                </Dialog>
                 <Navbar gameName="Leduc Hold'em" />
                 <div className={"leduc-view-container"}>
                     <Layout.Row style={{"height": "540px"}}>