Click here for free DL of the app version that can save data.

No:778

214

←

Prev Next

→

Othello (board game)
Developer User3099｜Date and time 23/6/17 17:23:51
Build time 117.174 sec｜Game capacity 8.248KB｜

Script

オセロ

相手の石を取りながら自分の石を増やすゲームです。

現在の状況

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>オセロ</title>
	<style>
		body {
			font-size: 24px;
			text-align: center;
		}
		.board {
			display: inline-block;
			margin: 0 auto;
			border-collapse: collapse;
		}
		.cell {
			width: 50px;
			height: 50px;
			border: 1px solid black;
		}
		.black {
			background-color: black;
			border-radius: 50%;
			display: inline-block;
			margin: 5px;
			width: 40px;
			height: 40px;
		}
		.white {
			background-color: white;
			border-radius: 50%;
			display: inline-block;
			margin: 5px;
			width: 40px;
			height: 40px;
		}
	</style>
</head>
<body>
	<h1>オセロ</h1>
	<p>相手の石を取りながら自分の石を増やすゲームです。</p>

<p>現在の状況</p>
	<div id="black_count" class="black"></div>
	<div id="white_count" class="white"></div>
	
	<script>
		var board = [
			['', '', '', '', '', '', '', ''],
			['', '', '', '', '', '', '', ''],
			['', '', '', '', '', '', '', ''],
			['', '', '', '●', '○', '', '', ''],
			['', '', '', '○', '●', '', '', ''],
			['', '', '', '', '', '', '', ''],
			['', '', '', '', '', '', '', ''],
			['', '', '', '', '', '', '', '']
			];
		var player = '●';
		var opponent = '○';

function placeStone(row, col) {
			if (board[row][col] !== '') {
				return;
			}

var directions = [[-1,-1], [-1,0], [-1,1], [0,-1], [0,1], [1,-1], [1,0], [1,1]];
			var stonesToFlip = [];

for (var d = 0; d < directions.length; d++) {
				var r = row + directions[d][0];
				var c = col + directions[d][1];
				var stonesToFlipInDirection = [];

while (r >= 0 && r < 8 && c >= 0 && c < 8) {
					if (board[r][c] === opponent) {
						stonesToFlipInDirection.push([r,c]);
						r += directions[d][0];
						c += directions[d][1];
					} else if (board[r][c] === player) {
						stonesToFlip = stonesToFlip.concat(stonesToFlipInDirection);
						break;
					} else {
						break;
					}
				}
			}

if (stonesToFlip.length === 0) {
				return;
			}

board[row][col] = player;

for (var i = 0; i < stonesToFlip.length; i++) {
				var r = stonesToFlip[i][0];
				var c = stonesToFlip[i][1];
				board[r][c] = player;
				document.getElementById('cell_' + r + '_' + c).innerHTML = player;
			}

document.getElementById('cell_' + row + '_' + col).innerHTML = player;

var numBlack = 0;
			var numWhite = 0;

for (var i = 0; i < 8; i++) {
				for (var j = 0; j < 8; j++) {
					if (board[i][j] === '●') {
						numBlack++;
					} else if (board[i][j] === '○') {
						numWhite++;
					}
				}
			}

document.getElementById('black_count').innerHTML = '×' + numBlack;
			document.getElementById('white_count').innerHTML = '×' + numWhite;

var tmp = player;
			player = opponent;
			opponent = tmp;
		}
	</script>
</body>
</html>