From c13ff14aa85e8086ce78f02cc9ebfd8ba4659584 Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 10:37:48 -0800 Subject: [PATCH 01/12] initial board setup --- index.css | 31 ++++++++++++++++++++++++++++++- index.html | 41 ++++++++++++++++++++++++++++++++++++++--- tic-tac-toe.js | 24 ++++++++++++++++++++---- 3 files changed, 88 insertions(+), 8 deletions(-) diff --git a/index.css b/index.css index ae8b9a0..4566a0a 100644 --- a/index.css +++ b/index.css @@ -1,3 +1,32 @@ html { - + +} + +table { + border-collapse: collapse; + width: 30%; +} + +table td { + border: 1px solid black; +} + +table tr:first-child td { + border-top: 0; +} + +table tr:last-child td { + border-bottom: 0; +} + +table tr td:first-child { + border-left: 0; +} + +table tr td:last-child { + border-right: 0; +} + +td { + padding: 10%; } diff --git a/index.html b/index.html index de8d985..eda07eb 100644 --- a/index.html +++ b/index.html @@ -12,10 +12,45 @@

Tic Tac Toe

- --> - diff --git a/tic-tac-toe.js b/tic-tac-toe.js index 33c03a0..532430a 100644 --- a/tic-tac-toe.js +++ b/tic-tac-toe.js @@ -1,7 +1,23 @@ function TicTacToe() { - + this.board = [[0, 0, 0], + [0, 0, 0], + [0, 0, 0] + ]; + this.current_player = 1; } -TicTacToe.prototype = { - -} +TicTacToe.prototype.play_turn = function(row, column) { + this.board[row][column] = this.current_player; + if (this.current_player === 1) { + this.current_player = 2; + } + else { + this.current_player = 1; + } +}; + +$(document).ready(function() { + + + +}); From 8775c229a3bcc9f43e086476d7ea073ab931191d Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 11:10:52 -0800 Subject: [PATCH 02/12] initial play turn functionality --- tic-tac-toe.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/tic-tac-toe.js b/tic-tac-toe.js index 532430a..c11d575 100644 --- a/tic-tac-toe.js +++ b/tic-tac-toe.js @@ -4,20 +4,27 @@ function TicTacToe() { [0, 0, 0] ]; this.current_player = 1; + this.current_player_marker = "😜"; } TicTacToe.prototype.play_turn = function(row, column) { this.board[row][column] = this.current_player; if (this.current_player === 1) { this.current_player = 2; + this.current_player_marker = "🙈"; } else { this.current_player = 1; + this.current_player_marker = "😜"; } }; $(document).ready(function() { + var game = new TicTacToe(); - + $(".row_1.column_1").click(function(){ + $(this).text(game.current_player_marker); + game.play_turn(0,0); + }); }); From 1e6e86f892d315c43072ff44e1c956eaa1c05e84 Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 11:32:36 -0800 Subject: [PATCH 03/12] error if spot has already been clicked --- tic-tac-toe.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/tic-tac-toe.js b/tic-tac-toe.js index c11d575..e320e42 100644 --- a/tic-tac-toe.js +++ b/tic-tac-toe.js @@ -23,8 +23,13 @@ $(document).ready(function() { var game = new TicTacToe(); $(".row_1.column_1").click(function(){ + if (game.board[0][0] !== 0) { + throw new Error ("This spot is already claimed!"); + } $(this).text(game.current_player_marker); game.play_turn(0,0); }); + + }); From 76a8626af77a1991bc69020801e6daf00bb93dc6 Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 11:50:38 -0800 Subject: [PATCH 04/12] all 9 spots are clickable --- tic-tac-toe.js | 65 +++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 64 insertions(+), 1 deletion(-) diff --git a/tic-tac-toe.js b/tic-tac-toe.js index e320e42..93101c6 100644 --- a/tic-tac-toe.js +++ b/tic-tac-toe.js @@ -22,6 +22,7 @@ TicTacToe.prototype.play_turn = function(row, column) { $(document).ready(function() { var game = new TicTacToe(); +// the following 9 functions make the 9 spots clickable, need to DRY this up $(".row_1.column_1").click(function(){ if (game.board[0][0] !== 0) { throw new Error ("This spot is already claimed!"); @@ -30,6 +31,68 @@ $(document).ready(function() { game.play_turn(0,0); }); - + $(".row_1.column_2").click(function(){ + if (game.board[0][1] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(0,1); + }); + + $(".row_1.column_3").click(function(){ + if (game.board[0][2] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(0,2); + }); + + $(".row_2.column_1").click(function(){ + if (game.board[1][0] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(1,0); + }); + + $(".row_2.column_2").click(function(){ + if (game.board[1][1] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(1,1); + }); + + $(".row_2.column_3").click(function(){ + if (game.board[1][2] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(1,2); + }); + + $(".row_3.column_1").click(function(){ + if (game.board[2][0] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(2,0); + }); + + $(".row_3.column_2").click(function(){ + if (game.board[2][1] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(2,1); + }); + + $(".row_3.column_3").click(function(){ + if (game.board[2][2] !== 0) { + throw new Error ("This spot is already claimed!"); + } + $(this).text(game.current_player_marker); + game.play_turn(2,2); + }); }); From 1bd6f6b3ba30155bd9e85324d900d7bf178d3574 Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 12:32:38 -0800 Subject: [PATCH 05/12] create winning scenario --- tic-tac-toe.js | 35 ++++++++++++++++++++++++----------- 1 file changed, 24 insertions(+), 11 deletions(-) diff --git a/tic-tac-toe.js b/tic-tac-toe.js index 93101c6..dfa1133 100644 --- a/tic-tac-toe.js +++ b/tic-tac-toe.js @@ -5,11 +5,16 @@ function TicTacToe() { ]; this.current_player = 1; this.current_player_marker = "😜"; + this.winner = null; } -TicTacToe.prototype.play_turn = function(row, column) { +TicTacToe.prototype.playTurn = function(row, column) { this.board[row][column] = this.current_player; - if (this.current_player === 1) { + this.checkWinningBoard(); + if (this.winner === this.current_player) { + return; + // deal with winning here + } else if (this.current_player === 1) { this.current_player = 2; this.current_player_marker = "🙈"; } @@ -19,6 +24,14 @@ TicTacToe.prototype.play_turn = function(row, column) { } }; + +TicTacToe.prototype.checkWinningBoard = function() { + if ((this.board[0][0] === this.current_player) && (this.board[0][1] === this.current_player) && (this.board[0][2] === this.current_player)) { + this.winner = this.current_player; + } +}; + + $(document).ready(function() { var game = new TicTacToe(); @@ -28,7 +41,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(0,0); + game.playTurn(0,0); }); $(".row_1.column_2").click(function(){ @@ -36,7 +49,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(0,1); + game.playTurn(0,1); }); $(".row_1.column_3").click(function(){ @@ -44,7 +57,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(0,2); + game.playTurn(0,2); }); $(".row_2.column_1").click(function(){ @@ -52,7 +65,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(1,0); + game.playTurn(1,0); }); $(".row_2.column_2").click(function(){ @@ -60,7 +73,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(1,1); + game.playTurn(1,1); }); $(".row_2.column_3").click(function(){ @@ -68,7 +81,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(1,2); + game.playTurn(1,2); }); $(".row_3.column_1").click(function(){ @@ -76,7 +89,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(2,0); + game.playTurn(2,0); }); $(".row_3.column_2").click(function(){ @@ -84,7 +97,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(2,1); + game.playTurn(2,1); }); $(".row_3.column_3").click(function(){ @@ -92,7 +105,7 @@ $(document).ready(function() { throw new Error ("This spot is already claimed!"); } $(this).text(game.current_player_marker); - game.play_turn(2,2); + game.playTurn(2,2); }); }); From 80cc514e7b1f6f5a7a30c3640c5cfd81039b74e9 Mon Sep 17 00:00:00 2001 From: Kelly Date: Thu, 28 Jan 2016 14:17:13 -0800 Subject: [PATCH 06/12] remove table when a player wins --- index.html | 5 ++++- tic-tac-toe.js | 4 ++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index eda07eb..117bdf8 100644 --- a/index.html +++ b/index.html @@ -12,7 +12,8 @@

Tic Tac Toe

- +
+
1, 1 @@ -47,6 +48,8 @@

Tic Tac Toe
+ +