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

No:890

167

←

Prev Next

→

Mine with only one bomb.
Developer User3146｜Date and time 23/6/17 22:02:36
Build time 94.454 sec｜Game capacity 6.378KB｜

Script

爆弾が１つしかないマインスイーパー

遊び方：クリックしたマスの周囲の数字が爆弾の数を表します。爆弾があると思う場所には右クリックをしてフラグを立てます。すべてのフラグを立てられたら、残りのマスを開いてください。

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
	<title>爆弾が１つしかないマインスイーパー</title>
</head>
<body>
	<h1>爆弾が１つしかないマインスイーパー</h1>
	<p>遊び方：クリックしたマスの周囲の数字が爆弾の数を表します。爆弾があると思う場所には右クリックをしてフラグを立てます。すべてのフラグを立てられたら、残りのマスを開いてください。</p>
	<div id="game_board"></div>
	<button onclick="newGame()">新しいゲームを始める</button>
	<script>
		var bombLocation;
		var gameBoard = document.getElementById('game_board');
		var boardWidth = 8;
		var boardHeight = 8;
		var gridSize = 50;
		var squarePadding = 5;
		var gameBoardWidth = boardWidth * (gridSize + squarePadding * 2);

function newGame() {
			bombLocation = Math.floor(Math.random() * boardWidth * boardHeight);
			drawBoard();
		}

// ゲームボードを描画
		function drawBoard() {
			gameBoard.innerHTML = '';
			gameBoard.style.width = gameBoardWidth + "px";
			for (var i = 0; i < boardWidth * boardHeight; i++) {
				var square = document.createElement('div');
				square.className = 'square';
				square.id = i;
				square.style.width = gridSize + "px";
				square.style.height = gridSize + "px";
				square.style.padding = squarePadding + "px";
				square.setAttribute('onclick', 'clickSquare(' + i + ')');
				square.setAttribute('oncontextmenu', 'return false;');
				gameBoard.appendChild(square);
			}
		}

// マスをクリック
		function clickSquare(index) {
			var square = document.getElementById(index);
			if (index == bombLocation) {
				square.innerHTML = '💥'; // 爆弾がある場合
				alert('ゲームオーバー');
			} else {
				var bombsNearby = 0;
				if (index % boardWidth > 0 && (index - 1) != bombLocation && document.getElementById(index - 1).classList.contains('flagged')) bombsNearby++; // 左
				if (index > boardWidth && (index - boardWidth - 1) != bombLocation && document.getElementById(index - boardWidth - 1).classList.contains('flagged')) bombsNearby++; // 左上
				if (index >= boardWidth && (index - boardWidth) != bombLocation && document.getElementById(index - boardWidth).classList.contains('flagged')) bombsNearby++; // 上
				if (index >= boardWidth && (index - boardWidth + 1) != bombLocation && document.getElementById(index - boardWidth + 1).classList.contains('flagged')) bombsNearby++; // 右上
				if (index % boardWidth < boardWidth - 1 && (index + 1) != bombLocation && document.getElementById(index + 1).classList.contains('flagged')) bombsNearby++; // 右
				if (index < boardWidth * (boardHeight - 1) && (index + boardWidth + 1) != bombLocation && document.getElementById(index + boardWidth + 1).classList.contains('flagged')) bombsNearby++; // 右下
				if (index < boardWidth * (boardHeight - 1) && (index + boardWidth) != bombLocation && document.getElementById(index + boardWidth).classList.contains('flagged')) bombsNearby++; // 下
				if (index % boardWidth > 0 && index < boardWidth * (boardHeight - 1) && (index + boardWidth - 1) != bombLocation && document.getElementById(index + boardWidth - 1).classList.contains('flagged')) bombsNearby++; // 左下
				if (bombsNearby > 0) {
					square.innerHTML = bombsNearby;
				} else {
					square.classList.add('clicked');
					if (index % boardWidth > 0 && (index - 1) != bombLocation && !document.getElementById(index - 1).classList.contains('clicked')) clickSquare(index - 1); // 左
					if (index > boardWidth && (index - boardWidth - 1) != bombLocation && !document.getElementById(index - boardWidth - 1).classList.contains('clicked')) clickSquare(index - boardWidth - 1); // 左上
					if (index >= boardWidth && (index - boardWidth) != bombLocation && !document.getElementById(index - boardWidth).classList.contains('clicked')) clickSquare(index - boardWidth); // 上
					if (index >= boardWidth && (index - boardWidth + 1) != bombLocation && !document.getElementById(index - boardWidth + 1).classList.contains('clicked')) clickSquare(index - boardWidth + 1); // 右上
					if (index % boardWidth < boardWidth - 1 && (index + 1) != bombLocation && !document.getElementById(index + 1).classList.contains('clicked')) clickSquare(index + 1); // 右
					if (index < boardWidth * (boardHeight - 1) && (index + boardWidth + 1) != bombLocation && !document.getElementById(index + boardWidth + 1).classList.contains('clicked')) clickSquare(index + boardWidth + 1); // 右下
					if (index < boardWidth * (boardHeight - 1) && (index + boardWidth) != bombLocation && !document.getElementById(index + boardWidth).classList.contains('clicked')) clickSquare(index + boardWidth); // 下
					if (index % boardWidth > 0 && index < boardWidth * (boardHeight - 1) && (index + boardWidth - 1) != bombLocation && !document.getElementById(index + boardWidth - 1).classList.contains('clicked')) clickSquare(index + boardWidth - 1); // 左下
				}
				checkVictory();
			}
		}

// ゲームクリア
		function checkVictory() {
			var flaggedSquares = document.querySelectorAll('.flagged');
			var unclickedSquares = document.querySelectorAll('.square:not(.clicked)');
			if (flaggedSquares.length == 1 && flaggedSquares[0].id == bombLocation) {
				alert('ゲームクリア');
			} else if (unclickedSquares.length == 1 && unclickedSquares[0].id == bombLocation) {
				unclickedSquares[0].innerHTML = '🚩';
				alert('ゲームクリア');
			}
		}

// フラグを立てる
		function toggleFlag(index) {
			if (!document.getElementById(index).classList.contains('flagged')) {
				document.getElementById(index).classList.add('flagged');
				document.getElementById(index).innerHTML = '🚩';
			} else {
				document.getElementById(index).classList.remove('flagged');
				document.getElementById(index).innerHTML = '';
			}
			checkVictory();
		}

// マスを右クリック
		document.addEventListener('contextmenu', function(e) {
			if (e.target.classList.contains('square')) {
				e.preventDefault();
				toggleFlag(e.target.id);
			}
		}, false);
	</script>
	<style>
		.square {
			display: inline-block;
			background-color: #ddd;
			text-align: center;
			vertical-align: middle;
			font-size: 30px;
			font-weight: bold;
		}

.square.clicked {
			background-color: #eee;
		}

.square.flagged {
			background-color: #fff;
		}
	</style>
</body>
</html>