Flappy bird robot mars's game

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

No:40574

←

Prev Next

→

Flappy bird robot mars
Developer User18158｜Date and time 24/2/3 16:43:59
Build time 10.221 sec｜Game capacity 3.498KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird: Robot Mars</title>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>

// Load the game assets (images)
        const birdImage = new Image();
        birdImage.src = "bird.png";

const pipeTopImage = new Image();
        pipeTopImage.src = "pipe_top.png";

const pipeBottomImage = new Image();
        pipeBottomImage.src = "pipe_bottom.png";

const backgroundImg = new Image();
        backgroundImg.src = "background.png";

// Game variables
        let birdX = 50;
        let birdY = canvas.height / 2;
        let gravity = 1.5;
        let score = 0;

// Pipe variables
        let pipeGap = 85;
        let pipeFrequency = 100; // in frames
        let pipeX = canvas.width;
        let pipes = [];

// Add event listener for key presses
        document.addEventListener("keydown", moveUp);

function moveUp(event) {
            if (event.keyCode === 32) { // Space bar keycode
                birdY -= 25;
            }
        }

// Game loop
        function gameLoop() {
            // Clear the canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw background
            ctx.drawImage(backgroundImg, 0, 0, canvas.width, canvas.height);

// Draw pipes
            for (let i = 0; i < pipes.length; i++) {
                ctx.drawImage(pipeTopImage, pipes[i].x, pipes[i].topY, 60, 300);
                ctx.drawImage(pipeBottomImage, pipes[i].x, pipes[i].bottomY, 60, 300);

pipes[i].x--;

// Check collision with bird
                if (birdX + birdImage.width >= pipes[i].x && birdX <= pipes[i].x + pipeTopImage.width &&
                    (birdY <= pipes[i].topY + pipeTopImage.height || birdY + birdImage.height >= pipes[i].bottomY)) {
                    // Game over
                    gameOver();
                }

// Check if pipe has passed bird
                if (pipes[i].x + pipeTopImage.width === birdX) {
                    score++;
                }

// Remove pipes that move off screen
                if (pipes[i].x + pipeTopImage.width < 0) {
                    pipes.splice(i, 1);
                }
            }

// Draw bird
            ctx.drawImage(birdImage, birdX, birdY, 50, 50);
            birdY += gravity;

// Draw score
            ctx.fillStyle = "#000";
            ctx.font = "20px Arial";
            ctx.fillText(`Score: ${score}`, 10, canvas.height - 20);

// Generate new pipes
            if (frames % pipeFrequency === 0) {
                let pipeY = canvas.height - 100;
                let newPipe = {
                    x: canvas.width,
                    topY: pipeY - pipeGap,
                    bottomY: pipeY + pipeGap
                };
                pipes.push(newPipe);
            }

// Request next animation frame
            requestAnimationFrame(gameLoop);
        }

// Game over handler
        function gameOver() {
            alert(`Game Over! Your score: ${score}`);
            birdX = 50;
            birdY = canvas.height / 2;
            pipes = [];
            score = 0;
        }

// Start the game loop
        gameLoop();
    </script>
</body>
</html>