AI game creator

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

No:15328

133

←

Prev Next

→

Flappy bird
Developer User6662｜Date and time 23/9/8 21:04:19
Build time 25.41 sec｜Game capacity 4.375KB｜

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;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="canvas" width="400" height="400"></canvas>

// Flappy Bird variables
        let bird;
        let obstacles = [];
        let score = 0;

// Create the bird
        function createBird() {
            bird = {
                x: 50,
                y: canvas.height / 2,
                size: 20,
                speedY: 0,
                gravity: 0.5,
                jump: 7,
                draw: function () {
                    ctx.fillStyle = '#F00';
                    ctx.fillRect(this.x, this.y, this.size, this.size);
                },
                update: function () {
                    this.speedY += this.gravity;
                    this.y += this.speedY;

// Check if the bird hits the ground
                    if (this.y + this.size > canvas.height) {
                        gameOver();
                    }
                },
                flap: function () {
                    this.speedY = -this.jump;
                }
            };
        }

// Create obstacles
        function createObstacle() {
            const obstacle = {
                x: canvas.width,
                y: 0,
                width: 50,
                height: Math.random() * (canvas.height * 0.6) + 50,
                gap: 100,
                color: '#0F0',
                passed: false,
                draw: function () {
                    ctx.fillStyle = this.color;
                    ctx.fillRect(this.x, this.y, this.width, this.height);
                    ctx.fillRect(this.x, this.y + this.height + this.gap, this.width, canvas.height - (this.height + this.gap));
                },
                update: function () {
                    this.x -= 2;

// Check if the bird passed the obstacle
                    if (!this.passed && bird.x > this.x + this.width) {
                        score++;
                        this.passed = true;
                    }

// Check if the bird hits the obstacle
                    if (bird.x < this.x + this.width && bird.x + bird.size > this.x && (bird.y < this.height || bird.y + bird.size > this.height + this.gap)) {
                        gameOver();
                    }

// Remove the obstacle when it goes off the screen
                    if (this.x + this.width < 0) {
                        obstacles.shift();
                    }
                }
            };

obstacles.push(obstacle);
        }

// Handle key events
        function handleKeyPress(e) {
            if (e.keyCode === 32) { // Spacebar
                bird.flap();
            }
        }

// Handle touch events
        function handleTouch() {
            bird.flap();
        }

// Game over
        function gameOver() {
            document.removeEventListener('keypress', handleKeyPress);
            document.removeEventListener('touchstart', handleTouch);
            clearInterval(gameLoop);
            alert('Game Over! Score: ' + score);
        }

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

bird.draw();
            bird.update();

if (frame % 100 === 0) {
                createObstacle();
            }

for (let i = 0; i < obstacles.length; i++) {
                obstacles[i].draw();
                obstacles[i].update();
            }

ctx.fillStyle = '#000';
            ctx.font = '20px Arial';
            ctx.fillText('Score: ' + score, 10, 30);

frame++;
        }

// Start the game
        function startGame() {
            createBird();

document.addEventListener('keypress', handleKeyPress);
            document.addEventListener('touchstart', handleTouch);

gameLoopInterval = setInterval(gameLoop, 1000 / 60);
        }

// Initialize game
        let frame = 0;
        startGame();
    </script>
</body>
</html>