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

No:7467

1468

←

Prev Next

→

Dodge enemy’s
Developer User3477｜Date and time 23/7/7 23:07:29
Build time 15.762 sec｜Game capacity 2.806KB｜

Script

Dodge the Enemy

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Dodge the Enemy</title>
</head>
<body>
    <h1>Dodge the Enemy</h1>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Player variables
        let player = {
            x: canvas.width / 2,
            y: canvas.height - 30,
            width: 20,
            height: 20,
            speed: 6,
            direction: null
        };

// Enemy variables
        let enemy = {
            x: Math.random() * canvas.width,
            y: 0,
            width: 20,
            height: 20,
            speed: 3
        };

// Event listener for keydown event
        document.addEventListener("keydown", handleKeyDown);

// Function to handle keydown event
        function handleKeyDown(event) {
            if (event.key === "ArrowLeft") {
                player.direction = "left";
            } else if (event.key === "ArrowRight") {
                player.direction = "right";
            }
        }

// Function to update game state
        function updateGame() {
            if (player.direction === "left" && player.x > 0) {
                player.x -= player.speed;
            } else if (player.direction === "right" && player.x < canvas.width - player.width) {
                player.x += player.speed;
            }
            enemy.y += enemy.speed;

// Check for collision between player and enemy
            if (enemy.y + enemy.height > player.y && enemy.y < player.y + player.height &&
                enemy.x + enemy.width > player.x && enemy.x < player.x + player.width) {
                alert("Game Over!");
                resetGame();
            }

// Update canvas
            drawCanvas();
        }

// Function to draw canvas
        function drawCanvas() {
            // Clear canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
            ctx.fillStyle = "blue";
            ctx.fillRect(player.x, player.y, player.width, player.height);

// Draw enemy
            ctx.fillStyle = "red";
            ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
        }

// Function to reset game state
        function resetGame() {
            player.x = canvas.width / 2;
            player.y = canvas.height - 30;
            enemy.x = Math.random() * canvas.width;
            enemy.y = 0;
        }

// Start game loop
        function startGame() {
            setInterval(updateGame, 20);
        }

// Call startGame function to begin the game
        startGame();
    </script>
</body>
</html>