diff --git a/scripts/game.js b/scripts/game.js
index 7bf2724..7ba81c5 100644
--- a/scripts/game.js
+++ b/scripts/game.js
@@ -112,23 +112,28 @@ var State = function(old) {
*/
var Game = function(autoPlayer) {
- //public : initialize the ai player for this game
- this.ai = autoPlayer;
+ // init new game
+ this.init = function() {
- // public : initialize the game current state to empty board configuration
- this.currentState = new State();
+ //public : initialize the ai player for this game
+ this.ai = autoPlayer;
- //"E" stands for empty board cell
- this.currentState.board = ["E", "E", "E",
- "E", "E", "E",
- "E", "E", "E"];
+ // public : initialize the game current state to empty board configuration
+ this.currentState = new State();
- this.currentState.turn = "X"; //X plays first
+ //"E" stands for empty board cell
+ this.currentState.board = ["E", "E", "E",
+ "E", "E", "E",
+ "E", "E", "E"];
- /*
- * initialize game status to beginning
- */
- this.status = "beginning";
+ this.currentState.turn = "X"; //X plays first
+
+ /*
+ * initialize game status to beginning
+ */
+ this.status = "beginning";
+
+ }
/*
* public function that advances the game to a new state
@@ -139,6 +144,9 @@ var Game = function(autoPlayer) {
if(_state.isTerminal()) {
this.status = "ended";
+ //update score
+ ui.updateScore(_state.result);
+
if(_state.result === "X-won")
//X won
ui.switchViewTo("won");
@@ -148,6 +156,9 @@ var Game = function(autoPlayer) {
else
//it's a draw
ui.switchViewTo("draw");
+
+ //start a new game
+ ui.restartGame(this);
}
else {
//the game is still running
@@ -168,6 +179,7 @@ var Game = function(autoPlayer) {
* starts the game
*/
this.start = function() {
+ this.init();
if(this.status = "beginning") {
//invoke advanceTo with the initial state
this.advanceTo(this.currentState);
diff --git a/scripts/ui.js b/scripts/ui.js
index 367bb0d..f1fa667 100644
--- a/scripts/ui.js
+++ b/scripts/ui.js
@@ -65,6 +65,33 @@ ui.switchViewTo = function(turn) {
}
};
+/*
+ * updates score table
+ * @param _status [String]: the last round winner
+ */
+ui.updateScore = function(_status) {
+ if (_status === "X-won") {
+ $('.human-score').text(parseInt($('.human-score').text()) + 1);
+ } else if (_status === "O-won") {
+ $('.robot-score').text(parseInt($('.robot-score').text()) + 1);
+ }
+}
+
+/*
+ * restarts board
+ */
+ui.restartGame = function(newGame) {
+ var board = $('.cell');
+
+ board.fadeOut(1200);
+ setTimeout(function() { board.text(""); }, 620);
+ board.fadeIn(function() {
+ $(board).removeClass('occupied');
+ $(board).addClass('undefined');
+ newGame.start(); }
+ );
+}
+
/*
* places X or O in the specifed place in the board
* @param i [Number] : row number (0-indexed)
diff --git a/styles/ui.css b/styles/ui.css
index 8d9775c..009f4d8 100644
--- a/styles/ui.css
+++ b/styles/ui.css
@@ -4,6 +4,35 @@
margin: 0 auto;
}
+.score {
+ display: inline-block;
+ height: 200px;
+ width: 200px;
+ float:left;
+ line-height: 60px;
+ margin-top: 40px;
+ text-align: center;
+}
+
+.total-score {
+ color: lightskyblue;
+ font-family: "Arial Narrow";
+ font-size: 40px;
+ font-weight: bold;
+}
+
+.human-score {
+ float: left;
+ margin-left: 65px;
+ font-size: 45px;
+}
+
+.robot-score {
+ float: right;
+ margin-right: 65px;
+ font-size: 45px;
+}
+
.board {
height: 420px;
width: 420px;