From 6adcb75a1cdf685998df417c8795b5b42568d900 Mon Sep 17 00:00:00 2001 From: Apple Date: Sun, 14 Jun 2020 22:33:19 -0500 Subject: [PATCH 1/3] initial commit my TTT game --- .vscode/settings.json | 2 +- main.js | 96 ++++++++++++++++++++++++++++++++++++++----- 2 files changed, 87 insertions(+), 11 deletions(-) diff --git a/.vscode/settings.json b/.vscode/settings.json index aef8443..cbb7b3a 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,3 @@ { - "liveServer.settings.port": 5501 + "liveServer.settings.port": 5502 } \ No newline at end of file diff --git a/main.js b/main.js index 2994e56..10a1af0 100644 --- a/main.js +++ b/main.js @@ -31,26 +31,100 @@ const printBoard = () => { console.log(' ---------'); console.log('2 ' + board[2].join(' | ')); } - +// if a player won horizontally on any column return true otherwise return false const horizontalWin = () => { - // Your code here to check for horizontal wins -} +for(let i =0; i < 3; i++){ + if(board[i][0]== board[i][1]== board[i][2]){ + return true; + } + else{ + return false; + } +} + +} +// if a player won vertically on any row,return true otherwise return false const verticalWin = () => { - // Your code here to check for vertical wins + for(let i =0; i < 3; i++){ + if(board[0][i]== board[1][i]== board[2][i]){ + + return true; + } + + + else{ + return false; + } +} } + +// if a player won diagonally on any diagonal,return true otherwise return false const diagonalWin = () => { - // Your code here to check for diagonal wins + for(let i =0; i < 3; i++){ + if(board[0][0]== board[1][1] && board[1][1]==board[2][2] || board[2][0]== board[1][1] && board[1][1]== board[0][2]){ + console.log('player win') + + } + } } -const checkForWin = () => { - // Your code here call each of the check for types of wins -} + + const checkForWin = () => { + if(horizontalWin() || verticalWin() || diagonalWin()) { + console.log(`Player ${currentMarker} won!`) + } else { + changeMarker() + } + } const ticTacToe = (row, column) => { - // Your code here to place a marker on the board - // then check for a win + board[row][column] = playerTurn + if(board[0][0]){ + changeMarker[0][0] + } + else if(board[0][1]){ + changeMarker[0][1] + } + else if(board[0][1]){ + changeMarker[0][2] + } + else if(board[1][0]){ + changeMarker[1][0] + } + else if(board[1][1]){ + changeMarker[1][1] + } + else if(board[1][2]){ + changeMarker[1][2] + } + else if(board[2][0]){ + changeMarker[2][0] + } + else if(board[2][1]){ + changeMarker[2][1] + } + else if(board[2][2]){ + changeMarker[2][2] + } + + + const changeMarker = () => { + if(currentMarker === "X"){ + currentMarker = "O" + } else { + currentMarker = "X" + + + } + const resetBoard = () => { + for (i=0; i < board.length; i++) { + console.log(board[i].id) + board[i] = null + + } + } const getPrompt = () => { @@ -100,3 +174,5 @@ if (typeof describe === 'function') { getPrompt(); } + } + } From 6ae1d0a753b499ff0a8e71e1ab7bd4aa638ebbfe Mon Sep 17 00:00:00 2001 From: Apple Date: Sun, 21 Jun 2020 12:19:24 -0500 Subject: [PATCH 2/3] initial commit my ttt gui --- index.html | 60 +++++++-------- main.js | 204 ++++++++++---------------------------------------- tictactoe.css | 21 +++++- 3 files changed, 90 insertions(+), 195 deletions(-) diff --git a/index.html b/index.html index 10a15d1..83cd902 100644 --- a/index.html +++ b/index.html @@ -3,40 +3,40 @@ Tic Tac Toe - + - + -
-
-

Welcome to Tic Tac Toe

-

Get ready to play!

- - -
+

TIC TAC TOE Game

+ + + +
+ + + + + + + + + + + + + + + + + +
- - - - - - - - - - - - - - - - - - -
-
- + + + + + diff --git a/main.js b/main.js index 10a1af0..fb448ab 100644 --- a/main.js +++ b/main.js @@ -1,178 +1,56 @@ 'use strict'; -// brings in the assert module for unit testing -const assert = require('assert'); -// brings in the readline module to access the command line -const readline = require('readline'); -// use the readline module to print out to the command line -const rl = readline.createInterface({ - input: process.stdin, - output: process.stdout -}); - -// creates and empty "board" for the user to see where marks can be placed. -// using let because the variable is expected to change with more 'X's and 'O's to add -let board = [ - [' ', ' ', ' '], - [' ', ' ', ' '], - [' ', ' ', ' '] -]; - -// assigns the first mark as 'X' -// using let because the variable is expected to change from 'X' to 'O' and back -let playerTurn = 'X'; - -// is a function that print the current status of the board using the variable - board -const printBoard = () => { - console.log(' 0 1 2'); - console.log('0 ' + board[0].join(' | ')); - console.log(' ---------'); - console.log('1 ' + board[1].join(' | ')); - console.log(' ---------'); - console.log('2 ' + board[2].join(' | ')); -} -// if a player won horizontally on any column return true otherwise return false -const horizontalWin = () => { -for(let i =0; i < 3; i++){ - if(board[i][0]== board[i][1]== board[i][2]){ - return true; - +document.turn = "X"; + +function move(square){ + if (square.innerText == ''){ + + square.innerText = document.turn + switchTurn(); + + }else{ + console.log('pick another square') } - else{ - return false; + + + } +function switchTurn(){ + if (checkwinner(document.turn)){ + console.log(document.getElementById('message').innerText= `${document.turn} is winner`) } -} - -} -// if a player won vertically on any row,return true otherwise return false -const verticalWin = () => { - for(let i =0; i < 3; i++){ - if(board[0][i]== board[1][i]== board[2][i]){ - - return true; + if(document.turn == "X"){ + document.turn = "O" } - - else{ - return false; + document.turn = "X" } -} -} - - -// if a player won diagonally on any diagonal,return true otherwise return false -const diagonalWin = () => { - for(let i =0; i < 3; i++){ - if(board[0][0]== board[1][1] && board[1][1]==board[2][2] || board[2][0]== board[1][1] && board[1][1]== board[0][2]){ - console.log('player win') - } - } + } + function checkwinner(move){ +var result = false +if(checkRow(1,2,3,move)|| +checkRow(4,5,6,move)|| +checkRow(7,8,9,move)|| +checkRow(1,4,7,move)|| +checkRow(2,5,8,move)|| +checkRow(3,6,9,move)|| +checkRow(1,5,9,move)|| +checkRow(3,5,7,move)){ + return true; } - - - const checkForWin = () => { - if(horizontalWin() || verticalWin() || diagonalWin()) { - console.log(`Player ${currentMarker} won!`) - } else { - changeMarker() - } - } - -const ticTacToe = (row, column) => { - board[row][column] = playerTurn - if(board[0][0]){ - changeMarker[0][0] - } - else if(board[0][1]){ - changeMarker[0][1] - } - else if(board[0][1]){ - changeMarker[0][2] - } - else if(board[1][0]){ - changeMarker[1][0] - } - else if(board[1][1]){ - changeMarker[1][1] - } - else if(board[1][2]){ - changeMarker[1][2] - } - else if(board[2][0]){ - changeMarker[2][0] - } - else if(board[2][1]){ - changeMarker[2][1] - } - else if(board[2][2]){ - changeMarker[2][2] - } - - - const changeMarker = () => { - if(currentMarker === "X"){ - currentMarker = "O" - } else { - currentMarker = "X" - - - } - const resetBoard = () => { - for (i=0; i < board.length; i++) { - console.log(board[i].id) - board[i] = null - - } +result = true; + } +function checkRow(a,b,c, move){ +var result = false +if(getbox(a)== move && getbox(b)== move && getbox(c)== move){ + result = true } - -const getPrompt = () => { - printBoard(); - console.log("It's Player " + playerTurn + "'s turn."); - rl.question('row: ', (row) => { - rl.question('column: ', (column) => { - ticTacToe(row, column); - getPrompt(); - }); - }); +return result } +function getbox(number){ +return document.getElementById("b"+number).innerText +} -// Unit Tests -// You use them run the command: npm test main.js -// to close them ctrl + C -if (typeof describe === 'function') { - - describe('#ticTacToe()', () => { - it('should place mark on the board', () => { - ticTacToe(1, 1); - assert.deepEqual(board, [ [' ', ' ', ' '], [' ', 'X', ' '], [' ', ' ', ' '] ]); - }); - it('should alternate between players', () => { - ticTacToe(0, 0); - assert.deepEqual(board, [ ['O', ' ', ' '], [' ', 'X', ' '], [' ', ' ', ' '] ]); - }); - it('should check for vertical wins', () => { - board = [ [' ', 'X', ' '], [' ', 'X', ' '], [' ', 'X', ' '] ]; - assert.equal(verticalWin(), true); - }); - it('should check for horizontal wins', () => { - board = [ ['X', 'X', 'X'], [' ', ' ', ' '], [' ', ' ', ' '] ]; - assert.equal(horizontalWin(), true); - }); - it('should check for diagonal wins', () => { - board = [ ['X', ' ', ' '], [' ', 'X', ' '], [' ', ' ', 'X'] ]; - assert.equal(diagonalWin(), true); - }); - it('should detect a win', () => { - assert.equal(checkForWin(), true); - }); - }); -} else { - - getPrompt(); -} - } - } diff --git a/tictactoe.css b/tictactoe.css index 4526ff0..76c22a6 100644 --- a/tictactoe.css +++ b/tictactoe.css @@ -1,7 +1,24 @@ + + body{ + justify-content: center; + margin-left: 500px; + } + +tr{ + display: grid; + grid-template-columns: 100px 100px 100px; + height: 200px; + text-align: center; + justify-content: center; + margin-top: 30px; +} td{ - height:150px; - width:150px; + border: 1px solid; text-align: center; border: 5px solid black; font-size: 100px; + height: 150px; + + } + From 3632da55bf00e63fdb19ff7abc2dfdb66643fe1b Mon Sep 17 00:00:00 2001 From: Apple Date: Sun, 21 Jun 2020 12:32:22 -0500 Subject: [PATCH 3/3] commit my changes --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 83cd902..b353d1d 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@

TIC TAC TOE Game

- +