Auto shoot space invaders idle's game

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

No:47435

112

←

Prev Next

→

Auto shoot space invaders idle
Developer User18896｜Date and time 24/2/28 3:15:04
Build time 14.862 sec｜Game capacity 2.635KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

<html>
  <head>
    <title>Space Invaders Idle Game</title>
  </head>
  <body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    
    <script>
      const canvas = document.getElementById("gameCanvas");
      const ctx = canvas.getContext("2d");
      
      let playerX = canvas.width / 2;
      const playerY = canvas.height - 50;
      const playerWidth = 30;
      const playerHeight = 30;
      const playerColor = "#00FF00";
      
      const enemyWidth = 30;
      const enemyHeight = 30;
      const enemyColor = "#FF0000";
      let enemies = [];
      const numEnemies = 5;
      
      let score = 0;
      
      function drawPlayer() {
        ctx.fillStyle = playerColor;
        ctx.fillRect(playerX - playerWidth / 2, playerY - playerHeight / 2, playerWidth, playerHeight);
      }
      
      function drawEnemies() {
        enemies.forEach((enemy) => {
          ctx.fillStyle = enemyColor;
          ctx.fillRect(enemy.x - enemyWidth / 2, enemy.y - enemyHeight / 2, enemyWidth, enemyHeight);
        });
      }
      
      function createEnemies() {
        for (let i = 0; i < numEnemies; i++) {
          let x = Math.random() * canvas.width;
          let y = Math.random() * canvas.height / 2;
          enemies.push({ x, y });
        }
      }
      
      function updateEnemies() {
        enemies.forEach((enemy) => {
          enemy.y += 1;
          
          if (enemy.y > canvas.height) {
            enemy.y = 0;
            enemy.x = Math.random() * canvas.width;
          }
          
          if (enemy.y + enemyHeight > playerY - playerHeight && enemy.x + enemyWidth > playerX - playerWidth && enemy.x - enemyWidth < playerX + playerWidth) {
            score++;
            enemy.y = 0;
            enemy.x = Math.random() * canvas.width;
          }
        });
      }
      
      function drawText() {
        ctx.font = "20px Arial";
        ctx.fillStyle = "#000000";
        ctx.fillText("Score: " + score, 10, 30);
      }
      
      function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        drawPlayer();
        drawEnemies();
        drawText();
        
        updateEnemies();
      }
      
      createEnemies();
      setInterval(draw, 10);
      
      canvas.addEventListener("mousemove", (event) => {
        playerX = event.clientX - canvas.offsetLeft;
        
        if (playerX - playerWidth / 2 < 0) {
          playerX = playerWidth / 2;
        } else if (playerX + playerWidth / 2 > canvas.width) {
          playerX = canvas.width - playerWidth / 2;
        }
      });
    </script>
  </body>
</html>
```