diff --git a/dom-tictactoe.js b/dom-tictactoe.js index b585e75..c800416 100644 --- a/dom-tictactoe.js +++ b/dom-tictactoe.js @@ -30,12 +30,12 @@ const addMarker = (id) => { console.log(`We'll place a mark on square: ${id}`) // @TODO, Mix & Match. // You will need the following pieces: - + document.getElementById(id).innerHTML = currentMarker // = currentMarker // .getElementById(id) // document // .innerHTML - + // Arrange the above pieces into one a single line of code // to add an X or O to the board to the DOM so it can be scene on the screen. } @@ -45,11 +45,12 @@ const updateBoard = (id) => { // parses the id string into a number then captures the first and last part the newly create number as row & column const row = parseInt(id.charAt(0)) const column = parseInt(id.charAt(2)) - console.log(`you clicked the sq at ${row} and ${column}`) console.log(board) // @TODO, Your code here: use the above information to change the board variable(array of arrays) + board[row][column] = currentMarker + // HINT: in your browser open up the dev tools -> console } @@ -61,20 +62,46 @@ const checkForWin = () => { } else { // if no win, change the marker from X to O, or O to X for the next player. changeMarker() - } + } } const horizontalWin = () => { - // @TODO, Your code here: to check for horizontal wins -} - -const verticalWin = () => { - // @TODO, Your code here: to check for vertical wins + // Your code here to check for horizontal wins + if((board[0][0] == "X" && board[0][1] == "X" && board[0][2] == "X") || (board[0][0] == "O" && board[0][1] == "O" && board[0][2] == "O")) { + return true + } else if((board[1][0] == "X" && board[1][1] == "X" && board[1][2] == "X") || (board[1][0] == "O" && board[1][1] == "O" && board[1][2] == "O")) { + return true + } else if((board[2][0] == "X" && board[2][1] == "X" && board[2][2] == "X") || (board[2][0] == "O" && board[2][1] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } } -const diagonalWin = () => { - // @TODO, Your code here: to check for diagonal wins -} + const verticalWin = () => { + // Your code here to check for vertical wins + + if((board[0][0] == "X" && board[1][0] == "X" && board[2][0] == "X") || (board[0][0] == "O" && board[1][0] == "O" && board[2][0] == "O")) { + return true + } else if ((board[0][1] == "X" && board[1][1] == "X" && board[2][1] == "X") || (board[0][1] == "O" && board[1][1] == "O" && board[2][1] == "O")) { + return true + } else if ((board[0][2] == "X" && board[1][2] == "X" && board[2][2] == "X") || (board[0][2] == "O" && board[1][2] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } + } + + const diagonalWin = () => { + // Your code here to check for diagonal wins + if((board[0][0] == "X" && board[1][1] == "X" && board[2][2] == "X") || (board[0][0] == "O" && board[1][1] == "O" && board[2][2] == "O")) { + return true + } else if((board[2][0] == "X" && board[2][1] == "X" && board[2][2] == "X") || (board[2][0] == "O" && board[2][1] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } + } const changeMarker = () => { // ternary operator: if it's an X make it an O, if O make it an X @@ -95,6 +122,12 @@ const resetBoard = () => { } // @TODO, Your code here: make sure to reset the array of arrays to empty for a new game + board = [ + ["", "", ""], + ["", "", ""], + ["", "", ""] +] + } // **BONUSES** diff --git a/index.html b/index.html index 10a15d1..8538886 100644 --- a/index.html +++ b/index.html @@ -6,8 +6,7 @@ - - +
@@ -38,5 +37,7 @@

Welcome to Tic Tac Toe

+ + diff --git a/main.js b/main.js index 2994e56..b46c6ed 100644 --- a/main.js +++ b/main.js @@ -10,6 +10,8 @@ const rl = readline.createInterface({ output: process.stdout }); +//START HERE// + // 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 = [ @@ -22,6 +24,7 @@ let board = [ // 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'); @@ -34,25 +37,85 @@ const printBoard = () => { const horizontalWin = () => { // Your code here to check for horizontal wins + if((board[0][0] == "X" && board[0][1] == "X" && board[0][2] == "X") || (board[0][0] == "O" && board[0][1] == "O" && board[0][2] == "O")) { + return true + } else if((board[1][0] == "X" && board[1][1] == "X" && board[1][2] == "X") || (board[1][0] == "O" && board[1][1] == "O" && board[1][2] == "O")) { + return true + } else if((board[2][0] == "X" && board[2][1] == "X" && board[2][2] == "X") || (board[2][0] == "O" && board[2][1] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } + // it('should check for horizontal wins', () => { + // board = [ ['X', 'X', 'X'], [' ', ' ', ' '], [' ', ' ', ' '] ]; + // assert.equal(horizontalWin(), true); + // }); } const verticalWin = () => { // Your code here to check for vertical wins + + if((board[0][0] == "X" && board[1][0] == "X" && board[2][0] == "X") || (board[0][0] == "O" && board[1][0] == "O" && board[2][0] == "O")) { + return true + } else if ((board[0][1] == "X" && board[1][1] == "X" && board[2][1] == "X") || (board[0][1] == "O" && board[1][1] == "O" && board[2][1] == "O")) { + return true + } else if ((board[0][2] == "X" && board[1][2] == "X" && board[2][2] == "X") || (board[0][2] == "O" && board[1][2] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } + // it('should check for vertical wins', () => { + // board = [ [' ', 'X', ' '], [' ', 'X', ' '], [' ', 'X', ' '] ]; + // assert.equal(verticalWin(), true); + // }); } const diagonalWin = () => { // Your code here to check for diagonal wins -} - -const checkForWin = () => { - // Your code here call each of the check for types of wins + if((board[0][0] == "X" && board[1][1] == "X" && board[2][2] == "X") || (board[0][0] == "O" && board[1][1] == "O" && board[2][2] == "O")) { + return true + } else if((board[2][0] == "X" && board[2][1] == "X" && board[2][2] == "X") || (board[2][0] == "O" && board[2][1] == "O" && board[2][2] == "O")) { + return true + } else { + return false + } + // it('should check for diagonal wins', () => { + // board = [ ['X', ' ', ' '], [' ', 'X', ' '], [' ', ' ', 'X'] ]; + // assert.equal(diagonalWin(), true); + // }); } const ticTacToe = (row, column) => { // Your code here to place a marker on the board // then check for a win + board[row][column] = playerTurn + + checkForWin() + +} + +const changeMarker = () => { + if(playerTurn === "X"){ + playerTurn = "O" + } else { + playerTurn = "X" + } } +const checkForWin = () => { + // Your code here call each of the check for types of wins + if(horizontalWin() || verticalWin() || diagonalWin()) { + console.log(`Player ${playerTurn} won!`) + return true + } else { + changeMarker() + } + } + + // it('should detect a win', () => { + // assert.equal(checkForWin(), true); + // }); + const getPrompt = () => { printBoard(); console.log("It's Player " + playerTurn + "'s turn.");