AI game creator

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

No:28204

←

Prev Next

→

Flappy bird
Developer User14025｜Date and time 23/12/11 7:41:51
Build time 25.519 sec｜Game capacity 4.129KB｜

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 {
            background-color: skyblue;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="canvas" width="320" height="480"></canvas>

// Variables
            var bird;
            var obstacles = [];
            var score;
            var gameSpeed;
            var gravity;

// Constants
            const jumpForce = 9;
            const obstacleWidth = 80;
            const obstacleHeight = 300;

// Pictograms
            var birdImg = new Image();
            birdImg.src = "bird.png";

var pipeNorthImg = new Image();
            pipeNorthImg.src = "pipeNorth.png";

var pipeSouthImg = new Image();
            pipeSouthImg.src = "pipeSouth.png";

// Game setup
            function setup() {
                bird = {
                    x: 80,
                    y: 240,
                    width: 40,
                    height: 40,
                    speed: 0,
                    rotation: 0
                };

score = 0;
                gameSpeed = 2;
                gravity = 0.25;

// Reset obstacles
                obstacles = [];
                obstacles[0] = {
                    x: canvas.width,
                    y: 0,
                    width: obstacleWidth,
                    height: obstacleHeight
                };

// Start game
                document.addEventListener("mousedown", jump);
                document.addEventListener("touchstart", jump);

setInterval(update, 1000 / 60);
            }

function update() {
                // Clear canvas
                ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw bird
                ctx.drawImage(birdImg, bird.x, bird.y, bird.width, bird.height);

// Bird physics
                bird.speed += gravity;
                bird.y += bird.speed;
                bird.rotation = Math.min((bird.speed / 10) * 90, 90);

// Draw obstacles
                for (var i = 0; i < obstacles.length; i++) {
                    var o = obstacles[i];

var pipeNorthY = o.height + o.y;
                    var pipeSouthY = o.y;

ctx.drawImage(pipeNorthImg, o.x, pipeNorthY, o.width, o.height);
                    ctx.drawImage(pipeSouthImg, o.x, pipeSouthY, o.width, o.height);

o.x -= gameSpeed;

if (o.x + o.width < 0) {
                        score++;
                        obstacles.splice(i, 1);
                    }

// Collision detection
                    if (
                        bird.x < o.x + o.width &&
                        bird.x + bird.width > o.x &&
                        (bird.y < pipeSouthY + o.height || bird.y + bird.height > pipeNorthY)
                    ) {
                        gameover();
                    }
                }

// Draw score
                ctx.fillStyle = "#000";
                ctx.font = "20px Verdana";
                ctx.fillText("Score: " + score, 10, canvas.height - 20);

// Game over
                if (bird.y + bird.height > canvas.height) {
                    gameover();
                }
            }

function jump() {
                bird.speed = -jumpForce;
            }

function gameover() {
                document.removeEventListener("mousedown", jump);
                document.removeEventListener("touchstart", jump);
                clearInterval(update);
                alert("Game Over! Score: " + score);
                location.reload(); // Reload the page to restart the game
            }

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