Click here to Skip to main content
Click here to Skip to main content

Tagged as

How to create a tic tac toe game with web standards (Part 5-Final)

, 27 Nov 2012
Rate this:
Please Sign up or sign in to vote.
How to create a tic tac toe game with web standards.

As the post of the first part, we will do seven steps and we have read through the first three steps already. Now this is the last part of the tutorial. The last four steps may not be completed all. All are changed to two more steps. They are:

  1. Add the respond to the player
  2. check the winner

It is so sorry that the time limitation addition is removed because it is not the most important for the tutorial. You may not be explained clearly but you can read the code for your understanding.

This is the code of computer_play functioned mention in previous part.

function compute_play(){

    if(game_over == true){
        return;
    }
    //var x= Math.floor(Math.random()*20);
    //var y= Math.floor(Math.random()*20);
    var x = cur_x;
    var y = cur_y;
    var rnd ;
    while(set_position(x,y)==false){
        if(x >=20){
            x = cur_x;
        }
        if(y >=20){
            y = cur_y;
        }
        rnd= Math.floor(Math.random()*4);
        if(rnd==0){
            x = x+1;
        }else if(rnd==1){
            x = x-1;
        }else if(rnd =2){
            y = y+1;
        }else if(rnd ==3){
            y = y-1;
        }
        //x= Math.floor(Math.random()*20);
        //y= Math.floor(Math.random()*20);
    }
    check_winner();
    turn =1;
}

This is the code of check_winner function. It is a lot of code. But you must know that the main check for winner consists of four parts. The first one is horizontal . The second one is vertical. The third one is from top left part to the bottom right. And the last one is from the right top to the left bottom part of the grid board.

function check_winner(){
    if(game_over == true){
        return;
    }
    //check left to right
    var tmp = 0;
    var tmp_player ="";
    var player ="";  // value 1= player 0= computer
    for(i=0;i<20;i++){
        for(j=0;j<20;j++){
            var value = states[i][j];
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }

    //check top to bottm
    tmp = 0;
    tmp_player ="";
    player ="";  // value 1= player 0= computer
    for(i=0;i<20;i++){
        for(j=0;j<20;j++){
            var value = states[j][i];
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }
    //check cross left to right above
    tmp = 0;
    tmp_player ="";
    player ="";  // value 1= player 0= computer
    var n;
    for(i=0;i<20;i++){
        n = i;
        for(j=0;j<20;j++){
            var m = j;
            var value = states[m][++n];
            if(i==0){
                //alert(m+","+n);
            }
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }
    //check cross left to right below
    tmp = 0;
    tmp_player ="";
    player ="";  // value 1= player 0= computer
    for(i=19;i>=0;i--){
        n = i;
        for(j=19;j>=0;j--){
            var m = j;
            var value = states[m][--n];
            if(i==19){
                //alert(m+","+n);
            }
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }

    //check cross right to left above
    tmp = 0;
    tmp_player ="";
    player ="";  // value 1= player 0= computer
    var n;
    for(i=19;i>=0;i--){
        n = i;
        for(j=0;j<20;j++){
            var m = j;
            var value = states[m][--n];
            if(i==0){
                //alert(m+","+n);
            }
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }

    //check cross right to left below
    tmp = 0;
    tmp_player ="";
    player ="";  // value 1= player 0= computer
    var n;
    for(i=0;i<20;i++){
        n = i;
        for(j=19;j>=0;j--){
            var m = j;
            var value = states[m][++n];
            if(i==0){
                //alert(m+","+n);
            }
            if(value==1){
                player = 1;
            }else if(value==2){
                player = 0;
            }else{
                tmp=0;
                continue;
            }
            if(tmp_player ==""){
                tmp_player = player;
            }
            if(player==tmp_player){
                tmp+=1;
            }else{
                tmp=1;
            }

            if(tmp==5){
                if(player==1){
                    alert("You win the game!");
                }else if(player==0){
                    alert("You lose the game!");
                }
                game_over = true;
                break;
            }
        }
    }
}

You may visit the gihub repository for source code download.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Member 8292021

United States United States
No Biography provided

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Mobile
Web04 | 2.8.140827.1 | Last Updated 27 Nov 2012
Article Copyright 2012 by Member 8292021
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid