AI game creator

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

No:25383

3690

←

Prev Next

→

Flappy bird
Developer anonymous｜Date and time 70/1/1 9:54:59
Build time unknown sec｜Game capacity 3.299KB｜

Script

Sure! Here's a simple implementation of the Flappy Bird game using JavaScript within a single HTML file:

To play the game, you can copy the above code into a new HTML file (e.g., `flappy_bird.html`) and open it in your smartphone's browser. Tap the screen to make the bird fly (or use the Space key) and avoid crashing into the green obstacles. Your score will be displayed at the top left corner of the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure! Here's a simple implementation of the Flappy Bird game using JavaScript within a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Bird</title>
  <style>
    canvas {
      border: 1px solid black;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
  <script>
    // Define the game variables
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");
    var bird;
    var obstacles = [];
    var score = 0;

// Bird class
    class Bird {
      constructor() {
        this.x = 50;
        this.y = canvas.height / 2;
        this.gravity = 0.5;
        this.velocity = 0;
      }

show() {
        ctx.fillStyle = "yellow";
        ctx.fillRect(this.x, this.y, 20, 20);
      }

update() {
        this.velocity += this.gravity;
        this.y += this.velocity;

if (this.y >= canvas.height - 20) {
          gameOver();
        }
      }

fly() {
        this.velocity = -10;
      }
    }

// Obstacle class
    class Obstacle {
      constructor() {
        this.x = canvas.width;
        this.width = 30;
        this.topHeight = Math.random() * (canvas.height / 2 - 50) + 50;
        this.bottomHeight = canvas.height - this.topHeight - 150;
        this.speed = 5;
      }

show() {
        ctx.fillStyle = "green";
        ctx.fillRect(this.x, 0, this.width, this.topHeight);
        ctx.fillRect(this.x, canvas.height - this.bottomHeight, this.width, this.bottomHeight);
      }

update() {
        this.x -= this.speed;

if (this.x + this.width < 0) {
          obstacles.shift();
          score++;
        }

if (
          bird.x + 20 >= this.x &&
          bird.x <= this.x + this.width &&
          (bird.y <= this.topHeight || bird.y >= canvas.height - this.bottomHeight)
        ) {
          gameOver();
        }
      }
    }

// Game initialization
    function startGame() {
      bird = new Bird();
      obstacles = [];
      score = 0;

setInterval(() => {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        bird.update();
        bird.show();

if (obstacles.length === 0 || obstacles[obstacles.length - 1].x + 200 < canvas.width) {
          obstacles.push(new Obstacle());
        }

obstacles.forEach(obstacle => {
          obstacle.update();
          obstacle.show();
        });

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

// Game over function
    function gameOver() {
      clearInterval();
      alert("Game Over! Your score: " + score);
      startGame();
    }

// Event listener for key press
    document.addEventListener("keydown", function(event) {
      if (event.code === "Space") {
        bird.fly();
      }
    });

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