[Teaching the Computer to Play Tic-Tac-Toe] Need help!
Posted: Fri Mar 06, 2009 7:20 pm
In the following project : Teaching the Computer to Play Tic-Tac-Toe: https://www.sciencebuddies.org/science- ... y&from=TSW
The instructions are not very clear on how to set up a "Game over" function and a check win function. I found by googling a finished product of a Tic Tac Toe game to find out where to put the check win. I do not know where to put the "if game over function". When I insert it the buttons on the game do not click. The buttons just wont click. Also the due date is Wednesday March 11. Please help me thankyou.Here is my somewhat final code that I come up with and I need help on what I did wrong.
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
if(gameOver)
{
alert("The game is already over.");
return;
}
{
var status = document.getElementById('status');
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
numMoves++;
square.value = 'X';
xTurn = false;
status.innerHTML = 'O\'s turn';
}
else
{
numMoves++;
square.value = 'O';
xTurn = true;
status.innerHTML = 'X\'s turn';
}
}
else
alert('That square has already been played.');
}
var winner = checkWin();
if(!winner)
{
//check to see if there is a tie
if(numMoves = 9)
status.innerHTML = 'Tie Game!';
}
else
gameOver = true;
if(gameOver)
{
alert("The game is already over.");
return;
}
function newgame()
{
var status = document.getElementById('status');
var gameOver = false;
var numMoves = 0;
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < 3; x++)
{
for(var y = 0; y < 3; y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
function checkWin()
{
var status = document.getElementById('status');
var val0;
var val1;
var val2;
// check columns
for(var y = 0; y < 3; y++)
{
val0 = document.getElementById('0_'+y).value;
val1 = document.getElementById('1_'+y).value;
val2 = document.getElementById('2_'+y).value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check rows
for(var x = 0; x < 3; x++)
{
val0 = document.getElementById(x + '_0').value;
val1 = document.getElementById(x + '_1').value;
val2 = document.getElementById(x + '_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check top left to lower right diagonal
val0 = document.getElementById('0_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('2_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// check lower left to top right diagonal
val0 = document.getElementById('2_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('0_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// no winner yet return false;
}
</SCRIPT>
<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame();checkWin();numMoves = 0;gameOver = false;">
<br>
<INPUT TYPE="BUTTON" ID="0_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<INPUT TYPE="BUTTON" ID="0_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<INPUT TYPE="BUTTON" ID="0_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<P ID="status">X's turn</P>
Thankyou In Advance
The instructions are not very clear on how to set up a "Game over" function and a check win function. I found by googling a finished product of a Tic Tac Toe game to find out where to put the check win. I do not know where to put the "if game over function". When I insert it the buttons on the game do not click. The buttons just wont click. Also the due date is Wednesday March 11. Please help me thankyou.Here is my somewhat final code that I come up with and I need help on what I did wrong.
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
if(gameOver)
{
alert("The game is already over.");
return;
}
{
var status = document.getElementById('status');
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
numMoves++;
square.value = 'X';
xTurn = false;
status.innerHTML = 'O\'s turn';
}
else
{
numMoves++;
square.value = 'O';
xTurn = true;
status.innerHTML = 'X\'s turn';
}
}
else
alert('That square has already been played.');
}
var winner = checkWin();
if(!winner)
{
//check to see if there is a tie
if(numMoves = 9)
status.innerHTML = 'Tie Game!';
}
else
gameOver = true;
if(gameOver)
{
alert("The game is already over.");
return;
}
function newgame()
{
var status = document.getElementById('status');
var gameOver = false;
var numMoves = 0;
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < 3; x++)
{
for(var y = 0; y < 3; y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
function checkWin()
{
var status = document.getElementById('status');
var val0;
var val1;
var val2;
// check columns
for(var y = 0; y < 3; y++)
{
val0 = document.getElementById('0_'+y).value;
val1 = document.getElementById('1_'+y).value;
val2 = document.getElementById('2_'+y).value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check rows
for(var x = 0; x < 3; x++)
{
val0 = document.getElementById(x + '_0').value;
val1 = document.getElementById(x + '_1').value;
val2 = document.getElementById(x + '_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check top left to lower right diagonal
val0 = document.getElementById('0_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('2_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// check lower left to top right diagonal
val0 = document.getElementById('2_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('0_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// no winner yet return false;
}
</SCRIPT>
<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame();checkWin();numMoves = 0;gameOver = false;">
<br>
<INPUT TYPE="BUTTON" ID="0_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_0" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<INPUT TYPE="BUTTON" ID="0_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_1" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<INPUT TYPE="BUTTON" ID="0_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="1_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<INPUT TYPE="BUTTON" ID="2_2" VALUE=" " ONCLICK="squareclicked(this);checkWin();">
<BR>
<P ID="status">X's turn</P>
Thankyou In Advance