Page 1 of 1

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

Posted: Thu Mar 19, 2009 7:23 am
by Petervu
OH MY LORD. I JUST GOT THE COMPUTER TO MAKE A MOVE AND I JUMPED OFF OF MY CHAIR.
Sorry for the caps by the way its to show my enthusiasm because I nearly jumped off my chair when I clicked a box and the AI responded.
Though its not working yet only the middle square seems to be making a move but I see that its going to be finished on time!
It seems I won't be needing to use my backup anymore. Ill message back when I perfect this!

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

Posted: Thu Mar 19, 2009 7:33 am
by Petervu
Currently fixing a problem with the priorities. It seems it keeps jumping into the middle because the middle has the highest priority. I suspect that the adding of priorities is not working.
It seems my whole priority list isn't working. The only thing that seems to be actually working is the box5= 5 making it the highest value and the computer only wants to go into the middle. Even when I place my first move X into the middle the computer does not know where to go meaning it probably wants to go to middle square still meaning it isn't listening to the rule that states it has to = " " for it to place the O there. After debugging this code it seems that I'm a complete failure :shock:

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

Posted: Thu Mar 19, 2009 9:44 am
by deleted-71447
Congrats on getting the computer to move! Don't despair. The middle square is the highest priority spot for the first or second move. If you choose the middle square and then use the debugger to step through the code, why does the computer not add an "O" when it gets to the relevant "if" statements in makecomputermove()? Step through the code at those "if" statements and watch the values of the variables in the right side of the Firebug pane.

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

Posted: Thu Mar 19, 2009 12:33 pm
by Petervu
Chris thankyou for assisting me all this way. My AI is functional now. The only problem with it is that it only attempts to block moves and will not make a random move. Though I am VERY happy now that it starts moving on its own. I just need to tweak the priorities a bit.

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

Posted: Thu Mar 19, 2009 4:20 pm
by deleted-71447
Hi, That's great. It sounds like you are close to finishing. Please let us know how it turns out!
Chris

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

Posted: Mon Mar 23, 2009 6:00 pm
by Petervu
Yes my project turned out perfect. The results that is.
All I need to do now is to write myself a report for Wednesday.
Would you like me to post my final code for you to see and for people to use as a reference?
Or do you think I should not. I believe you want people to find the answer themselves so maybe the other codes that weren't debugged yet is a good enough reference?

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

Posted: Tue Mar 24, 2009 8:36 am
by deleted-71447
Congratulations! I'm glad it worked out.
I think for now don't post your code, so that others can figure it out themselves.
Good luck with the report.
Chris

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

Posted: Mon Dec 09, 2013 9:46 am
by PrestonRW
I am conducting a similar experiment to yours, I have gotten the board to work, and recognize ties, and wins.
I was just wondering how you got your AI to work correctly, causing you to jump off your chair. I have the computer move function triggering correctly, I just dont know what goes in.

Code: Select all

<HTML> 
<HEAD> 

<link href='http://fonts.googleapis.com/css?family=Shadows+Into+Light' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Crafty+Girls' rel='stylesheet' type='text/css'>
<TITLE>Tic Tac Toe!</TITLE> 

<script type="TEXT/JAVASCRIPT">
    var xTurn = true;
    var gameOver = false;
    var numMoves = 0;



    function squareclicked(square){
        var value = square.value;
        var status = document.getElementById('status');
    
        if(gameOver){
            alert("Game Over.");
            return;
        }
    
        if(value != 'X' && value != 'O'){
            if(xTurn){
                numMoves++;
                square.value = 'X';
                xTurn = false;
                status.innerHTML = 'O\'s turn';

var computerTurn = false;
computerTurn = !computerTurn

if(computerTurn)
    {
      makeComputerMove();
    }



   function makeComputerMove(){
      alert('Computer 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){
            if(numMoves == 9)
                status.innerHTML = 'Tie Game!';
        }
        else
            gameOver = true;
    }

    function newgame(){
        var status = document.getElementById('status');
    
        xTurn = true;
        status.innerHTML = 'X\'s turn';
        gameOver = false;
        numMoves = 0;
    
        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;
    
        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;
            }
        }
    
        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;
            }
        }
    
        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;
        }
    
    
        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;
        }
    }





</script>

<style>


input[type=button] {
    color:#08233e;
background-color: #9999FF;
    font-family: 'Crafty Girls', cursive;
    font-size:70%;
   width: 100;
height:100;
    cursor:pointer;
font-size:25;
border:groove;
border-color: 000000;
font-weight:900;
}

input[type=button]:hover {
    background-color:#6666FF;
}


input[id="NEWGAME"] {
    color:#08233e;
background-color: #9999FF;
   width: 310;
height:60;
    cursor:pointer;
font-size:30;
font-family: 'Shadows Into Light', cursive;

}

input[id=NEWGAME]:hover {
    background-color:#6666FF;


}

#status{
font-family: 'Shadows Into Light', cursive;
font-size:30;
font-style:bold;
font-weight:900;
}

#stat{
background-color:#9999FF;
width:302;
height:50
}

#outline{
width:400;
height:530;
background-color:000000;

}


#header{
height:100;
width:800;
background-color:000000;
}
</style>
</HEAD> 

<BODY>

<div align="center">
<div id="outline">
<br>
<br>
<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame();">
<br>
<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>

<div align="center">
<div id="stat"> 
<P ID="status">X's turn</P>
</div>
</div>
</div> 
 </div>


</BODY> 
</HTML>