Atmospheric re-entry robot battle. The time limit is approaching every second. If you burn up, you lose.'s game

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

No:2642

791

←

Prev Next

→

Atmospheric re-entry robot battle. The time limit ..ALL
Developer User1006｜Date and time 23/6/22 7:14:58
Build time 41.314 sec｜Game capacity 2.801KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>大気圏再突入ロボバトル！</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			font-size: 3em;
			text-align: center;
			margin: 0;
			padding: 0;
		}
		canvas {
			background-color: #000;
			display: block;
			margin: 0 auto;
		}
	</style>
</head>
<body>
	<canvas id="canvas" width="720" height="480"></canvas>

// ロボット画像の準備
		const robotImg = new Image();
		robotImg.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/160/apple/237/robot-face_1f916.png";

// ロボットの位置と速度
		let robotX = canvas.width / 2;
		let robotY = canvas.height / 2;
		let robotVx = 0;
		let robotVy = 0;

// ゲームの設定
		let score = 0;
		let time = 30;

// ゲーム開始
		setInterval(() => {
			// 残り時間を更新
			time -= 1;
			if (time <= 0) {
				// ゲームオーバー
				alert("燃え尽きた！あなたのスコアは" + score + "点でした。");
				location.reload();
			}

// ロボットの移動
			robotX += robotVx;
			robotY += robotVy;

// 画面外に出たら反対側から出現する
			if (robotX < 0) robotX = canvas.width;
			if (robotX > canvas.width) robotX = 0;
			if (robotY < 0) robotY = canvas.height;
			if (robotY > canvas.height) robotY = 0;

// 画面をクリア
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// ロボットを描画
			ctx.drawImage(robotImg, robotX - 32, robotY - 32);

// スコアと残り時間を表示
			ctx.fillStyle = "#fff";
			ctx.fillText("Score: " + score, 10, 50);
			ctx.fillText("Time: " + time, 10, 100);

}, 1000 / 60); // 60fps

// イベントの設定
		document.addEventListener("keydown", (event) => {
			switch (event.key) {
				case "ArrowUp":
					robotVy = -5;
					break;
				case "ArrowDown":
					robotVy = 5;
					break;
				case "ArrowLeft":
					robotVx = -5;
					break;
				case "ArrowRight":
					robotVx = 5;
					break;
			}
		});

document.addEventListener("keyup", (event) => {
			switch (event.key) {
				case "ArrowUp":
					robotVy = 0;
					break;
				case "ArrowDown":
					robotVy = 0;
					break;
				case "ArrowLeft":
					robotVx = 0;
					break;
				case "ArrowRight":
					robotVx = 0;
					break;
			}
		});

// 得点アップ
		canvas.addEventListener("click", (event) => {
			const rect = canvas.getBoundingClientRect();
			const x = event.clientX - rect.left;
			const y = event.clientY - rect.top;

const distance = Math.sqrt((x - robotX) ** 2 + (y - robotY) ** 2);
			if (distance < 64) {
				score += 10;
			}
		});
	</script>
</body>
</html>