http://bet.ucoz.co.uk

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

November 27th, 2012 in General
Skip to comments (0) ↓
 

As the post of the first part, we will do 7 steps and we have read the first 3 steps already. Now this is the last part of the tutorial. The last 4 steps may not be completed all. All are changed to 2 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 4 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 gihub repository for source code download.

 

(comments disabled)