Flappy bird but randomized's game

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

No:37850

←

Prev Next

→

Flappy bird but randomized
Developer User17064｜Date and time 24/1/21 18:18:57
Build time 13.233 sec｜Game capacity 3.879KB｜

Script

Sure! Here's an example implementation of a randomized version of Flappy Bird using HTML, JavaScript, and some pictograms:

You can copy and save this code as a single HTML file (e.g., `randomized_flappy_bird.html`) and open it in a browser to play the game. Use the spacebar to make the bird jump and try to avoid colliding with the pipes. The pipes will be randomly generated, providing a different challenge each time you play. The score will be displayed at the top left corner of the canvas. Enjoy!

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

Sure! Here's an example implementation of a randomized version of Flappy Bird using HTML, JavaScript, and some pictograms:

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Randomized Flappy Bird</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Game settings
        var gravity = 0.8;
        var jumpForce = 12;
        var gapSize = 120;
        var birdSize = 40;
        var pipeWidth = 80;
        var pipeSpeed = 5;

// Game variables
        var score = 0;
        var isGameOver = false;

// Bird object
        var bird = {
            x: 50,
            y: canvas.height / 2 - birdSize / 2,
            velocity: 0,
            color: "yellow",
            draw: function() {
                context.fillStyle = this.color;
                context.fillRect(this.x, this.y, birdSize, birdSize);
            },
            update: function() {
                this.velocity += gravity;
                this.y += this.velocity;
            },
            jump: function() {
                this.velocity = -jumpForce;
            }
        };

// Pipe object
        var pipe = {
            x: canvas.width,
            y: 0,
            width: pipeWidth,
            color: "green",
            draw: function() {
                context.fillStyle = this.color;
                context.fillRect(this.x, this.y, this.width, canvas.height);
            },
            update: function() {
                this.x -= pipeSpeed;
                if (this.x + this.width < 0) {
                    this.reset();
                    score++;
                }
            },
            reset: function() {
                this.x = canvas.width;
                this.y = getRandomPipeY();
            }
        };

// Event listeners
        document.addEventListener("keydown", function(event) {
            if (event.keyCode === 32 && !isGameOver) {
                bird.jump();
            }
        });

// Randomly generate the y position of the pipe opening
        function getRandomPipeY() {
            var minY = gapSize / 2;
            var maxY = canvas.height - gapSize / 2;
            return Math.floor(Math.random() * (maxY - minY + 1)) + minY;
        }

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

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

pipe.update();
            pipe.draw();

// Collision detection
            if (
                bird.y + birdSize > canvas.height ||
                bird.y < 0 ||
                (bird.x + birdSize > pipe.x &&
                bird.x < pipe.x + pipe.width &&
                (bird.y < pipe.y || bird.y + birdSize > pipe.y + gapSize))
            ) {
                isGameOver = true;
            }

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

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

// Start the game
        gameLoop();
    </script>
</body>
</html>
```