AI game creator

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

No:19492

←

Prev Next

→

Flappy bird
Developer User8648｜Date and time 23/10/4 10:30:13
Build time 21.722 sec｜Game capacity 3.607KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flappy Bird</title>
    <style>
        canvas {
            border: 1px solid black;
            background-color: lightblue;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
    <script>
        // Variáveis do jogo
        var canvas, context;
        var birdX, birdY;
        var gravity, jumpPower;
        var pipeWidth, pipeHeight;
        var gapSize, pipeGap;
        var pipeX, pipeY;
        var score;

// Inicialização do jogo
        function startGame() {
            canvas = document.getElementById("gameCanvas");
            context = canvas.getContext("2d");
            birdX = 50;
            birdY = canvas.height / 2;
            gravity = 1.5;
            jumpPower = -15;
            pipeWidth = 60;
            pipeHeight = canvas.height / 2;
            gapSize = 120;
            pipeGap = 200;
            pipeX = canvas.width;
            pipeY = [];
            score = 0;
            pipeY[0] = 0;
            context.clearRect(0, 0, canvas.width, canvas.height);
            document.addEventListener("keydown", jump);
            setInterval(updateGame, 20);
        }

// Atualização do jogo
        function updateGame() {
            context.clearRect(0, 0, canvas.width, canvas.height);

// Movimento do pássaro
            birdY += gravity;
            context.fillStyle = "yellow";
            context.fillRect(birdX, birdY, 30, 30);

// Movimento dos canos
            pipeX -= 5;
            context.fillStyle = "green";
            for (var i = 0; i < pipeY.length; i++) {
                context.fillRect(pipeX, pipeY[i], pipeWidth, pipeHeight);
                context.fillRect(pipeX, pipeY[i] + pipeHeight + gapSize, pipeWidth, pipeHeight);
                pipeY[i] += 2;
                
                // Criação de novos canos
                if (pipeX === canvas.width - pipeGap) {
                    pipeY.push(Math.floor(Math.random() * (canvas.height - pipeGap)));
                }
                
                // Verificação de colisão
                if (birdY <= pipeY[i] + pipeHeight || birdY + 30 >= pipeY[i] + pipeHeight + gapSize || birdY + 30 >= canvas.height) {
                    gameOver();
                }

// Atualização da pontuação
                if (birdX === pipeX + pipeWidth) {
                    score++;
                    if (score % 5 === 0) {
                        gravity += 0.5;
                    }
                }
            }

// Desenho da pontuação
            context.fillStyle = "black";
            context.font = "30px Arial";
            context.fillText("Pontuação: " + score, 10, 50);
        }

// Ação de pulo
        function jump(event) {
            if (event.keyCode === 32 || event.keyCode === 38) {
                birdY += jumpPower;
            }
        }

// Fim de jogo
        function gameOver() {
            clearInterval(updateGame);
            context.clearRect(0, 0, canvas.width, canvas.height);
            context.fillStyle = "red";
            context.font = "50px Arial";
            context.fillText("Fim de Jogo", canvas.width / 2 - 150, canvas.height / 2 - 50);
            context.fillText("Pontuação: " + score, canvas.width / 2 - 100, canvas.height / 2 + 50);
        }

// Inicialização do jogo
        startGame();
    </script>
</body>`