AI help for Tic-Tac-Toe!!!!

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

Moderators: kgudger, bfinio, Moderators

Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Hello I do not understand what this line does.
box1 = box1+10} <<< What is the meaning of box1+10. I know that the value 3 is a corner and 2 are the ones between corners and 4 is t he middle.
So what does adding 10 to box one do?
*Edit*
Okay I get it now. On the bottom of the code where it actually makes a move, those +___ numbers are priorities.
davidkallman
Former Expert
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm

Re: AI help for Tic-Tac-Toe!!!!

Post by davidkallman »

Hi Petervu,

Congratulations! If I understand your post, you've figured out the code and don't need any help.

Is that so?
Cheers!

Dave
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Actually now that I've attempted to write and rewrite the code for the AI I don't understand it. I see the priorities being laid out but I do not understand where in the code the computer actually makes a move and change the value of one of the squares to an O.
document.getElementById('2_1').value = 'O'; << is that the line that changes the value?

I have tried to remake what Mago was trying to do with no luck. The game simply does not work. The buttons do not press. I have tried using a debugger and that was no help at all. Here is my code.

<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame();">
<br>

<INPUT TYPE="BUTTON" ID="0_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_0" VALUE=" " ONCLICK="squareclicked(this);">
<br>
<INPUT TYPE="BUTTON" ID="0_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_1" VALUE=" " ONCLICK="squareclicked(this);">
<br>
<INPUT TYPE="BUTTON" ID="0_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_2" VALUE=" " ONCLICK="squareclicked(this);">
<br>
<P ID="status">X's turn</P>

<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)
// squareclicked is a function that is called whenever a button is clicked.
{
var status = document.getElementById('status');
var value = square.value;
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 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;
}
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 = "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;
}

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}

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 column<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
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 column<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
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 right column<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
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++;}
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>
davidkallman
Former Expert
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm

Re: AI help for Tic-Tac-Toe!!!!

Post by davidkallman »

Hi Petervu,

Please note the comments made by OneBriiguy earlier in this thread :
-----
You have an excellent opportunity to learn how to debug programs. The experts watching this forum aren't signed up to debug your code for you. I can offer three simple suggestions (abridged here) that have worked well for me in the past:

1) Insert extra statements in the code that print out intermediate values along the way.
2) Step through the code yourself by hand.
3) Form a better question or problem description.
-----
So, please try all three of these and good luck! Please excuse if you've already tried them. You might have to try in a different way. Thanks.
Cheers!

Dave
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

I have tried to step through the code. I do not understand what it means to add extra statements that print out intermediate values... Does that mean I should add in wrong things to see what happens? because my code currently does not work right now so it does not matter if I add something wrong in or not. It still won't work.
davidkallman
Former Expert
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm

Re: AI help for Tic-Tac-Toe!!!!

Post by davidkallman »

Hi Petervu,

What is meant by Inserting extra statements in the code that print out intermediate values along the way is to:

1. select key variables in your
2. add print (or output) statements to display the value of the key variables as the program is running. The print statements would be of two parts: the first part would be a constant indicating a position in the program, the second would be the variables themselves.

I'm not familiar with javascript. Generically, the print statements would look like:

print "a", v1, v2,v3

So, if location a is a key spot in the program's logic, and v1, v2 and v3 are key variables, adding the print statement above at location a would allow you to see the values of v1, v2 and v3 at location a.

You could probably get the same effect by manually stepping the program to location a and manually displaying v1, v2 and v3 there.

Notes:
1. I say "probably" because I'm not familiar with the javascript debugger.
2. You do need to pick a, v1, v2 and v3. Using a debugger gives more flexibility, all locations and variables can be used, but it requires more work.
3. Adding the print statements doesn't fix the program's logic. But it does give a window into, and hopefully you can discover what's going wrong.
Cheers!

Dave
ChrisG
Former Expert
Posts: 1019
Joined: Fri Oct 28, 2005 11:43 am
Occupation: Research Hydrologist
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable

Re: AI help for Tic-Tac-Toe!!!!

Post by ChrisG »

Hi, I fiddled with the code a little to get a sense of what might be going on. From my testing, I gather that when you wrote the code "won't work" you meant that the script doesn't even load or start to execute, and that is why you cannot debug it.
I was able to get the script to load and execute by deleting the makeMove() function, so I assume it is something in that function that prevents the script from loading or executing. Beyond that, I could not see what was wrong.
Rather than try to fix someone else's broken code, you might be better off starting over from the bare minimum, and then rebuilding, adding in the elements that you need piece by piece. It is easy to overlook mistakes when you are cutting and pasting, so it might be better to rewrite everything.
I hope that helps,
Chris
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Yes Chris I found that out just a while ago. I managed the fix the "not load or execute" problem by moving the Makemove function to a different position. I moved in between the Checkwin() function and the Newgame() function. Now the game executes meaning I can start the game and click a box and an X will appear. But the AI does not know its it's move. I figured that i was missing this. computerTurn = !computerTurn and this var computerTurn = false;
Now that I know I'm missing that, I don't know where to put it so I am randomly placing it in random spots.
I think I am VERY close to finishing this project.
ChrisG
Former Expert
Posts: 1019
Joined: Fri Oct 28, 2005 11:43 am
Occupation: Research Hydrologist
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable

Re: AI help for Tic-Tac-Toe!!!!

Post by ChrisG »

Hi,
Congrats on your progress. However, I just tried the same fix (moving makemove() to between checkwin() and newgame()) and it made no difference for me (running firefox). Are you sure that function is actually working as you want it to?
Have you worked out the placement of these new statements? If not, I recommend trying to think about the logic of the program and where those statements belong.
Are you planning to end this project once you have constructed a functioning program? This would be good experience with computer programming in Javascript, but as a science fair project, it might fall short of expectations. Do you have a hypothesis that you plan to test?
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Hello again and yes I managed to "unfreeze" the game that way. My hypothesis would be: is it able to create an invincible AI? And I would list the procedure on how i made my Javascript game. I would explain every part of it. (when it works of course). And Here is my Javascript code where I can actually make the first move and the AI cant respound. As you can see I have re written the code somewhat.

<SCRIPT TYPE="TEXT/JAVASCRIPT">

var computerTurn = false;
var gameOver = false;
var numMoves = 0;

function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
{
var status = document.getElementById('status');
var value = square.value;
if(gameOver)
{
computerTurn = false;
alert("This game is OVER!!");
return;
}
if(value != 'X' && value != 'O')
{
if(xTurn)
{
numMoves++;
square.value = 'X';
xTurn = false;
status.innerHTML = 'O\'s turn';
}
if(computerTurn)
{
makeComputerMove();
}

}
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;
}
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 makeComputerMove()
// For ai move
{
computerTurn = false;
computerTurn = !computerTurn
var sq0;
var sq1;
var sq2;
box1 = 3;
box2 = 2;
box3 = 3;
box4 = 2;
box5 = 4;
box6 = 2;
box7 = 3;
box8 = 2;
box9 = 3;
//TOP <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box3 = box3 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box2 = box2 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box1 = box1 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box3 = box3 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box2 = box2 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_0').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box1 = box1 + 10
}
//MIDDLE ROW <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box6 = box6 + 5
}
sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box5 = box5 + 5
}
sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box4 = box4 + 5
}
sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box6 = box6 + 10
}
sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box5 = box5 + 10
}
sq0 = document.getElementById('0_1').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_1').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box4 = box4 + 10
}
//MIDDLE ROW <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box9 = box9 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box8 = box8 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box7 = box7 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box9 = box9 + 10
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box8 = box8 + 10
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_2').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box7 = box7 + 10
}
//LEFT COLUMN <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box7 = box7 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box4 = box4 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box1 = box1 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box7 = box7 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box4 = box4 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('0_1').value;
sq2 = document.getElementById('0_2').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box1 = box1 + 10
}
//MIDDLE COLUMN <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box8 = box8 + 5
}
sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box5 = box5 + 5
}
sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box2 = box2 + 5
}
sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box8 = box8 + 10
}
sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box5 = box5 + 10
}
sq0 = document.getElementById('1_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('1_2').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box2 = box2 + 10
}
//RIGHT COLUMN <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box9 = box9 + 5
}
sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box6 = box6 + 5
}
sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box3 = box3 + 5
}
sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box9 = box9 + 10
}
sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box6 = box6 + 10
}
sq0 = document.getElementById('2_0').value;
sq1 = document.getElementById('2_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box3 = box3 + 10
}
//TOP LEFT DIAGONAL <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box9 = box9 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box5 = box5 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box1 = box1 + 5
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box9 = box9 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box5 = box5 + 10
}
sq0 = document.getElementById('0_0').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_2').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box1 = box1 + 10
}
//TOP RIGHT DIAGONAL <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'X' && sq1 == 'X' && sq2 == ' ')
{
box7 = box7 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'X' && sq1 == ' ' && sq2 == 'X')
{
box5 = box5 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == ' ' && sq1 == 'X' && sq2 == 'X')
{
box3 = box3 + 5
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'O' && sq1 == 'O' && sq2 == ' ')
{
box7 = box7 + 10
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == 'O' && sq1 == ' ' && sq2 == 'O')
{
box5 = box5 + 10
}
sq0 = document.getElementById('0_2').value;
sq1 = document.getElementById('1_1').value;
sq2 = document.getElementById('2_0').value;
if(sq0 == ' ' && sq1 == 'O' && sq2 == 'O')
{
box3 = box3 + 10
}
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++;}
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++;}
}

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();">
<br>
<input type="button" id="0_0" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_0" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_0" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<br>
<input type="button" id="0_1" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_1" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_1" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<br>
<input type="button" id="0_2" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="1_2" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<input type="button" id="2_2" style=" width = 100; height = 100;" value=" " onClick="squareclicked(this)">
<br>
<P ID="status">X's turn</P>
amyc
Site Admin
Posts: 1130
Joined: Mon Dec 15, 2008 3:38 pm
Occupation: Science Buddies
Project Question: N/A
Project Due Date: N/A
Project Status: Not applicable

Re: AI help for Tic-Tac-Toe!!!!

Post by amyc »

Hi Petervu - It looks like you are making progress. Chris asked you some good questions earlier, and I see that you are thinking about how to address certain components necessary to present your work for a science fair. I wanted to post another link to information on the Science Buddies site that may be useful to you. This page is titled "Engineering and Programming Project Tips" and discusses how to modify programing and engineering projects to conform to science fair procedures.

https://www.sciencebuddies.org/science- ... ring.shtml

Amy
Science Buddies
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Thanks a lot Amy for the link. It helped me think of more ideas on the actual report I'll give for my science fair.
Though I am still working on making the project. I think I will have to pick another project.
If I do not finish this project by next week I will have to revert to my backup. I'm planning to make a tic-tac-toe game using hyper linking. If by Monday I don't finish this Javascript project i will be forced to hand in my hyperlink project.
Though it would be REALLY impressive if I can give in a project of Javascript so if anybody out there knows the problem to my script please post a reply.
Please and Thankyou :)
davidkallman
Former Expert
Posts: 675
Joined: Thu Feb 03, 2005 3:38 pm

Re: AI help for Tic-Tac-Toe!!!!

Post by davidkallman »

Hi Petervu,

Wow, I love your attitude and planning! It's not often seen: schedules and backup plans and no emergencies. Congratulations!

P.S.: I do not know the problem in your script. I'm sorry.
Cheers!

Dave
ChrisG
Former Expert
Posts: 1019
Joined: Fri Oct 28, 2005 11:43 am
Occupation: Research Hydrologist
Project Question: n/a
Project Due Date: n/a
Project Status: Not applicable

Re: AI help for Tic-Tac-Toe!!!!

Post by ChrisG »

Hi,
I spent more time looking at & working with the latest version of the code tonight. There are several problems in the AI function, and other problems scattered throughout the code. I'm happy to assist with specific questions (e.g. why does the code halt execution at line 526 in the makecomputermove() function?) but, for an engineering project where the code is your final product, we really shouldn't be hunting down and fixing problems for you. If you'd like to continue with this project, you'll need to become acquainted with a good debugger like Firebug for Firefox
http://getfirebug.com/
You'd need to use this debugger to step through the program and figure out where things are going wrong:
http://getfirebug.com/js.html
Once you locate where the code fails, you'd need to understand the logic of the program & the programming language well enough to understand why the code is failing.

I think it would be very interesting and you'd learn a ton. But, if deadlines are too pressing, then maybe it's time for plan B.

Good luck,
Chris
Petervu
Posts: 15
Joined: Fri Mar 06, 2009 7:00 pm
Occupation: Student
Project Question: In the following project : Teaching the Computer to Play Tic-Tac-Toe
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.
Project Due Date: Wednesday March 11th 2009. I started 2 weeks ago but have been stuck on the same situation.
Project Status: I am conducting my experiment

Re: AI help for Tic-Tac-Toe!!!!

Post by Petervu »

Thankyou for linking me to the debugger! I'm definately making progress!
I found out that the computerturn "wasn't defined" because i never put computerturn=true after the X part
and that my sq1-9 had no values because i totally forgot that i rewrote the script!!
Thankyou very much!
Locked

Return to “Grades 9-12: Math and Computer Science”