From dce6c4ff60aef55dfff3db3141eeb9bcae2ac9ba Mon Sep 17 00:00:00 2001 From: Meira Tompkins Date: Mon, 2 Mar 2020 02:03:12 -0500 Subject: [PATCH] yrfbybhdbfdj --- week-6/js/tic-tac-toe.js | 154 ++++++++++++++++++++------------------- 1 file changed, 79 insertions(+), 75 deletions(-) diff --git a/week-6/js/tic-tac-toe.js b/week-6/js/tic-tac-toe.js index e6a584d..64c1d65 100644 --- a/week-6/js/tic-tac-toe.js +++ b/week-6/js/tic-tac-toe.js @@ -1,95 +1,99 @@ var app = new Vue({ el: '#vue-app', data: { - turn: 'x', + turn: 'X', board: [ [null, null, null], [null, null, null], [null, null, null] ] - }, - methods: { - changeIt: function(row,column){ - - this.board[row][column] = this.turn + }, - let winner = "Player" + this.turn + " you are a winner!"; + methods: { + changeIt: function(row, column){ + this.board[row][column] = this.turn; - if (this.board[0,0] == this.turn && this.board[0,1] == this.turn && this.board[0,2] == this.turn){ - document.getElementById("1").style.backgroundcolor = "green"; - document.getElementById("2").style.backgroundcolor = "green"; - document.getElementById("3").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); - - }else if (this.board[0,0] == this.turn && this.board[1,0] == this.turn && this.board[2,0] == this.turn){ - document.getElementById("1").style.backgroundcolor = "green"; - document.getElementById("4").style.backgroundcolor = "green"; - document.getElementById("7").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + let winner = "Congratulations, Player " + this.turn + ", YOU WIN!" - }else if (this.board[1,0] == this.turn && this.board[1,1] == this.turn && this.board[1,2] == this.turn) { - document.getElementById("4").style.backgroundcolor = "green"; - document.getElementById("5").style.backgroundcolor = "green"; - document.getElementById("6").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + // add logic to check if someone one after each turn but before it says 'your turn _" + if (this.board [0][0] == this.turn && this.board [0][1] && this.board[0][2] == this.turn){ + document.getElementById("1").style.backgroundcolor = "blue"; + document.getElementById("2").style.backgroundcolor = "blue"; + document.getElementById("3").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); + + }else if (this.board [0][0] == this.turn && this.board [1][0]== this.turn && this.board [2][0] == this.turn){ + document.getElementById("1").style.backgroundcolor = "blue"; + document.getElementById("4").style.backgroundcolor = "blue"; + document.getElementById("7").style.backgroundcolor = "blue"; + window.location.reload(); + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); - }else if (this.board[2,0] == this.turn && this.board[2,1] == this.turn && this.board[2,2] == this.turn) { - document.getElementById("7").style.backgroundcolor = "green"; - document.getElementById("8").style.backgroundcolor = "green"; - document.getElementById("9").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + }else if (this.board [1][0] == this.turn && this.board [1][1] == this.turn && this.board [1][2] == this.turn){ + document.getElementById("4").style.backgroundcolor = "blue"; + document.getElementById("5").style.backgroundcolor = "blue"; + document.getElementById("6").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); - }else if (this.board[0,1] == this.turn && this.board[1,1] == this.turn && this.board[2,1] == this.turn) { - document.getElementById("2").style.backgroundcolor = "green"; - document.getElementById("5").style.backgroundcolor = "green"; - document.getElementById("8").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + }else if (this.board [2][0] == this.turn && this.board [2][1] == this.turn && this.board [2][2] == this.turn){ + document.getElementById("7").style.backgroundcolor = "blue"; + document.getElementById("8").style.backgroundcolor = "blue"; + document.getElementById("9").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); - }else if (this.board[0,2] == this.turn && this.board[1,2] == this.turn && this.board[2,2] == this.turn) { - document.getElementById("3").style.backgroundcolor = "green"; - document.getElementById("6").style.backgroundcolor = "green"; - document.getElementById("9").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + }else if (this.board [0][1] == this.turn && this.board [1][1] == this.turn && this.board [2][1] == this.turn){ + document.getElementById("2").style.backgroundcolor = "blue"; + document.getElementById("5").style.backgroundcolor = "blue"; + document.getElementById("8").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); - }else if (this.board[0,0] == this.turn && this.board[1,1] == this.turn && this.board[2,2] == this.turn) { - document.getElementById("1").style.backgroundcolor = "green"; - document.getElementById("5").style.backgroundcolor = "green"; - document.getElementById("9").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); + }else if (this.board [0][2] == this.turn && this.board [1][2] == this.turn && this.board [2][2] == this.turn){ + document.getElementById("3").style.backgroundcolor = "blue"; + document.getElementById("6").style.backgroundcolor = "blue"; + document.getElementById("9").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); + + }else if (this.board [0][0] == this.turn && this.board [1][1] == this.turn && this.board [2][2] == this.turn){ + document.getElementById("1").style.backgroundcolor = "blue"; + document.getElementById("5").style.backgroundcolor = "blue"; + document.getElementById("9").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); + + }else if (this.board [2][0] == this.turn && this.board [1][1] == this.turn && this.board [0][2] == this.turn){ + document.getElementById("3").style.backgroundcolor = "blue"; + document.getElementById("5").style.backgroundcolor = "blue"; + document.getElementById("7").style.backgroundcolor = "blue"; + alert(winner); + setTimeout(function(){ + if(!alert('Play Again?')){window.location.reload();} + }, 0500); + } + + this.turn = (this.turn == "X")? 'O' : 'X'; - }else if (this.board [2,0] == this.turn && this.board [1,1] == this.turn && this.board [0,2] == this.turn){ - document.getElementById("3").style.backgroundcolor = "green"; - document.getElementById("5").style.backgroundcolor = "green"; - document.getElementById("6").style.backgroundcolor = "green"; - alert(winner); - setTimeout(function(){ - if(!alert('Play Again?')){window.location.reload();} - }, 0500); - } - - this.turn = (this.turn == 'x') ? 'o' : 'x'; } } + }); \ No newline at end of file