Centipede's game | AI game creator

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

No:27702

104

Centipede
Developer User13763｜Date and time 23/12/8 10:04:12
Build time 30.75 sec｜Game capacity 4.683KB｜

Sure! Here's a simple implementation of the classic game "Centipede" using JavaScript within a single HTML file. This version is designed for smartphone operation and uses pictograms for a better user experience. Please note that this implementation is a simplified version and does not include all the features and complexity of the original game.

To play the game, simply copy the above code into an HTML file and open it in a web browser on your smartphone. You will see a game canvas with the player represented by a rocket emoji, bullets represented by an explosion emoji, and the centipede represented by a bug emoji. Use the left and right arrow keys to move the player, and tap anywhere on the screen to shoot bullets. Your goal is to shoot down the moving centipede, and if the centipede reaches the bottom of the screen, it's game over. Please note that this is a basic implementation of the game and can be further enhanced with additional features, levels, and graphics to make it more enjoyable.

→ 　

0　

0　

　
　

[PR]現在の売れ筋アプリランキング

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

(C)2023 HisashiApp

Sure! Here's a simple implementation of the classic game "Centipede" using JavaScript within a single HTML file. This version is designed for smartphone operation and uses pictograms for a better user experience.

Please note that this implementation is a simplified version and does not include all the features and complexity of the original game.

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    body {
      background-color: black;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
    }

#canvas {
      border: 1px solid white;
    }
  </style>
</head>
<body>
  <canvas id="canvas" width="400" height="500"></canvas>
  <script>
    // Game variables
    let canvas, ctx;
    let player, bullets;
    let centipede, centipedeDirection, centipedeSpeed;
    let gameInterval;

// Pictograms
    const playerImage = "🚀";
    const bulletImage = "💥";
    const centipedeImage = "🐛";

// Game initialization
    function init() {
      canvas = document.getElementById("canvas");
      ctx = canvas.getContext("2d");
      player = {x: 180, y: 450};
      bullets = [];
      centipede = [{x: 50, y: 30}];
      centipedeDirection = 1; // 1 for right, -1 for left
      centipedeSpeed = 5; // Speed in pixels per second

document.addEventListener("keydown", movePlayer);
      document.addEventListener("mousedown", shoot);

gameInterval = setInterval(updateGame, 1000 / 60);
    }

// Update game state
    function updateGame() {
      clearCanvas();
      moveCentipede();
      moveBullets();
      drawPlayer();
      drawBullets();
      drawCentipede();

// Check for collision with centipede
      if (checkCollision()) {
        gameOver();
      }
    }

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

// Move player based on arrow key input
    function movePlayer(e) {
      const key = e.keyCode;
      if (key === 37) { // left arrow
        player.x -= 10;
      } else if (key === 39) { // right arrow
        player.x += 10;
      }
    }

// Shoot bullets on tap
    function shoot(e) {
      bullets.push({x: player.x + 15, y: player.y});
    }

// Move the centipede
    function moveCentipede() {
      const head = centipede[0];
      if (head.x > canvas.width - 30 || head.x < 0) {
        centipedeDirection *= -1;
        head.y += 20;
      }
      head.x += centipedeDirection * centipedeSpeed;
    }

// Move bullets
    function moveBullets() {
      for (let i = 0; i < bullets.length; i++) {
        bullets[i].y -= 10;
        if (bullets[i].y < 0) {
          bullets.splice(i, 1);
        }
      }
    }

// Draw the player
    function drawPlayer() {
      ctx.font = "30px Arial";
      ctx.fillStyle = "white";
      ctx.fillText(playerImage, player.x, player.y);
    }

// Draw bullets
    function drawBullets() {
      ctx.font = "30px Arial";
      ctx.fillStyle = "red";
      bullets.forEach(bullet => {
        ctx.fillText(bulletImage, bullet.x, bullet.y);
      });
    }

// Draw the centipede
    function drawCentipede() {
      ctx.font = "30px Arial";
      ctx.fillStyle = "green";
      centipede.forEach(segment => {
        ctx.fillText(centipedeImage, segment.x, segment.y);
      });
    }

// Check collision between bullets and centipede
    function checkCollision() {
      for (let i = 0; i < bullets.length; i++) {
        for (let j = 0; j < centipede.length; j++) {
          if (
            bullets[i].x >= centipede[j].x &&
            bullets[i].x <= centipede[j].x + 20 &&
            bullets[i].y <= centipede[j].y + 30
          ) {
            bullets.splice(i, 1);
            centipede.splice(j, 1);
            return true;
          }
        }
      }
      return false;
    }

// Game over handler
    function gameOver() {
      clearInterval(gameInterval);
      alert("Game Over!");
    }

init();
  </script>
</body>
</html>
```

To play the game, simply copy the above code into an HTML file and open it in a web browser on your smartphone. You will see a game canvas with the player represented by a rocket emoji, bullets represented by an explosion emoji, and the centipede represented by a bug emoji. Use the left and right arrow keys to move the player, and tap anywhere on the screen to shoot bullets. Your goal is to shoot down the moving centipede, and if the centipede reaches the bottom of the screen, it's game over.

Please note that this is a basic implementation of the game and can be further enhanced with additional features, levels, and graphics to make it more enjoyable.