AI game creator

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

No:36829

←

Prev Next

→

Flappy bird
Developer User16878｜Date and time 24/1/18 17:03:46
Build time 17.259 sec｜Game capacity 3.581KB｜

Script

Sure, here's a simple implementation of Flappy Bird as a single HTML file using JavaScript and pictograms. Please note that this implementation may not include all the features and complexities of the original game, but it should provide you with a basic playable version.

To play the game, simply open the HTML file on a smartphone device or emulator. Tap the screen to make the bird jump and avoid the pipes. The goal is to pass through as many pipes as possible without colliding.

←

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</title>
  <style>
    canvas {
      border: 1px solid #000;
    }
  </style>
</head>
<body>
  <canvas id="canvas" width="400" height="400"></canvas>

// Variables
    let canvas, ctx;
    let bird;
    let pipes;
    let score;
    let speed;

// Initialize the game
    function init() {
      canvas = document.getElementById("canvas");
      ctx = canvas.getContext("2d");

bird = { x: 50, y: canvas.height / 2, speed: 0, alive: true };
      pipes = [{ x: canvas.width, y: generateRandomYPosition() }];
      score = 0;
      speed = INITIAL_SPEED;

canvas.addEventListener("click", jump);

// Game loop
      setInterval(update, 1000 / 60);
    }

// Game update function
    function update() {
      // Clear the canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Update bird position
      bird.speed += GRAVITY;
      bird.y += bird.speed;

// Draw bird
      ctx.fillRect(bird.x - 10, bird.y - 10, 20, 20);

// Check collision with pipes
      for (let i = 0; i < pipes.length; i++) {
        const pipe = pipes[i];

// Check collision with upper pipe
        if (
          bird.x + 10 > pipe.x &&
          bird.x - 10 < pipe.x + 50 &&
          bird.y - 10 < pipe.y + 320
        ) {
          bird.alive = false;
        }

// Check collision with lower pipe
        if (
          bird.x + 10 > pipe.x &&
          bird.x - 10 < pipe.x + 50 &&
          bird.y + 10 > pipe.y + PIPE_GAP
        ) {
          bird.alive = false;
        }

// Move pipes
        pipe.x -= speed;

// Draw pipes
        ctx.fillRect(pipe.x, 0, 50, pipe.y);
        ctx.fillRect(pipe.x, pipe.y + PIPE_GAP, 50, canvas.height - pipe.y - PIPE_GAP);

// Check if bird passed through the pipe
        if (bird.alive && pipe.x + 50 < bird.x - 10) {
          score++;
          pipes.splice(i, 1);
        }
      }

// Draw score
      ctx.font = "20px Arial";
      ctx.fillText("Score: " + score, 10, 30);

// Check if bird is out of bounds
      if (bird.y < 0 || bird.y + 10 > canvas.height) {
        bird.alive = false;
      }

// Game over
      if (!bird.alive) {
        canvas.removeEventListener("click", jump);
        ctx.font = "40px Arial";
        ctx.fillText("Game Over", canvas.width / 2 - 100, canvas.height / 2);
      }

// Generate new pipe
      if (pipes[pipes.length - 1].x < canvas.width - 300) {
        pipes.push({ x: canvas.width, y: generateRandomYPosition() });
      }

// Adjust game speed
      speed += 0.001;
    }

// Make the bird jump
    function jump() {
      bird.speed = -JUMP_HEIGHT;
    }

// Generate random Y position for the pipes
    function generateRandomYPosition() {
      return Math.floor(Math.random() * (canvas.height - PIPE_GAP));
    }

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