AI game creator

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

No:45062

104

←

Prev Next

→

Make floppy bird
Developer User19568｜Date and time 24/2/20 5:14:57
Build time 8.056 sec｜Game capacity 1.913KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Floppy Bird</title>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>

var bird = {x: 50, y: 150, width: 20, height: 20, gravity: 0.5, velocity: 0};
        var pipes = [];

function drawBird() {
            ctx.fillStyle = "yellow";
            ctx.fillRect(bird.x, bird.y, bird.width, bird.height);
        }

function drawPipes() {
            ctx.fillStyle = "green";
            pipes.forEach(function(pipe) {
                ctx.fillRect(pipe.x, pipe.y, pipe.width, pipe.height);
            });
        }

function updateBird() {
            bird.velocity += bird.gravity;
            bird.y += bird.velocity;
        }

function updatePipes() {
            pipes.forEach(function(pipe) {
                pipe.x--;
            });
        }

function checkCollision() {
            pipes.forEach(function(pipe) {
                if (bird.x < pipe.x + pipe.width && bird.x + bird.width > pipe.x &&
                    bird.y < pipe.y + pipe.height && bird.y + bird.height > pipe.y) {
                    alert("Game Over!");
                }
            });
        }

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

drawBird();
            updateBird();

drawPipes();
            updatePipes();

checkCollision();

requestAnimationFrame(gameLoop);
        }

function tap() {
            bird.velocity = -10;
        }

canvas.addEventListener("click", tap);

for (var i = 0; i < 3; i++) {
            pipes.push({x: 300 + i * 200, y: Math.floor(Math.random() * 200), width: 50, height: 150});
        }

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