Flappy birthday a bird that jumps in-between pipes and when it touches the pipes the bird dies's game

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

No:50580

←

Prev Next

→

Flappy birthday a bird that jumps in-between pipes..ALL
Developer User21360｜Date and time 24/3/9 5:47:52
Build time 8.482 sec｜Game capacity 2.43KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Flappy Birthday</title>
</head>
<body>
    <canvas id="flappyBirdCanvas" width="320" height="480"></canvas>
    <script>
        const canvas = document.getElementById('flappyBirdCanvas');
        const ctx = canvas.getContext('2d');

let birdX = 50;
        let birdY = 200;
        let birdDY = 0;

let gravity = 0.8;
        let jump = -12;

let obstacleX = 320;
        let obstacleGap = 200;
        let obstacleWidth = 50;
        let obstacleSpeed = 3;

function drawBird() {
            ctx.fillStyle = 'yellow';
            ctx.fillRect(birdX, birdY, 30, 30);
        }

function drawObstacle() {
            ctx.fillStyle = 'green';
            ctx.fillRect(obstacleX, 0, obstacleWidth, canvas.height - obstacleGap);
            ctx.fillRect(obstacleX, canvas.height - obstacleGap + obstacleGap, obstacleWidth, canvas.height - obstacleGap);
        }

function update() {
            birdY += birdDY;
            birdDY += gravity;

obstacleX -= obstacleSpeed;

if (birdY > canvas.height || birdY < 0) {
                gameOver();
            }

if (obstacleX + obstacleWidth == birdX) {
                birdX += 1;
            }

if (birdX + 30 > obstacleX && birdX < obstacleX + obstacleWidth && (birdY < canvas.height - obstacleGap || birdY + 30 > canvas.height - obstacleGap + obstacleGap)) {
                gameOver();
            }

if (obstacleX + obstacleWidth < 0) {
                obstacleX = canvas.width;
            }
        }

function clearCanvas() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
        }

function draw() {
            clearCanvas();
            drawBird();
            drawObstacle();
        }

function jumpBird() {
            birdDY = jump;
        }

function gameOver() {
            alert('Game Over!');
            birdX = 50;
            birdY = 200;
            birdDY = 0;
            obstacleX = 320;
        }

document.addEventListener('keydown', function(event) {
            if (event.key === ' ' || event.key === 'Spacebar') {
                jumpBird();
            }
        });

function gameLoop() {
            update();
            draw();
            requestAnimationFrame(gameLoop);
        }

gameLoop();
    </script>
</body>
</html>