対戦ゲームを作る。 その6

#概要

対戦ゲームを作る。
とりあえずの動作品できました。

#動作の確認方法

２つ開いて、最初にクリックした方が白。
交互にクリックします。

#サンプルコード

```

var coma = 'koma.png';
var ban = [];
var flg = 1;
var game = new Game();
game.fps(5);
game.preload([coma]);
game.start();
var aLabel = new Label("a", 50, 330);
aLabel.size(20);
aLabel.label('白: 自分<br>黒: 相手');
ban = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 2, 1, 1, 1, 1, 1, 1, 2, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1];
var field = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
for (var i = 0; i < 64; i++)
{
	field[i] = new Sprite(40, 40, coma, 4, 1);
	field[i].frame(ban[i]);
	field[i].x((i % 8) * 40);
	field[i].y(Math.floor(i / 8) * 40);
	field[i].jq.click(function() {
		var n = this.id;
		n = n.replace("tsGameNode", "");
		n = n - 2;
		test(n);
	});
}
function getUniq() {
  var strong = 3;
  return new Date().getTime().toString(16) + Math.floor(strong * Math.random()).toString(16)
}
var id0 = getUniq();
var state = 0;
var iro = 2;
var bLabel = new Label("a", 50, 390);
bLabel.size(12);
var url = "wss://ohiapp0.herokuapp.com/pub";
var ws = new WebSocket(url);
ws.onopen = function() {
  bLabel.label("> CONNECTED"); 
};
ws.onmessage = function(e) {
  bLabel.label("> RECV: " + e.data);
  var json0 = JSON.parse(e.data);
	//alert(json0);
	if (json0.id == id0)
		return;
	//alert(json0.iro);
  if (json0.iro == 2)
	{
		iro = 0;
		aLabel.label('白: 相手<br>黒: 自分');
	}	
	else
	{
		iro = 2;
		aLabel.label('白: 自分<br>黒: 相手');
	}
	//alert(json0.ban);
	ban = json0.ban;
	//alert(json0.te);
	var res = oku(json0.te, json0.iro);
	if (res == -1)
	{
		var end = -1;
		for (var i = 0; i < 64; i++)
		{
			field[i].frame(ban[i]);
			if (ban[i] == 1) 
				end = 0;
		}
		if (end == -1) 
			alert("game over");
	}
	else
	{
		alert("石が置けません。");
	}
};
ws.onerror = function(e) {
  bLabel.label("> ERROR: " + e.data);
};
function send(id, state, iro, ban, te) {
	var m = "{";
	m += '"id":"' + id + '",';
	m += '"state":' + state + ",";
	m += '"iro":' + iro + ",";
	m += '"ban": [' + ban + "],";
	m += '"te":' + te;
	m += "}";
  bLabel.label("> SEND: " + m );
  ws.send(m);
}
function check(put, d) {
	var x = put % 8;
	var y = Math.floor(put / 8);
	var res = 0;
	if (x == 0 && (d == -9 || d == -1 || d ==  7)) 
		res = 1;
	if (x == 7 && (d == -7 || d ==  1 || d ==  9)) 
		res = 1;
	if (y == 0 && (d == -9 || d == -8 || d == -7)) 
		res = 1;
	if (y == 7 && (d ==  7 || d ==  8 || d ==  9)) 
		res = 1;
	return res;
}
function oku(put, iro) {
	var res = 0;
	var turn = 0;
	if (iro == 0) 
		turn = 2;
	var dir = new Array(-9, -8, -7, -1, 1, 7, 8, 9);
	var tugi;
	var i;
	var count;
	if (ban[put] == 1)
	{
		for (i = 0; i < 8; i++)
		{
			count = 0;
			tugi = put;
			do
			{
				if (check(tugi, dir[i]) == 1) 
					break;
				count++;
				tugi += dir[i];
			}	while (ban[tugi] == turn);
			if ((count > 1) && (ban[tugi] == iro))
			{
				res = -1;
				tugi = put;
	   		do
				{
	   			ban[tugi] = iro;
					tugi += dir[i];
				}	while (ban[tugi] == turn);
			}
		}
	}
	return res;
}
function test(n) {
	var put;
	var res;
	if (flg > 0)
	{
		put = n;
		send(id0, state, iro, ban, put);
		res = oku(put, iro);
		if (res == -1)
		{
			var end = -1;
			for (var i = 0; i < 64; i++)
			{
				field[i].frame(ban[i]);
				if (ban[i] == 1) 
					end = 0;
			}
			if (end == -1) 
				alert("game over");
		}
	}
}
//alert(oku(19, 2));



```

#写真

![無題.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/7b31b1cb-9d5b-093c-55a8-2e49cc20f94f.jpeg)


#成果物

https://embed.plnkr.co/plunk/YOPT0b6JCERVh4AQ

以上。