AI game creator

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

No:37125

←

Prev Next

→

BFDI Game
Developer User10753｜Date and time 24/1/20 11:03:54
Build time 9.547 sec｜Game capacity 2.854KB｜

Script

Sure! Here's an example of a simple game implemented as a single HTML file using JavaScript, based on the "Battle for Dream Island" (BFDI) TV show. The game uses pictograms to represent the characters.

This game uses a canvas element to display the game graphics and uses touch events to control the character. The goal is to collect as many coins as possible by moving the character (BFDI) towards the coins (represented by the coin pictogram). The score is displayed on the screen. Every time the character collides with a coin, the score is incremented and the coin's position is reset randomly. The game loop continuously updates and redraws the game elements.

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>BFDI Game</title>
</head>
<body>
  <canvas id="gameCanvas" width="320" height="480"></canvas>
  <script>
    // Get the canvas element
    var canvas = document.getElementById("gameCanvas");
    var context = canvas.getContext("2d");

// Character pictograms
    var characters = {
      bfdi: "😀", // Pictogram for BFDI character
      leafy: "🍃", // Pictogram for Leafy character
      campfire: "🔥" // Pictogram for campfire
    };

// Game state
    var score = 0;
    var characterX = 150; // Initial position of the character
    var characterY = 430;
    var coinX = 150; // Initial position of the coin
    var coinY = 50;

// Game loop
    function gameLoop() {
      update();
      draw();
      requestAnimationFrame(gameLoop);
    }

// Update game state
    function update() {
      // Move the character based on user input (touch events)
      canvas.addEventListener("touchstart", function(event) {
        var touchX = event.touches[0].clientX;
        if (touchX < canvas.width / 2) {
          characterX -= 20;
        } else {
          characterX += 20;
        }
      });

// Check for collision between character and coin
      if (characterX - coinX > -60 && characterX - coinX < 60 && characterY - coinY > -60 && characterY - coinY < 60) {
        score++;
        resetCoin();
      }
    }

// Draw game elements
    function draw() {
      context.clearRect(0, 0, canvas.width, canvas.height);

// Draw character
      context.font = "48px serif";
      context.fillText(characters.bfdi, characterX, characterY);

// Draw coin
      context.font = "48px serif";
      context.fillText(characters.campfire, campfireX, campfireY);

// Draw score
      context.font = "24px serif";
      context.fillText("Score: " + score, 10, 30);
    }

// Reset coin position
    function resetCoin() {
      coinX = Math.random() * (canvas.width - 60);
      coinY = Math.random() * (canvas.height - 60);
    }

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