Question: Javascript i need help adding this to my switchTurn function Implement switchTurn() part 2: checking for a winner (3 points) Add logic to the switchTurn()

Javascript

i need help adding this to my switchTurn function

Implement switchTurn() part 2: checking for a winner (3 points)

Add logic to the switchTurn() function that checks for a winner before the turn switch.

  • If the board contains 3 X's in a row, display the text "You win!" in the turn info div.
  • If the board contains 3 O's in a row, display the text "Computer wins!" in the turn info div.
  • If the board is full without either the player or computer having won, display the text "Draw game" in the turn info div.

my code is :

var playerTurn = true;

var count=0;

var computerMoveTimeout = 0;

// Returns an array of 9 elements that make up the game board. The first 3

// elements are the top row, the next 3 the middle row, and the last 3 the

// bottom row.

function getGameBoard() {

var gameBoardTable = document.getElementById("gameBoard");

var result = [];

for (var i = 0; i < 3; i++) {

for (var j = 0; j < 3; j++) {

result.push(gameBoardTable.rows[i].cells[j]);

}

}

return result;

}

function start() {

// Setup the click event for the "New game" button

var newBtn = document.getElementById("newGameButton");

newBtn.addEventListener("click", newGame);

// Create click-event listeners for each cell in the game board

var cells = getGameBoard();

for (let cell of cells) {

cell.addEventListener("click", function() { cellClicked(cell); });

}

// Call the newGame function to make sure the board is clear

newGame();

}

function newGame() {

// Use clearTimeout to clear the computer's move timeout and then set computerMoveTimeout back to 0

clearTimeout(computerMoveTimeout);

computerMoveTimeout = 0;

var spaces = getGameBoard();

for(let space of spaces) {

space.innerHTML = " "

}

// Reset to the player's turn by setting playerTurn to true

playerTurn = true;

// Set the text of the turn information div to "Your turn"

document.getElementById("turnInfo").textContent = "Your turn";

}

function cellClicked(cell) {

// If playerTurn is true and the clicked cell is empty:

// Set the cell's innerHTML to "X"

// Set the cell's style color to "red"

// Call switchTurn()

if(playerTurn && (cell.innerHTML!="X" && cell.innerHTML!="O")){

cell.innerHTML="X";

cell.style.color="red";

count++;

switchTurn();

}

}

function switchTurn() {

// 1. If switching from the player's turn to the computer's turn, use setTimeout to call makeComputerMove after 1 second

// (1000 milliseconds). Assign the return value of setTimeout to computerMoveTimeout. The timeout simulates the computer

// "thinking", and prevents the nearly-instant response to each player move that would occur from a direct call.

// 2. Toggle playerTurn's value from false to true or from true to false.

// playerTurn = !playerTurn;

// 3. Set the turn information div's text content to "Your turn" if playerTurn is true, or "Computer's turn"

// if playerTurn is false.

computerMoveTimeout = playerTurn? setTimeout(makeComputerMove(), 1000) : 0; // if switching from player turn, computerMoveTimeout = 1000ms

playerTurn = !playerTurn; // p->c or c->p

document.getElementById("turnInfo").textContent = playerTurn? "Your turn" : "Computer's turn"; // if now player turn, turnInfo div innerHTML = "Your turn"

}

function makeComputerMove() {

var board= getGameBoard();

var index= Math.floor(Math.random()*100);

index=index%9;

var space=board[index];

if(count<9){

while(space.innerHTML=="X" || space.innerHTML=="O"){

var index=Math.floor(Math.random()*100);

index=index%9;

var space=board[index];

}

if(playerTurn){

space.innerHTML="X";

space.style.color="red";

}

else{

space.innerHTML="O";

space.style.color="blue";

}

count++;

switchTurn();

}

}

Here is the HTML (which cannot be changed)

Tic-Tac-Toe

TURN INFO

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!