Vertical scrolling action game created by AI's game

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

No:960

253

←

Prev Next

→

Vertical scrolling action game created by AI
Developer User3198｜Date and time 23/6/17 23:13:58
Build time 40.828 sec｜Game capacity 3.186KB｜

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 name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>

// ゲームの変数
		var playerHeight = 50;
		var playerWidth = 50;
		var playerX = canvas.width / 2;
		var playerY = canvas.height - playerHeight;
		var playerSpeed = 5;
		var enemyHeight = 30;
		var enemyWidth = 30;
		var enemySpeed = 3;
		var score = 0;
		var gameOver = false;

// イベントのリスナー追加
		document.addEventListener("keydown", keyDownHandler, false);

// キー押下のハンドラー
		function keyDownHandler(e) {
			if(e.key == "ArrowRight" && playerX < canvas.width - playerWidth) {
				playerX += playerSpeed;
			}
			else if(e.key == "ArrowLeft" && playerX > 0) {
				playerX -= playerSpeed;
			}
		}

// プレイヤーを描画する関数
		function drawPlayer() {
			ctx.beginPath();
			ctx.rect(playerX, playerY, playerWidth, playerHeight);
			ctx.fillStyle = "yellow";
			ctx.fill();
			ctx.closePath();
		}

// エネミーを生成する関数
		function createEnemy() {
			var newEnemy = {
				x: Math.floor(Math.random() * canvas.width),
				y: 0
			};
			enemies.push(newEnemy);
		}

// エネミーを描画する関数
		function drawEnemies() {
			for(var i=0; i<enemies.length; i++) {
				ctx.beginPath();
				ctx.rect(enemies[i].x, enemies[i].y, enemyWidth, enemyHeight);
				ctx.fillStyle = "red";
				ctx.fill();
				ctx.closePath();
			}
		}

// ゲームオーバー文字を描画する関数
		function drawGameOver() {
			ctx.fillStyle = "black";
			ctx.font = "40px Arial";
			ctx.textAlign = "center";
			ctx.fillText("Game Over", canvas.width/2, canvas.height/2);
		}

// スコアを描画する関数
		function drawScore() {
			ctx.fillStyle = "black";
			ctx.font = "20px Arial";
			ctx.textAlign = "left";
			ctx.fillText("Score: " + score, 10, 30);
		}

// ゲームループ
		function gameLoop() {
			if(gameOver) {
				drawGameOver();
				return;
			}

// キャンバスをクリア
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// プレイヤーを描画
			drawPlayer();

// エネミーを生成
			if(Math.random() > 0.97) {
				createEnemy();
			}

// エネミーを落とす
			for(var i=0; i<enemies.length; i++) {
				enemies[i].y += enemySpeed;

// プレイヤーとエネミーの衝突
				if(enemies[i].x < playerX + playerWidth && enemies[i].x + enemyWidth > playerX && enemies[i].y < playerY + playerHeight && enemies[i].y + enemyHeight > playerY) {
					gameOver = true;
				}

// エネミーを消す
				if(enemies[i].y > canvas.height) {
					enemies.splice(i, 1);
					score++;
					i--;
				}
			}

// エネミーを描画
			drawEnemies();

// スコアを描画
			drawScore();

// 次のループを実行
			requestAnimationFrame(gameLoop);
		}

// エネミーを格納する配列
		var enemies = [];

// ゲームループをスタート
		gameLoop();

</script>
</body>
</html>