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

No:1011

156

←

Prev Next

→

AIs idea of an interesting game
Developer User3212｜Date and time 23/6/18 0:06:22
Build time 43.438 sec｜Game capacity 3.657KB｜

Script

Emoji Fish

Score: 0

How to play: Tap the screen to make the fish jump and avoid the obstacles!

このゲームは、Emoji Fishというタイトルの、飛び跳ねる魚を操作するゲームです。スマホで遊べるように、タップすることで魚が跳ねます。魚は、進みながら現れる障害物を避ける必要があります。障害物は、ランダムな位置で現れ、魚が通り抜けると得点が加算されます。魚が障害物にぶつかるとゲームオーバーとなり、得点が表示されます。 Emoji Fishは、かわいらしい絵文字で描かれた、シンプルで楽しいゲームです。

←

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>Emoji Fish</title>
	<style type="text/css">
		html, body {
			margin: 0;
			padding: 0;
			background-color: #ffb6c1;
			height: 100%;
		}
		canvas {
			display: block;
			margin: auto;
		}
		h1, h2 {
			color: #ffffff;
			text-align: center;
			margin: 20px;
		}
		div {
			text-align: center;
		}
	</style>
</head>
<body>
	<h1>Emoji Fish</h1>
	<canvas id="gameCanvas" width="360" height="600"></canvas>
	<h2>Score: <span id="score">0</span></h2>
	<p>How to play: Tap the screen to make the fish jump and avoid the obstacles!</p>
	<div><button onclick="startGame()">Start Game</button></div>

// Get canvas and context
		var canvas = document.getElementById("gameCanvas");
		var ctx = canvas.getContext("2d");

// Define variables
		var fish = { x: 50, y: 300, size: 50, dy: 0 }; // Fish position and size
		var obstacleList = []; // List of obstacles
		var score = 0; // Score

// Start game function
		function startGame() {
			// Reset variables
			fish = { x: 50, y: 300, size: 50, dy: 0 };
			obstacleList = [];
			score = 0;
			document.getElementById("score").innerHTML = score;

// Add event listener for tapping the screen
			canvas.addEventListener("mousedown", function() {
				fish.dy = -5;
			});

// Set up interval for the game loop
			var gameLoop = setInterval(function() {
				// Clear canvas
				ctx.clearRect(0, 0, canvas.width, canvas.height);

// Move fish
				fish.y += fish.dy;
				if (fish.y + fish.size > canvas.height) {
					fish.y = canvas.height - fish.size;
				}
				fish.dy += 0.2;

// Draw fish
				ctx.font = "50px Arial";
				ctx.fillText("🐟", fish.x, fish.y);

// Add obstacles randomly
				var r = Math.random();
				if (r < 0.02) {
					var obstacle = {
						x: canvas.width,
						y: Math.floor(Math.random() * (canvas.height - 200)),
						width: 50,
						height: 200,
						passed: false
					};
					obstacleList.push(obstacle);
				}

// Move obstacles
				for (var i = 0; i < obstacleList.length; i++) {
					obstacleList[i].x -= 4;

// Check collision with fish
					if (obstacleList[i].x + obstacleList[i].width > fish.x &&
						obstacleList[i].y < fish.y + fish.size &&
						obstacleList[i].x < fish.x + fish.size &&
						obstacleList[i].y + obstacleList[i].height > fish.y) {
						clearInterval(gameLoop);
						alert("Game over! Score: " + score);
						return;
					}

// Check if the obstacle has passed the fish
					if (!obstacleList[i].passed && obstacleList[i].x + obstacleList[i].width < fish.x) {
						obstacleList[i].passed = true;
						score++;
						document.getElementById("score").innerHTML = score;
					}

// Draw obstacle
					ctx.fillRect(obstacleList[i].x, obstacleList[i].y, obstacleList[i].width, obstacleList[i].height);
				}

// Remove passed obstacles from the list
				obstacleList = obstacleList.filter(function(obstacle) {
					return obstacle.x + obstacle.width > 0;
				});

}, 1000 / 60);
		}
	</script>
</body>
</html>