Flappy bird Costume bird's game

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

No:40198

←

Prev Next

→

Flappy bird Costume bird
Developer Flappy｜Date and time 24/2/1 16:24:41
Build time 23.656 sec｜Game capacity 6.189KB｜

Script

Sure! Here's an example of a simple Flappy Bird game implemented in a single HTML file using JavaScript:

This code represents a Flappy Bird game where you control a bird by clicking or tapping the screen. The goal is to navigate through the gaps between the pipes and avoid collision. The game keeps track of your score and gets progressively harder as you progress. Please note that this is a simple implementation and can be further enhanced with additional features, improvements, and optimizations.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple Flappy Bird game implemented in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird Costume Bird</title>
    <style>
        canvas {
            border: 1px solid black;
            background-color: #f8f8f8;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

// Helper function to create pictograms
        function loadPictogram(url) {
            var image = new Image();
            image.src = url;
            return image;
        }

// Bird class
        class Bird {
            constructor() {
                this.x = 150;
                this.y = 200;
                this.width = 34;
                this.height = 24;
                this.speedY = 0;
                this.image = loadPictogram('bird.png');
            }

update() {
                this.speedY += gravity;
                this.y += this.speedY;
            }

draw() {
                context.drawImage(this.image, this.x, this.y, this.width, this.height);
            }

flap() {
                this.speedY = jumpForce;
            }
        }

// Pipe class
        class Pipe {
            constructor() {
                this.space = 85;
                this.top = (Math.random() * canvas.height) / 3 + 20;
                this.bottom = (Math.random() * canvas.height) / 3 + 20;
                this.x = canvas.width;
                this.width = 50;
                this.imageTop = loadPictogram('pipeTop.png');
                this.imageBottom = loadPictogram('pipeBottom.png');
                this.passed = false;
            }

update() {
                this.x -= gameSpeed;
            }

draw() {
                context.drawImage(this.imageTop, this.x, 0, this.width, this.top);
                context.drawImage(this.imageBottom, this.x, canvas.height - this.bottom, this.width, this.bottom);
            }

collide(bird) {
                if (bird.y < this.top || bird.y + bird.height > canvas.height - this.bottom) {
                    if (bird.x + bird.width > this.x && bird.x < this.x + this.width) {
                        return true;
                    }
                }
                return false;
            }
        }

// Game initialization
        function startGame() {
            canvas = document.getElementById("gameCanvas");
            context = canvas.getContext("2d");
            bird = new Bird();
            pipes = [];

for (let i = 0; i < 3; i++) {
                pipes.push(new Pipe());
            }

document.addEventListener("keydown", flapBird);
            canvas.addEventListener("click", flapBird);

isGameOver = false;
            score = 0;
            gameSpeed = 3;

updateGame();
        }

// Game update loop
        function updateGame() {
            context.clearRect(0, 0, canvas.width, canvas.height);

// Update and draw bird
            bird.update();
            bird.draw();

// Update and draw pipes
            for (let i = 0; i < pipes.length; i++) {
                pipes[i].update();
                pipes[i].draw();

// Check collision with bird
                if (pipes[i].collide(bird)) {
                    gameOver();
                    return;
                }

// Increment score if bird passed through pipe
                if (!pipes[i].passed && bird.x > pipes[i].x + pipes[i].width) {
                    score++;
                    pipes[i].passed = true;
                }

// Remove pipes that are out of the screen
                if (pipes[i].x + pipes[i].width < 0) {
                    pipes.splice(i, 1);
                }
            }

// Add new pipe every 100 frames
            if (gameFrame % 100 === 0) {
                pipes.push(new Pipe());
            }

// Display score
            context.fillStyle = "black";
            context.font = "20px Arial";
            context.fillText("Score: " + score, 10, 25);

// Increase game speed
            gameSpeed += 0.01;

if (!isGameOver) {
                requestAnimationFrame(updateGame);
            }
        }

// Game over state
        function gameOver() {
            isGameOver = true;
            context.fillStyle = "black";
            context.font = "30px Arial";
            context.fillText("Game Over", canvas.width / 2 - 80, canvas.height / 2);

context.font = "20px Arial";
            context.fillText("Press Space to Restart", canvas.width / 2 - 100, canvas.height / 2 + 30);

document.removeEventListener("keydown", flapBird);
            canvas.removeEventListener("click", flapBird);
            document.addEventListener("keydown", restartGame);
        }

// Event handler for bird flap
        function flapBird() {
            if (isGameOver) {
                restartGame();
                return;
            }
            bird.flap();
        }

// Event handler for game restart
        function restartGame(event) {
            if (event.keyCode === 32 || event.type === "click") {
                document.removeEventListener("keydown", restartGame);
                startGame();
            }
        }

// Start the game
        startGame();
    </script>
</body>
</html>
```
This code represents a Flappy Bird game where you control a bird by clicking or tapping the screen. The goal is to navigate through the gaps between the pipes and avoid collision. The game keeps track of your score and gets progressively harder as you progress.

Please note that this is a simple implementation and can be further enhanced with additional features, improvements, and optimizations.