AI game creator

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

No:36962

←

Prev Next

→

Flappy bird
Developer User16934｜Date and time 24/1/19 16:28:09
Build time 20.481 sec｜Game capacity 4.651KB｜

Script

Sure, here's an example of a simplified Flappy Bird game implemented as a single HTML file using JavaScript:

To play the game, open the HTML file in a web browser (preferably on a smartphone) and use the space key to control the bird's movement. The goal is to avoid collision with the green pipes while scoring points by passing through the gaps between them. The score is displayed at the top left corner of the game canvas, and the game ends if the bird collides with a pipe or hits the ground. Enjoy playing!

←

Prev　Next

→ 　

Back　

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

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

Sure, here's an example of a simplified Flappy Bird game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Bird</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="600"></canvas>
  
  <script>
    // Game variables
    var canvas = document.getElementById('gameCanvas');
    var ctx = canvas.getContext('2d');
    var bird = {
      x: 100,
      y: canvas.height / 2,
      radius: 20,
      gravity: 0.8,
      velocity: 0
    };
    var pipes = [];
    var score = 0;
    var gameStarted = false;
    var gameOver = false;

// Game functions
    function drawBird() {
      ctx.beginPath();
      ctx.arc(bird.x, bird.y, bird.radius, 0, 2 * Math.PI);
      ctx.fillStyle = 'yellow';
      ctx.fill();
      ctx.closePath();
    }

function drawPipes() {
      ctx.fillStyle = 'green';
      for (var i = 0; i < pipes.length; i++) {
        ctx.fillRect(pipes[i].x, 0, pipes[i].width, pipes[i].topHeight);
        ctx.fillRect(pipes[i].x, pipes[i].bottomY, pipes[i].width, canvas.height - pipes[i].bottomY);
      }
    }

function updateBird() {
      bird.velocity += bird.gravity;
      bird.y += bird.velocity;
    }

function checkCollision(pipe) {
      var topPipe = {
        x: pipe.x,
        y: 0,
        width: pipe.width,
        height: pipe.topHeight
      };
      var bottomPipe = {
        x: pipe.x,
        y: pipe.bottomY,
        width: pipe.width,
        height: canvas.height - pipe.bottomY
      };

if (
        bird.x + bird.radius >= topPipe.x &&
        bird.x - bird.radius <= topPipe.x + topPipe.width &&
        bird.y - bird.radius <= topPipe.y + topPipe.height &&
        bird.y + bird.radius >= topPipe.y
      ) {
        gameOver = true;
      }

if (
        bird.x + bird.radius >= bottomPipe.x &&
        bird.x - bird.radius <= bottomPipe.x + bottomPipe.width &&
        bird.y - bird.radius <= bottomPipe.y + bottomPipe.height &&
        bird.y + bird.radius >= bottomPipe.y
      ) {
        gameOver = true;
      }

if (bird.y + bird.radius >= canvas.height) {
        gameOver = true;
      }
    }

function drawScore() {
      ctx.font = '24px Arial';
      ctx.fillStyle = 'black';
      ctx.fillText('Score: ' + score, 10, 30);
    }

function drawGameOver() {
      ctx.font = '48px Arial';
      ctx.fillStyle = 'red';
      ctx.fillText('Game Over', canvas.width / 2 - 120, canvas.height / 2 - 20);
    }

function gameLoop() {
      if (!gameOver) {
        // Clear canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);

// Update and draw bird
        updateBird();
        drawBird();

if (gameStarted) {
          // Update and draw pipes
          updatePipes();
          drawPipes();
        }

// Draw score
        drawScore();

// Request next frame
        requestAnimationFrame(gameLoop);
      } else {
        drawGameOver();
      }
    }

// Register event listeners
    document.addEventListener('keydown', function (event) {
      if (event.keyCode === 32) {
        // Space key to start the game or make the bird jump
        if (!gameStarted) {
          gameStarted = true;
          spawnPipe();
          requestAnimationFrame(gameLoop);
        }
        bird.velocity = -12;
      }
    });

// Pipe spawning
    function spawnPipe() {
      var pipe = {
        x: canvas.width,
        topHeight: Math.random() * (canvas.height / 2 - 100) + 100,
        bottomY: canvas.height - Math.random() * (canvas.height / 2 - 100) - 100,
        width: 80
      };
      pipes.push(pipe);
      setTimeout(spawnPipe, 2000); // Spawn next pipe after 2 seconds
    }

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