AI game creator

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

No:40242

←

Prev Next

→

Flappy bird
Developer User18042｜Date and time 24/2/2 2:11:22
Build time 19.948 sec｜Game capacity 3.524KB｜

Script

Sure! Here's a basic implementation of Flappy Bird as a single HTML file using JavaScript and pictograms:

To play the game, simply copy the above code and save it in a file with a ".html" extension, then open the file in a browser. You can control the game by pressing the Spacebar key on your keyboard to make the bird jump. The objective is to avoid collision with the pipes and get the highest score possible.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

Sure! Here's a basic implementation of Flappy Bird as a single HTML file using JavaScript and pictograms:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Bird</title>
  <style>
    canvas {
      border: 1px solid #000;
    }
  </style>
</head>
<body>
  <canvas id="canvas" width="400" height="600"></canvas>

// Bird properties
    const birdWidth = 50;
    const birdHeight = 50;
    let birdX = canvas.width / 2 - birdWidth / 2;
    let birdY = canvas.height / 2 - birdHeight / 2;
    let birdDY = 0;
    const birdGravity = 0.5;

// Pipe properties
    const pipeWidth = 80;
    const pipeHeight = 300;
    const pipeGap = 200;
    let pipeX = canvas.width;
    let pipeY = generateRandomPipeY();

// Game state
    let gameOver = false;
    let score = 0;

// Event listeners
    document.addEventListener('keydown', jump);

// Generate random Y position for pipe
    function generateRandomPipeY() {
      return Math.floor(Math.random() * (canvas.height - pipeHeight - pipeGap)) + pipeGap;
    }

// Handle jump event
    function jump(e) {
      if (e.keyCode === 32) { // Spacebar key
        birdDY = -8;
      }
    }

// Main game loop
    function gameLoop() {
      if (gameOver) {
        return;
      }

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

// Draw bird
      ctx.fillStyle = '#FFA500';
      ctx.fillRect(birdX, birdY, birdWidth, birdHeight);

// Draw pipes
      ctx.fillStyle = '#008000';
      ctx.fillRect(pipeX, 0, pipeWidth, pipeY);
      ctx.fillRect(pipeX, pipeY + pipeHeight, pipeWidth, canvas.height - pipeY - pipeHeight);

// Update bird position
      birdY += birdDY;
      birdDY += birdGravity;

// Update pipe position
      pipeX -= 3; // Control pipe speed

// Check collision
      if (birdY < 0 || birdY > canvas.height - birdHeight ||
          (pipeX < birdX + birdWidth &&
           pipeX + pipeWidth > birdX &&
           (birdY < pipeY || birdY + birdHeight > pipeY + pipeHeight))) {
        gameOver = true;
        endGame();
        return;
      }

// Score calculation
      if (pipeX + pipeWidth < birdX) {
        score++;
        pipeX = canvas.width;
        pipeY = generateRandomPipeY();
      }

// Draw score
      ctx.font = '32px Arial';
      ctx.fillStyle = '#000';
      ctx.fillText('Score: ' + score, 10, 40);

// Request animation frame
      requestAnimationFrame(gameLoop);
    }

// End the game
    function endGame() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      ctx.font = '48px Arial';
      ctx.fillStyle = '#FF0000';
      ctx.fillText('Game Over', canvas.width / 2 - 120, canvas.height / 2 - 50);

ctx.font = '32px Arial';
      ctx.fillStyle = '#000';
      ctx.fillText('Score: ' + score, canvas.width / 2 - 80, canvas.height / 2);

ctx.font = '24px Arial';
      ctx.fillText('Refresh the page to play again', canvas.width / 2 - 150, canvas.height / 2 + 50);
    }

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