Generate flappy bird game but you can pickup gun's game

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

No:40470

←

Prev Next

→

Generate flappy bird game but you can pickup gun
Developer User18141｜Date and time 24/2/3 2:24:57
Build time 25.865 sec｜Game capacity 6.37KB｜

Script

Sure! Below is the code for a simple Flappy Bird game where you can also pick up a gun as a power-up. You can copy the code into a single HTML file and open it in your browser to play the game. Please note that this is a simple implementation and can be further enhanced if needed. The game controls are optimized for smartphone operation.

This implementation includes the basic functionalities of the Flappy Bird game, where you control a bird to navigate through pipes by clicking on the screen. Additionally, there is a gun power-up that you can pick up by colliding with it. Once you collide with a pipe, the game ends, and you can restart by clicking on the screen. Note: To keep the code concise and self-contained within a single HTML file, all the JavaScript functionality is included within the `
` tags.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird with Gun</title>
    <style>
        canvas {
            border: 1px solid #000;
            background: #f0f0f0;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
    <script>
        // Game variables
        var canvas, canvasContext;
        var birdX = 50;
        var birdY = 150;
        var birdSpeedY = 0;
        var gravity = 0.5;
        var jumpHeight = 8;
        var gapHeight = 100;
        var gapWidth = 120;
        var pipeWidth = 20;
        var pipeUnits = [];
        var isGamePaused = false;
        var score = 0;
        var gunX, gunY;
        var hasGun = false;

// Start the game
        window.onload = function() {
            canvas = document.getElementById("gameCanvas");
            canvasContext = canvas.getContext('2d');
            setInterval(update, 1000 / 30);

// Controls
            canvas.addEventListener("mousedown", handleMouseClick);

// Generate initial pipes
            generatePipes();
        };

// Generate pipes randomly
        function generatePipes() {
            var pipeGapStart = Math.floor(Math.random() * (canvas.height - gapHeight));
            pipeUnits.push({
                x: canvas.width,
                y: 0,
                height: pipeGapStart
            });
            pipeUnits.push({
                x: canvas.width,
                y: pipeGapStart + gapHeight,
                height: canvas.height - pipeGapStart - gapHeight
            });
        }

// Update the game state
        function update() {
            moveBird();
            movePipes();
            drawGame();

// Check collision with pipes
            if (isGamePaused) return;
            if (checkCollision()) {
                gameOver();
                return;
            }

// Increment score
            if (pipeUnits.length > 1 && birdX > pipeUnits[0].x + pipeWidth) {
                score++;
                pipeUnits.splice(0, 2);
            }

// Generate new pipes
            if (pipeUnits.length < 6 && pipeUnits[pipeUnits.length - 2].x < canvas.width - gapWidth) {
                generatePipes();
            }
        }

// Handle bird movement
        function moveBird() {
            birdSpeedY += gravity;
            birdY += birdSpeedY;
        }

// Jump the bird
        function jumpBird() {
            birdSpeedY = -jumpHeight;
        }

// Move pipes to the left
        function movePipes() {
            for (var i = 0; i < pipeUnits.length; i++) {
                pipeUnits[i].x -= 2;
            }
        }

// Handle mouse click event
        function handleMouseClick() {
            if (isGamePaused) {
                resetGame();
                return;
            }
            jumpBird();
        }

// Draw game objects
        function drawGame() {
            // Clear canvas
            canvasContext.clearRect(0, 0, canvas.width, canvas.height);

// Draw bird
            drawBird();

// Draw pipes
            drawPipes();

// Draw score
            canvasContext.fillStyle = "#000";
            canvasContext.fillText("Score: " + score, 10, 20);

// Draw gun if available
            if (hasGun) {
                drawGun();
            }
        }

// Draw the bird
        function drawBird() {
            canvasContext.fillStyle = "#f00";
            canvasContext.fillRect(birdX, birdY, 20, 20);
        }

// Draw the pipes
        function drawPipes() {
            canvasContext.fillStyle = "#0f0";
            for (var i = 0; i < pipeUnits.length; i++) {
                canvasContext.fillRect(pipeUnits[i].x, pipeUnits[i].y, pipeWidth, pipeUnits[i].height);
            }
        }

// Draw the gun
        function drawGun() {
            canvasContext.fillStyle = "#00f";
            canvasContext.fillRect(gunX, gunY, 20, 10);
        }

// Check collision with pipes or gun
        function checkCollision() {
            // Check pipe collision
            for (var i = 0; i < pipeUnits.length; i++) {
                if (
                    birdX + 20 >= pipeUnits[i].x && birdX <= pipeUnits[i].x + pipeWidth &&
                    (birdY <= pipeUnits[i].height || birdY + 20 >= pipeUnits[i].y + pipeUnits[i].height)
                ) {
                    return true;
                }
            }

// Check gun collision
            if (hasGun && birdX + 20 >= gunX && birdY + 20 >= gunY && birdY <= gunY + 10) {
                hasGun = false;
                return false;
            }

return false;
        }

// Game over
        function gameOver() {
            isGamePaused = true;

// Show game over message
            canvasContext.fillStyle = "#000";
            canvasContext.fillText("Game Over!", canvas.width / 2 - 40, canvas.height / 2 - 20);
            canvasContext.fillText("Click to Play Again", canvas.width / 2 - 60, canvas.height / 2 + 10);
        }

// Reset the game
        function resetGame() {
            birdX = 50;
            birdY = 150;
            birdSpeedY = 0;
            pipeUnits = [];
            isGamePaused = false;
            score = 0;
            hasGun = false;
            generatePipes();
        }
    </script>
</body>
</html>
```

Note: To keep the code concise and self-contained within a single HTML file, all the JavaScript functionality is included within the `<script>` tags.