Science Buddies: "Ask an Expert"

If you have a question about your science fair project, you are in the right place!

Skip to content

Finished tic tac toe project - thank you science buddies!

Ask questions about projects relating to: computer science or pure mathematics (such as probability, statistics, geometry, etc...).

Moderators: MelissaB, kgudger, Ray Trent, Moderators

Post a reply

Finished tic tac toe project - thank you science buddies!

Postby sez » Wed Jan 17, 2007 8:29 pm

http://www.geocities.com/jinzo1425/index.html

That's where my program is currently. I just wanted to drop by and say thanks to science buddies because without your tutorial I wouldnt have a project! :D I was able to figure out a way to make the AI and now it's (hypothetically) unbeatable. Here's the code, welcome for reference for anybody else doing the project and thank you once again! (note that the pictures are not in there, I made them myself..)

<html>
<head>
Tic-Tac-Toe V.1.0 - finished 8:09 pm, 1/17/07 <br><br>
Note: This is the first working version of a one player tic-tac-toe game. It recognizes wins, losses and ties and records them. Moves are counted and recorded but resets once the new game button is clicked. It features a status bar where it says whose turn it is and who wins the game (or if it is a tie), and there is also a scorecard where it keeps track of wins, losses, ties and games played for the player. The opponent is the computer, and though it is hypothetical, I dont believe that it could be beaten.
<title>Tic-Tac-Toe V.1.0</title>
<script type="TEXT/JAVASCRIPT">
// Global Variables
var turnX = true;
var gameOver = false;
var moveCount = 0;
var gameCount = 0;
var tieCount = 0;
var winsX = 0;
var winsO = 0;
var AImove = false;
var sq1 = 3;
var sq2 = 2;
var sq3 = 3;
var sq4 = 2;
var sq5 = 4;
var sq6 = 2;
var sq7 = 3;
var sq8 = 2;
var sq9 = 3;

function clicked(square)
{
var status = document.getElementById('status');
var moveTicker = document.getElementById('moveTicker');
var value = square.value;
var move1 = document.getElementById('2_0').value;

if(gameOver)
{
AImove = false;
alert('The game is already over.')
return;
}


if(value != 'X' && value != 'O')
{
if(turnX)
{
moveCount++;
square.value="X";
turnX = false;
AImove = true;
status.innerHTML = 'O\'s turn';
moveTicker.innerHTML = moveCount;
}

if(AImove)
{
makeMove()
status.innerHTML = 'X\'s turn';
turnX = true;

}

}
else
alert('You cannot play that square.');


var winner = checkWin();
if(!winner)
{
if(moveCount == 9)
status.innerHTML = 'Tie Game!';
}
else
gameOver = true;

}

// starts new game
function newgame()
{
var tieDisplay = document.getElementById('tieDisplay')
var status = document.getElementById('status');

turnX = 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 = ' ';
moveCount = 0;
moveTicker.innerHTML = moveCount;
gameOver = false;
}
}
}
function checkWin()

{
//variables
var noGames = document.getElementById('gameCount');
var status = document.getElementById('status')
var checkXwin = document.getElementById('winsX')
var checkOwin = document.getElementById('winsO')
var val1;
var val2;
var val3;

//tie check

if(moveCount == 9)
{
gameCount++;
tieCount++;
tieDisplay.innerHTML = tieCount;
noGames.innerHTML = gameCount;
gameOver = true;
}
else
gameOver = false;

//columns

{

val1 = document.getElementById('0_0').value;
val2 = document.getElementById('1_0').value;
val3 = document.getElementById('2_0').value;
{
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
//row 2
{
val1 = document.getElementById('0_1').value;
val2 = document.getElementById('1_1').value;
val3 = document.getElementById('2_1').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
//row 3
{
val1 = document.getElementById('0_2').value;
val2 = document.getElementById('1_2').value;
val3 = document.getElementById('2_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
// column 1
{
val1 = document.getElementById('0_0').value;
val2 = document.getElementById('0_1').value;
val3 = document.getElementById('0_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
//column 2
{
val1 = document.getElementById('1_0').value;
val2 = document.getElementById('1_1').value;
val3 = document.getElementById('1_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
//column 3
{
val1 = document.getElementById('2_0').value;
val2 = document.getElementById('2_1').value;
val3 = document.getElementById('2_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}
// diagonals
val1 = document.getElementById('0_0').value;
val2 = document.getElementById('1_1').value;
val3 = document.getElementById('2_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
}

val1 = document.getElementById('2_0').value;
val2 = document.getElementById('1_1').value;
val3 = document.getElementById('0_2').value;
if(val1 == 'X' && val2 == 'X' && val3 == 'X')
{
winsX++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'X WINS!';
movecount = 0
return true;
}
else if(val1 == 'O' && val2 == 'O' && val3 == 'O')
{
winsO++
checkXwin.innerHTML = winsX
checkOwin.innerHTML = winsO
gameCount++
noGames.innerHTML = gameCount;
status.innerHTML = 'O WINS!';
movecount = 0
return true;
}
return false;
}

//AI Function
//Points note: +10 block win, +15 block guaranteed opponent win, +20 guaranteed win/3-in-a-row
//Save this: document.getElementById(x + '_' + y).value = ' ';
function makeMove()
{
sq1 = 3;
sq2 = 2;
sq3 = 3;
sq4 = 2;
sq5 = 4;
sq6 = 2;
sq7 = 3;
sq8 = 2;
sq9 = 3;
var checkSq1;
var checkSq2;
var checkSq3;
var checkSq4;
var checkSq5;
var checkSq6;
var checkSq7;
var checkSq8;
var checkSq9;

{
checkSq1 = document.getElementById('0_0').value;
checkSq2 = document.getElementById('1_0').value;
checkSq3 = document.getElementById('2_0').value;
checkSq4 = document.getElementById('0_1').value;
checkSq5 = document.getElementById('1_1').value;
checkSq6 = document.getElementById('2_1').value;
checkSq7 = document.getElementById('0_2').value;
checkSq8 = document.getElementById('1_2').value;
checkSq9 = document.getElementById('2_2').value;
var status = document.getElementById('status');


if(checkSq1 != ' ')
{
sq1 = sq1 - 500
}
else if(checkSq2 != ' ')
{
sq2 = sq2 - 500
}
else if(checkSq3 != ' ')
{
sq3 = sq3 - 500
}
else if(checkSq4 != ' ')
{
sq4 = sq4 - 500
}
else if(checkSq5 != ' ')
{
sq5 = sq5 - 500
}
else if(checkSq6 != ' ')
{
sq6 = sq6 - 500
}
else if(checkSq7 != ' ')
{
sq7 = sq7 - 500
}
else if(checkSq8 != ' ')
{
sq8 = sq8 - 500
}
else if(checkSq9 != ' ')
{
sq9 = sq9 - 500
}

//Sneaky
if(checkSq5 == 'X' && checkSq9 == 'X' && checkSq3 == ' ')
{
sq3 = sq3 + 20
}
if(checkSq7 == 'X' && checkSq3 == 'X' && checkSq5 == 'O' && checkSq2 == ' ')
{
sq2 = sq2 + 20
}
if(checkSq8 == 'X' && checkSq6 == 'X' && checkSq5 == 'O' && checkSq9 == ' ')
{
sq9 = sq9 + 20
}
if(checkSq1 == 'O' && checkSq3 == 'X' && checkSq4 == 'X' && checkSq5 == 'O' && checkSq6 == 'O' && checkSq7 == 'X' && checkSq9 == 'X' && checkSq8 == ' ')
{
sq8 = sq8 + 20
}
//Row 1 (squares 1,2,3)

if(checkSq1 == 'X' && checkSq2 == 'X' && checkSq3 == ' ')
{
sq3 = sq3 + 10
}
else if(checkSq1 == 'O' && checkSq2 == 'O' && checkSq3 == ' ')
{
sq3 = sq3 + 20
}
else if(checkSq1 == 'X' && checkSq3 == 'X' && checkSq2 == ' ')
{
sq2 = sq2 + 10
}
else if(checkSq1 == 'O' && checkSq3 == 'O' && checkSq2 == ' ')
{
sq2 = sq2 + 20
}
else if(checkSq2 == 'X' && checkSq3 == 'X' && checkSq1 == ' ')
{
sq1 = sq1 + 10
}
else if(checkSq2 == 'O' && checkSq3 == 'O' && checkSq1 == ' ')
{
sq1 = sq1 + 10
}

// Row 2(squares 4,5,6)

else if(checkSq4 == 'X' && checkSq5 == 'X' && checkSq6 == ' ')
{
sq6 = sq6 + 10
}
else if(checkSq4 == 'O' && checkSq5 == 'O' && checkSq6 == ' ')
{
sq6 = sq6 + 20
}
else if(checkSq4 == 'X' && checkSq6 == 'X' && checkSq5 == ' ')
{
sq5 = sq5 + 10
}
else if(checkSq4 == 'O' && checkSq6 == 'O' && checkSq5 == ' ')
{
sq5 = sq5 + 20
}
else if(checkSq5 == 'X' && checkSq6 == 'X' && checkSq4 == ' ')
{
sq4 = sq4 + 10
}
else if(checkSq5 == 'O' && checkSq6 == 'O' && checkSq4 == ' ')
{
sq4 = sq4 + 10
}

//Row 3(squares 7,8,9)

else if(checkSq7 == 'X' && checkSq8 == 'X' && checkSq9 == ' ')
{
sq9 = sq9 + 10
}
else if(checkSq7 == 'O' && checkSq8 == 'O' && checkSq9 == ' ')
{
sq9 = sq9 + 20
}
else if(checkSq7 == 'X' && checkSq9 == 'X' && checkSq8 == ' ')
{
sq8 = sq8 + 10
}
else if(checkSq7 == 'O' && checkSq9 == 'O' && checkSq8 == ' ')
{
sq8 = sq8 + 20
}
else if(checkSq8 == 'X' && checkSq9 == 'X' && checkSq7 == ' ')
{
sq7 = sq7 + 10
}
else if(checkSq8 == 'O' && checkSq9 == 'O' && checkSq7 == ' ')
{
sq7 = sq7 + 10
}

// Column 1 (squares 1, 4, 7)

else if(checkSq1 == 'X' && checkSq4 == 'X' && checkSq7 == ' ')
{
sq7 = sq7 + 10
}
else if(checkSq1 == 'O' && checkSq4 == 'O' && checkSq7 == ' ')
{
sq7 = sq7 + 20
}
else if(checkSq1 == 'X' && checkSq6 == 'X' && checkSq4 == ' ')
{
sq4 = sq4 + 10
}
else if(checkSq1 == 'O' && checkSq7 == 'O' && checkSq4 == ' ')
{
sq4 = sq4 + 20
}
else if(checkSq4 == 'X' && checkSq7 == 'X' && checkSq4 == ' ')
{
sq1 = sq1 + 10
}
else if(checkSq4 == 'O' && checkSq7 == 'O' && checkSq4 == ' ')
{
sq1 = sq1 + 10
}

//Column 2 (squares 2,5,8)

else if(checkSq2 == 'X' && checkSq5 == 'X' && checkSq8 == ' ')
{
sq8 = sq8 + 10
}
else if(checkSq2 == 'O' && checkSq5 == 'O' && checkSq8 == ' ')
{
sq8 = sq8 + 20
}
else if(checkSq2 == 'X' && checkSq8 == 'X' && checkSq5 == ' ')
{
sq5 = sq5 + 10
}
else if(checkSq2 == 'O' && checkSq8 == 'O' && checkSq5 == ' ')
{
sq5 = sq5 + 20
}
else if(checkSq5 == 'X' && checkSq8 == 'X' && checkSq2 == ' ')
{
sq2 = sq2 + 10
}
else if(checkSq5 == 'O' && checkSq8 == 'O' && checkSq2 == ' ')
{
sq2 = sq2 + 10
}

//Column 3 (squares 3,6,9)

else if(checkSq3 == 'X' && checkSq6 == 'X' && checkSq9 == ' ')
{
sq9 = sq9 + 10
}
else if(checkSq3 == 'O' && checkSq6 == 'O' && checkSq9 == ' ')
{
sq9 = sq9 + 20
}
else if(checkSq3 == 'X' && checkSq9 == 'X' && checkSq6 == ' ')
{
sq6 = sq6 + 10
}
else if(checkSq3 == 'O' && checkSq9 == 'O' && checkSq6 == ' ')
{
sq6 = sq6 + 20
}
else if(checkSq6 == 'X' && checkSq9 == 'X' && checkSq3 == ' ')
{
sq3 = sq3 + 10
}
else if(checkSq6 == 'O' && checkSq9 == 'O' && checkSq3 == ' ')
{
sq3 = sq3 + 10
}

//Diagonal 1(squares 1,5,9)

else if(checkSq1 == 'X' && checkSq5 == 'X' && checkSq9 == ' ')
{
sq9 = sq9 + 10
}
else if(checkSq1 == 'O' && checkSq5 == 'O' && checkSq9 == ' ')
{
sq9 = sq9 + 20
}
else if(checkSq1 == 'X' && checkSq9 == 'X' && checkSq5 == ' ')
{
sq5 = sq2 + 10
}
else if(checkSq1 == 'O' && checkSq9 == 'O' && checkSq5 == ' ')
{
sq5 = sq2 + 20
}
else if(checkSq5 == 'X' && checkSq9 == 'X' && checkSq1 == ' ')
{
sq1 = sq1 + 10
}
else if(checkSq5 == 'O' && checkSq9 == 'O' && checkSq1 == ' ')
{
sq1 = sq1 + 10
}

//Diagonal 2(squares 3,5,7)

else if(checkSq3 == 'X' && checkSq5 == 'X' && checkSq7 == ' ')
{
sq7 = sq7 + 10
}
else if(checkSq3 == 'O' && checkSq5 == 'O' && checkSq7 == ' ')
{
sq7 = sq7 + 20
}
else if(checkSq3 == 'X' && checkSq7 == 'X' && checkSq5 == ' ')
{
sq5 = sq2 + 10
}
else if(checkSq3 == 'O' && checkSq7 == 'O' && checkSq5 == ' ')
{
sq5 = sq2 + 20
}
else if(checkSq5 == 'X' && checkSq7 == 'X' && checkSq3 == ' ')
{
sq3 = sq3 + 10
}
else if(checkSq5 == 'O' && checkSq7 == 'O' && checkSq3 == ' ')
{
sq3 = sq3 + 10
}


}

if(sq1 >= sq2 && sq1 >= sq3 && sq1 >= sq4 && sq1 >= sq5 && sq1 >= sq6 && sq1 >= sq7 && sq1 >= sq8 && sq1 >= sq9 && checkSq1 == ' ')
{
document.getElementById('0_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq2 >= sq1 && sq2 >= sq3 && sq2 >= sq4 && sq2 >= sq5 && sq2 >= sq6 && sq2 >= sq7 && sq2 >= sq8 && sq2 >= sq9 && checkSq2 == ' ')
{
document.getElementById('1_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq3 >= sq1 && sq3 >= sq2 && sq3 >= sq4 && sq3 >= sq5 && sq3 >= sq6 && sq3 >= sq7 && sq3 >= sq8 && sq3 >= sq9 && checkSq3 == ' ')
{
document.getElementById('2_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq4 >= sq2 && sq4 >= sq3 && sq4 >= sq1 && sq4 >= sq5 && sq4 >= sq6 && sq4 >= sq7 && sq4 >= sq8 && sq4 >= sq9 && checkSq4 == ' ')
{
document.getElementById('0_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq5 >= sq2 && sq5 >= sq3 && sq5 >= sq4 && sq5 >= sq1 && sq5 >= sq6 && sq5 >= sq7 && sq5 >= sq8 && sq5 >= sq9 && checkSq5 == ' ')
{
document.getElementById('1_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq6 >= sq2 && sq6 >= sq3 && sq6 >= sq4 && sq6 >= sq5 && sq6 >= sq1 && sq6 >= sq7 && sq6 >= sq8 && sq6 >= sq9 && checkSq6 == ' ')
{
document.getElementById('2_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq7 >= sq2 && sq7 >= sq3 && sq7 >= sq4 && sq7 >= sq5 && sq7 >= sq6 && sq7 >= sq1 && sq7 >= sq8 && sq7 >= sq9 && checkSq7 == ' ')
{
document.getElementById('0_2').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq8 >= sq2 && sq8 >= sq3 && sq8 >= sq4 && sq8 >= sq5 && sq8 >= sq6 && sq8 >= sq7 && sq8 >= sq1 && sq8 >= sq9 && checkSq8 == ' ')
{
document.getElementById('1_2').value = 'O';
AImove = !AImove
moveCount++;
}
else if(sq9 >= sq2 && sq9 >= sq3 && sq9 >= sq4 && sq9 >= sq5 && sq9 >= sq6 && sq9 >= sq7 && sq9 >= sq8 && sq9 >= sq1 && checkSq9 == ' ')
{
document.getElementById('2_2').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq1 == ' ')
{
document.getElementById('0_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq2 == ' ')
{
document.getElementById('1_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq3 == ' ')
{
document.getElementById('2_0').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq4 == ' ')
{
document.getElementById('0_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq5 == ' ')
{
document.getElementById('1_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq6 == ' ')
{
document.getElementById('2_1').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq7 == ' ')
{
document.getElementById('0_2').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq8 == ' ')
{
document.getElementById('1_2').value = 'O';
AImove = !AImove
moveCount++;
}
else if(checkSq9 == ' ')
{
document.getElementById('2_2').value = 'O';
AImove = !AImove
moveCount++;
}


}

</script>


<body>
<p align="center">
<input type="button" id="0_0" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="1_0" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="2_0" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<BR>
<input type="button" id="0_1" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="1_1" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="2_1" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<BR>
<input type="button" id="0_2" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="1_2" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<input type="button" id="2_2" value=" " style=" width: 45; height: 45; " ONCLICK="clicked(this);" />
<BR><BR><BR>
<input type="button" id="newgame" value="New Game" style=" width: 150; height: 30; " ONCLICK="newgame();" />
<BR><BR>
<table width="200" height="49" background="sqbgs.png" cellpadding="10">
<tr align = "bottom">
<td>
<p id="status" align="center">
X's turn
</p>
</td>

</tr></table>
<br><br>
<table width="50" height="57" background="mTickerBG.png" cellpadding="10">
<tr align = "bottom">
<td>
<p id="moveTicker" align="center">
0
</p>
</td></tr></table>
<table width = "400" height="50" background = "scoreBG.png">
<tr>
<td>
<p id="winsX" align="center">
0
</p>
</td>
<td>
<p id="winsO" align="center">
0
</p>
</td>
<td>
<p id="gameCount" align="center">
0
</p>
</td>
<td>
<p id="tieDisplay" align="center">
0
</p>
</td></tr></table>
<br><br>
</body>
</html>

//Line count: 831
//Byte count: 20599
Basic Arithmetic by BIG BROTHER
Lesson one: Unplus-ing numbers

2-2 = n
n = What I tell you to
sez
 
Posts: 3
Joined: Sun Jan 07, 2007 4:34 pm
Top

Re: thank you science buddies!

Postby davidkallman » Thu Jan 18, 2007 12:36 am

Hi sez,

Congratulations!!

Before, you declare victory, I encourage you to exhaustively test your program (go through all the cases), which can be done for tic-tac-toe. The test process could be part of your display.
Cheers!

Dave
davidkallman
Former Expert
 
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm
Top

HOW DID YOU DO THAT????

Postby Mago » Sat Nov 03, 2007 12:58 pm

Hey!! I need some help with that!!! Could you look at the following script and see where I went wrong? Thanks!

<html>
<head>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var aimove = false;
var xTurn = true;
var gameOver = false;
var numMoves = 0;
var sq1 = 3;
var sq2 = 2;
var sq3 = 3;
var sq4 = 2;
var sq5 = 4;
var sq6 = 2;
var sq7 = 3;
var sq8 = 2;
var sq9 = 3;
function squareclicked(square)
//square clicked is a function that is called whenever a button is clicked.
{
var value = square.value;
var status = document.getElementById('status');
if(gameOver)
{
computerTurn = false;
alert("This game is OVER!!");
return;
}
if(value != 'X' && value != 'O')
{
if(xTurn)
{
numMoves++;
square.value = "X";
xTurn = false;
aiMove = true;
}
if(aiMove)
{
makeMove()
status.innerHTML = 'X\'s turn';
xturn = true;
}
}
else
alert('That square is already being used: DUH!');

var winner = checkWin();
if(!winner)
{
//check to see if there is a tie
if(numMoves == 9)
status.innerHTML = 'Tie Game!';
}
else
gameOver = true;

}
function newgame()
{
var status = document.getElementById('status')
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 = ' ';
gameOver = false;
numMoves = 0;
}
}
}
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 = "Computer 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 = "Computer 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 = "Computer 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 = "Computer WINS!";
return true;
}

// no winner yet return false;
}
Function makeMove()
{
box1 = 3;
box2 = 2;
box3 = 3;
box4 = 2;
box5 = 4;
box6 = 2;
box7 = 3;
box8 = 2;
box9 = 3;
var sq1;
var sq2;
var sq3;
var sq4;
var sq5;
var sq6;
var sq7;
var sq8;
var sq9;
{
sq1 = document.getElementById('0_0').value;
sq2 = document.getElementById('1_0').value;
sq3 = document.getElementById('2_0').value;
sq4 = document.getElementById('0_1').value;
sq5 = document.getElementById('1_1').value;
sq6 = document.getElementById('2_1').value;
sq7 = document.getElementById('0_2').value;
sq8 = document.getElementById('1_2').value;
sq9 = document.getElementById('2_2').value;
var status = document.getElementById('status');
// check top row
if(sq1 == 'X' && sq2 == 'X' && sq3 == ' ')
{
box3 = box3+10}
if(sq2 == 'X' && sq3 == 'X' && sq1 == ' ')
{
box1 = box1+10}
if(sq1 == 'X' && sq3 == 'X' && sq2 == ' ')
{box2 = box2 + 10}
// checking top row for win
if(sq1 == 'O' && sq3 == 'O' && sq2 == ' ')
{
box2 = box2 + 15}
if(sq1 == ' ' && sq3 == 'O' && sq2 == 'O')
{
box1 = box1 + 15}
if(sq1 == 'O' && sq3 == ' ' && sq2 == 'O')
{box3 = box3 + 15};
// now check diagonal upper left to lower right
if(sq1 == 'X' && sq5 == 'X' && sq9 == ' ')
{
box9 = box9 + 10}
if(sq1 == ' ' && sq5 == 'X' && sq9 == 'X')
{
box1 = box1 + 10}
if(sq1 == 'X' && sq5 == ' ' && sq9 == 'X')
{
box5 = box5 + 10}
if(sq1 == 'O' && sq5 == 'O' && sq9 == ' ')
{
box9 = box9 + 15}
if(sq1 == ' ' && sq5 == 'O' && sq9 == 'O')
{
box1 = box1 + 15}
if(sq1 == 'O' && sq5 == ' ' && sq9 == 'O')
{
box5 = box5 + 15};
// now check upper right to lower left
if(sq3 == 'X' && sq5 == 'X' && sq7 == ' ')
{
box7 = box7 + 10}
if(sq3 == ' ' && sq5 == 'X' && sq7 == 'X')
{
box3 = box3 + 10}
if(sq3 == 'X' && sq5 == ' ' && sq7 == 'X')
{
box5 = box5 + 10}
if(sq3 == 'O' && sq5 == 'O' && sq7 == ' ')
{
box7 = box7 + 15}
if(sq3 == ' ' && sq5 == 'O' && sq7 == 'O')
{
box3 = box3 + 15}
if(sq3 == 'O' && sq5 == ' ' && sq7 == 'O')
{
box5 = box5 + 15};
// check row two
if(sq4 == ' ' && sq5 == 'X' && sq6 == 'X')
{
box4 = box4 + 10}
if(sq4 == 'X' && sq5 == 'X' && sq6 == ' ')
{
box6 = box6 + 10}
if(sq4 == 'X' && sq5 == ' ' && sq6 == 'X')
{
box5 = box5 + 10}
if(sq4 == 'O' && sq5 == 'O' && sq6 == ' ')
{
box6 = box6 + 15}
if(sq4 == ' ' && sq5 == 'O' && sq6 == 'O')
{
box4 = box4 + 15}
if(sq4 == 'O' && sq5 == ' ' && sq6 == 'O')
{
box5 = box5 + 15};
//check bottom row
if(sq7 == 'X' && sq8 == 'X' && sq9 == ' ')
{
box9 = box9 + 10}
if(sq8 == 'X' && sq9 == 'X' && sq7 == ' ')
{
box7 = box7 + 10}
if(sq7 == 'X' && sq9 == 'X' && sq8 == ' ')
{box8 = box8 + 10}
if(sq7 == 'O' && sq8 == 'O' && sq9 == ' ')
{box9 = box9+ 15}
if(sq7 == ' ' && sq8 == 'O' && sq9 == 'O')
{box7 = box7 + 15}
if(sq7 == 'O' && sq8 == ' ' && sq9 == 'O')
{box8 = box8 + 15}
//check left down row
if(sq1 == 'X' && sq4 == 'X' && sq7 == ' ')
{box7 = box7 +10}
if(sq1 == ' ' && sq4 == 'X' && sq7 == 'X')
{box1 = box1 + 10}
if(sq1 == 'X' && sq4 == ' ' && sq7 == 'X')
{box4 = box4 + 10}
if(sq1 == 'O' && sq4 == 'O' && sq7 == ' ')
{box7 = box7 +15}
if(sq1 == ' ' && sq4 == 'O' && sq7 == 'O')
{box1 = box1 + 15}
if(sq1 == 'O' && sq4 == ' ' && sq7 == 'O')
{box4 = box4 + 15}
//check middle vertical row
if(sq2 == 'X' && sq5 == 'X' && sq8 == ' ')
{box8 = box8 +10}
if(sq2 == ' ' && sq5 == 'X' && sq8 == 'X')
{box2 = box2 + 10}
if(sq2 == 'X' && sq5 == ' ' && sq8 == 'X')
{box5 = box5 + 10}
if(sq2 == 'O' && sq5 == 'O' && sq8 == ' ')
{box8 = box8 +15}
if(sq2 == ' ' && sq5 == 'O' && sq8 == 'O')
{box2 = box2 + 15}
if(sq2 == 'O' && sq5 == ' ' && sq8 == 'O')
{box5 = box5 + 15}
//check last row
if(sq3 == 'X' && sq6 == 'X' && sq9 == ' ')
{box9 = box9 +10}
if(sq3 == ' ' && sq6 == 'X' && sq9 == 'X')
{box3 = box3 + 10}
if(sq3 == 'X' && sq6 == ' ' && sq9 == 'X')
{box6 = box6 + 10}
if(sq3 == 'O' && sq6 == 'O' && sq9 == ' ')
{box9 = box9 +15}
if(sq3 == ' ' && sq6 == 'O' && sq9 == 'O')
{box3 = box3 + 15}
if(sq3 == 'O' && sq6 == ' ' && sq9 == 'O')
{box6 = box6 + 15}
}
if(box1>= box2 && box1 >= box3 && box1 >= box4 && box1 >= box5 && box1 >= box6 && box1 >= box7 && box1 >= box8 && box1 >=

box9 && sq1 == ' ')
{
document.getElementById('0_0').value = 'O';
aiMove = !aiMove
numMoves++;
}
else if(box2 >= box1 && box2 >= box3 && box2 >= box4 && box2 >= box5 && box2 >= box6 && box2 >= box7 && box2 >= box8 && box2

>= box9 && sq2 == ' ')
{document.getElementById('1_0').value = 'O';
aiMove = !aiMove
numMoves++;
}
else if(box3 >= box1 && box3 >= box2 && box3 >= box4 && box3 >= box5 && box3 >= box6 && box3 >= box7 && box3 >= box8 && box3

>= box9 && sq3 == ' ')
{
document.getElementById('2_0').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(box4 >= box1 && box4 >= box2 && box4 >= box3 && box4 >= box5 && box4 >= box6 && box4 >= box7 && box4 >= box8 && box4

>= box9 && sq4 == 'O')
{
document.getElementById('0_1').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(box5 >= box1 && box5 >= box2 && box5 >= box3 && box5 >= box4 && box5 >= box6 && box5 >= box7 && box5 >= box8 && box5

>= box9 && sq5 == 'O')
{
document.getElementById('1_1').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(box6 >= box1 && box6 >= box2 && box6 >= box3 && box6 >= box4 && box6 >= box5 && box6 >= box7 && box6 >= box8 && box6

>= box9 && sq6 == 'O')
{
document.getElementById('2_1').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(box7 >= box1 && box7 >= box2 && box7 >= box3 && box7 >= box4 && box7 >= box5 && box7 >= box6 && box7 >= box8 && box7

>= box9 && sq7 == 'O')
{
document.getElementById('0_2').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(box8 >= box1 && box8 >= box2 && box8 >= box3 && box8 >= box4 && box8 >= box5 && box8 >= box6 && box8 >= box7 && box8

>= box9 && sq8 == 'O')
{
document.getElementById('1_2').value = 'O';
aiMove = !aiMove
nuMoves++;}
aiMove = !aiMove
numMoves++;}
else if(box9 >= box1 && box9 >= box2 && box9 >= box3 && box9 >= box4 && box9 >= box5 && box9 >= box6 && box9 >= box7 && box9

>= box8 && sq9 == 'O')
{
document.getElementById('2_2').value = 'O';
aiMove = !aiMove
numMoves++;}
else if(sq1 == ' ')
{
document.getElementById('0_0').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq2 == ' ')
{
document.getElementById('1_0').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq3 == ' ')
{
document.getElementById('2_0').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq4 == ' ')
{
document.getElementById('0_1').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq5 == ' ')
{
document.getElementById('1_1').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq6 == ' ')
{
document.getElementById('2_1').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq7 == ' ')
{
document.getElementById('0_2').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq8 == ' ')
{
document.getElementById('1_2').value = 'O';
aiMove = !aiMove
numMove++;}
else if(sq9 == ' ')
{
document.getElementById('2_2').value = 'O';
aiMove = !aiMove
numMove++;}
}
</SCRIPT>
</head>
<body bgcolor='lightblue' text='green'>
<center>
<input type="button" id="0_0" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_0" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_0" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<br>
<input type="button" id="0_1" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_1" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_1" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<br>
<input type="button" id="0_2" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_2" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_2" style=" width = 50; height = 50;" value=" " onClick="squareclicked(this)">
<br>
<br>
<br>
<br>
<br>
<br>
<input type="button" id="NEWGAME" Value="Click here for a new game" onClick="newgame();">
<P ID="status">X's turn</P>
<form name = "blah">
<input type = "text" value ="Type your name here." Id = "numming" name = "numing">
<br>
<input type = "button" value = " Player's Name goes here" name = "hello" style = "position: absolute; left: 100; top : 100;

width: 100; height: 75;">
<input type = "button" value = " Computer " name = "heyllo" style = "position: absolute; left: 800; top : 100; width: 100;

height: 75;">
<input type = "button" value = "Player's name." onClick = "document.blah.hello.value = document.blah.numing.value">
</form>
</center>
</body>
</html>[list=][/list]
Mago
 
Posts: 11
Joined: Sun Sep 23, 2007 5:52 pm
Top

Re: HOW DID YOU DO THAT????

Postby davidkallman » Sat Nov 03, 2007 5:42 pm

Mago wrote:Hey!! I need some help with that!!! Could you look at the following script and see where I went wrong? Thanks!

Hi Mago,

What is the problem? How you know something is wrong? By answering these two related questions, you may be able to debug the program.
Cheers!

Dave
davidkallman
Former Expert
 
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm
Top

Postby Mago » Sat Nov 03, 2007 6:24 pm

I am sorry but that advise wasn't helpful at all. The problem is that the AI won't work. I know this becuase THE AI WON'T WORK. Having said that, how can you help me?
Mago
 
Posts: 11
Joined: Sun Sep 23, 2007 5:52 pm
Top

Re: HOW DID YOU DO THAT????

Postby davidkallman » Sat Nov 03, 2007 6:43 pm

Mago wrote:I am sorry but that advise wasn't helpful at all. The problem is that the AI won't work. I know this becuase THE AI WON'T WORK. Having said that, how can you help me?


Hi Mago,

What do you mean by saying "The AI won't work?" I'm not going to debug your program; I will help you debug it. Please look at the question in this posting and the two questions in the previous posting. Thanks.
Cheers!

Dave
davidkallman
Former Expert
 
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm
Top

Postby Louise » Sun Nov 04, 2007 6:58 am

Mago wrote:I am sorry but that advise wasn't helpful at all. The problem is that the AI won't work. I know this becuase THE AI WON'T WORK. Having said that, how can you help me?


Chris and David are right... those questions are the key. They gave excellent advice. Let me give you three examples:

1) the 'ai' plays but makes moves so bad that it always loses
2) the ai won't make a move; the program crashes
3) the ai over-writes your token- it places its mark in the square you already took.


All of these could be describes as the "ai won't work", but they are very different problems and would be fixed in very different ways. [The first point isn't a coding problem, but does fit in to "AI doesn't work"] To debug code, you need to find out what conditions produce what behavoir. Then, you go to the part of the code that produces that result, and look for the problem. [I am assuming the code actually compiles and that you didn't miss a comma or semi-colon or something or pasted the javascript code in to a fortran compiler or something like that.]

One other point... I'm not a good programmer. I find it _much_ easier to write my own code, rather than try to decipher someone else's code. To me, the problem of trying to debug code is such a hard problem that I don't want to add a second problem of trying to understand someone else's code. If you do want to use someone else's code, then the thing to do is to walk through it with pen and paper and make sure you understand what each part of the program is doing. Sez posted his code as reference, which was nice, but there is no guarrantee that it works.

Good luck.

Louise
Louise
Former Expert
 
Posts: 921
Joined: Mon Jan 16, 2006 2:17 pm
Top

Postby Louise » Sun Nov 04, 2007 7:02 am

Louise wrote:
Chris and David are right... those questions are the key. They gave

Louise


Ahh... sorry. There isn't any post from Chris, sorry for the confusion. I guess this means David is twice as correct as I thought he was.


Louise
Louise
Former Expert
 
Posts: 921
Joined: Mon Jan 16, 2006 2:17 pm
Top

Postby Mago » Sun Nov 04, 2007 9:26 am

Alright, heres the facts. When I add my AI, I can't play any of the squares, and the computer won't play either. My page says that an object is expected under the error report, but everytime I try to debug it, nothing changes! Do you have any ideas that would help? :shock:
___________________________

Mago
Mago
 
Posts: 11
Joined: Sun Sep 23, 2007 5:52 pm
Top

Postby Louise » Sun Nov 04, 2007 1:03 pm

Mago wrote:Alright, heres the facts. When I add my AI, I can't play any of the squares, and the computer won't play either. My page says that an object is expected under the error report, but everytime I try to debug it, nothing changes! Do you have any ideas that would help? :shock:



This still isn't very clear to me- the way to debug is to step through every input, and make sure you get the correct output. You are giving us very little detail. Are you 'x' or 'o'? Do you go first, or does the computer? These details may be critical for figuring out where things went wrong. If you go first, and you cannot play any squares, then the problem cannot be with the AI. If you remove the AI part and you play for both players, does it work? What does "cannot play" mean? How far in the game do you get? Does a board draw, does it welcome you to the game? There is stuff to this before you pick a square... does that execute correctly or is it hanging up before you make your pick? Throw in some output lines- have it print to the screen "I am in this section" "I am in that section".

If your getting an error report, it usually tells you the variable name that is the problem, or the line of code that is flaky, or some sort of detail that will help you track down the problem. "My page says that an object is expected under the error report" is not very informative.

So, using the suggestions I've given, can you isolate the problem?

Louise
Louise
Former Expert
 
Posts: 921
Joined: Mon Jan 16, 2006 2:17 pm
Top

Postby Mago » Sun Nov 04, 2007 2:59 pm

Okay, I will clarify my information. I go first. I am x. The computer is o. The script works fine in two player. What I mean when I say that I can't play a square is that when I click on the square, nothing happens; no x is written. In the error report, it sent me to a line where there was only a } symbol, and said that "an object was expected". I am not sure what that means, but I am sure I will figure it out. Thank you! :)
___________________________

Mago
Mago
 
Posts: 11
Joined: Sun Sep 23, 2007 5:52 pm
Top

Postby Louise » Sun Nov 04, 2007 5:13 pm

Mago wrote:Okay, I will clarify my information. I go first. I am x. The computer is o. The script works fine in two player. What I mean when I say that I can't play a square is that when I click on the square, nothing happens; no x is written. In the error report, it sent me to a line where there was only a } symbol, and said that "an object was expected". I am not sure what that means, but I am sure I will figure it out. Thank you! :)



Okay, I have two lines of thought...

First, if you are going first, and the two player code works fine, it seems odd that adding the AI causes problems at this point (before it enters AI). So I would check very carefully your code prior to the computer making its move. Are you defining both players properly? Is there some new functionality you've added?

Second,
This error is javascript has to do with not being able to find a file or directory. The line it takes you to should be the one that contains the file call. Since you end up on a line with just }, I would look immediately prior to that line.

See this page for an example:
http://www.webmasterworld.com/forum91/2978.htm

I'm not sure if you get this error for variables or functions that are missing, or just external files. Otherwise, go through and make sure every variable and function are properly defined (and defined before you call them). This language is case sensitive, so watch for caps...

There are also numerous javascript debugging tools. I've never used any of them, but some browsers contain them (like firefox- called the 'error console'). Supposedly they are more likely to give you detailed information (like the name of the object it is looking for).

This is a general reference on debugging javascript. I thought it might be useful.

[url]http://www.javaworld.com/javaworld/jw-07-1996/jw-07-javascript.html?page=1
[/url]


Good luck!

Louise
Louise
Former Expert
 
Posts: 921
Joined: Mon Jan 16, 2006 2:17 pm
Top

Re: Finished tic tac toe project - thank you science buddies

Postby java » Sun Apr 11, 2010 11:25 am

sorry to burst your bubble but i beat it; it was laid out like this

X O O
X O
X X O
java
 
Posts: 3
Joined: Sun Apr 11, 2010 11:19 am
Occupation: evil genius
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable
Top

Re: Finished tic tac toe project - thank you science buddies

Postby java » Sun Apr 11, 2010 11:31 am

first X = me

[] [ ] []
[] [O] []
[] [X] []

[X] [O] []
[ ] [O] []
[ ] [X] []

[X] [O] []
[ ] [O] []
[X] [X] [O]

[X] [O] []
[X] [O] []
[X] [X] [O]
java
 
Posts: 3
Joined: Sun Apr 11, 2010 11:19 am
Occupation: evil genius
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable
Top

Re: Finished tic tac toe project - thank you science buddies

Postby java » Sun Apr 11, 2010 11:32 am

in order for an AI to be unbeatable it MUST go first
java
 
Posts: 3
Joined: Sun Apr 11, 2010 11:19 am
Occupation: evil genius
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable
Top
Post a reply

Return to Grades 6-8: Math and Computer Science

Who is online

Users browsing this forum: No registered users and 1 guest

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group


Copyright © 2002-2013 Science Buddies. All rights reserved.
Reproduction of material from this website without written permission is strictly prohibited.
Use of this site constitutes acceptance of our Terms and Conditions of Fair Use.