AI game creator

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

No:2647

745

←

Prev Next

→

artificial cocoon
Developer User1006｜Date and time 23/6/22 7:27:33
Build time 44.353 sec｜Game capacity 2.727KB｜

Script

グールの飛行機 🛩️

（解釈：これは、グールという飛行機を操作して、障害物を避けながら点数を稼ぐゲームです。スマホでの操作を前提に、ボタンを用意し、飛行機の方向を変えることができます。絵文字を使って、可愛い雰囲気にしています。）

←

Prev　Next

→ 　

Back　

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

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

グールの飛行機 🛩️

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>グールの飛行機</title>
	<style>
		canvas {
			border: 1px solid black;
		}
	</style>
</head>
<body>
	<canvas id="gameCanvas" width="300" height="400"></canvas>
	<div>
		<button id="btnLeft" onclick="changeDirection('left')">⬅️</button>
		<button id="btnRight" onclick="changeDirection('right')">➡️</button>
		<button id="btnUp" onclick="changeDirection('up')">⬆️</button>
		<button id="btnDown" onclick="changeDirection('down')">⬇️</button>
	</div>

// キー操作
		document.onkeydown = movePlane;
		function movePlane(event) {
			switch (event.keyCode) {
				case 37: // left arrow
					changeDirection('left');
					break;
				case 38: // up arrow
					changeDirection('up');
					break;
				case 39: // right arrow
					changeDirection('right');
					break;
				case 40: // down arrow
					changeDirection('down');
					break;
			}
		}

// ボタン操作
		function changeDirection(newDirection) {
			direction = newDirection;
		}

// ゲームループ
		setInterval(update, 50);
		function update() {
			var canvas = document.getElementById('gameCanvas');
			var ctx = canvas.getContext('2d');
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// 飛行機を描く
			ctx.fillStyle = 'black';
			ctx.beginPath();
			ctx.moveTo(positionX - 10, positionY);
			ctx.lineTo(positionX + 10, positionY);
			if (direction == 'up') {
				ctx.lineTo(positionX, positionY - 20);
			} else if (direction == 'down') {
				ctx.lineTo(positionX, positionY + 20);
			} else if (direction == 'right') {
				ctx.lineTo(positionX + 20, positionY);
			} else if (direction == 'left') {
				ctx.lineTo(positionX - 20, positionY);
			}
			ctx.closePath();
			ctx.fill();

// 点数を表示する
			ctx.font = 'bold 20px sans-serif';
			ctx.fillStyle = 'black';
			ctx.fillText('🔥 ' + score, 10, 30);

// 障害物を動かす
			positionY += 4;
			if (positionY > canvas.height) {
				positionY = -20;
				positionX = Math.random() * (canvas.width - 20) + 10;
				score++;
			}

// 当たり判定
			if (positionY + 10 > canvas.height) {
				alert('Game Over\nYour Score: ' + score);
				window.location.reload();
			}
		}
	</script>
</body>
</html>