AI game creator

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

No:13565

←

Prev Next

→

Flappy bird
Developer User5940｜Date and time 23/8/29 0:34:39
Build time 20.048 sec｜Game capacity 3.603KB｜

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</title>
    <style>
        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
        // Flappy Bird game implementation
        // Created by OpenAI's ChatGPT

// Game variables
        var canvas;
        var canvasContext;
        var birdX = 50;
        var birdY = 300;
        var birdVelocityY = 0;
        var gravity = 0.5;
        var pipeGap = 150;
        var pipeSpeed = 3;
        var score = 0;
        var gameInterval;

// Pictograms for bird and pipe (You can replace with actual pictograms)
        var birdImage = "🐦";
        var pipeImage = "🚪";

// Initialize the game
        function gameInit() {
            canvas = document.getElementById("gameCanvas");
            canvasContext = canvas.getContext("2d");

// Start the game interval
            gameInterval = setInterval(updateGame, 20);

// Handle touch events for mobile operation
            canvas.addEventListener("touchstart", birdJump);
        }

// Update game state and redraw on canvas
        function updateGame() {
            // Move the bird
            birdVelocityY += gravity;
            birdY += birdVelocityY;

// Clear the game canvas
            canvasContext.clearRect(0, 0, canvas.width, canvas.height);

// Draw bird
            canvasContext.fillText(birdImage, birdX, birdY);

// Draw pipes
            for (var i = 0; i < pipes.length; i++) {
                canvasContext.fillText(pipeImage, pipes[i].x, pipes[i].top);
                canvasContext.fillText(pipeImage, pipes[i].x, pipes[i].bottom);
                pipes[i].x -= pipeSpeed;

// Check collision with bird
                if (birdX + birdImage.length >= pipes[i].x && birdX <= pipes[i].x + pipeImage.length) {
                    if (birdY <= pipes[i].top || birdY + birdImage.length >= pipes[i].bottom) {
                        gameOver();
                    }
                }

// Increase score if bird passed the pipe
                if (birdX > pipes[i].x + pipeImage.length && !pipes[i].passed) {
                    score++;
                    pipes[i].passed = true;
                }
            }

// Display score
            canvasContext.fillText("Score: " + score, 20, 30);

// Generate new pipes
            if (pipes.length > 0 && pipes[0].x + pipeImage.length < 0) {
                pipes.shift();
            }
            if (pipes.length === 0 || canvas.width - pipes[pipes.length - 1].x >= pipeGap * 2) {
                var pipeY = Math.floor(Math.random() * (canvas.height - pipeGap));
                pipes.push({
                    x: canvas.width,
                    top: pipeY,
                    bottom: pipeY + pipeGap,
                    passed: false
                });
            }

// Check collision with top and bottom of the canvas
            if (birdY < 0 || birdY + birdImage.length > canvas.height) {
                gameOver();
            }
        }

// Handle bird jump
        function birdJump() {
            birdVelocityY = -10;
        }

// Game over
        function gameOver() {
            clearInterval(gameInterval);
            alert("Game Over! Final Score: " + score);
            location.reload(); // Reload page to play again
        }

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