AI game creator

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

No:15126

109

←

Prev Next

→

Shooting Game
Developer User6529｜Date and time 23/9/6 10:27:18
Build time 42.964 sec｜Game capacity 4.168KB｜

Script

Sure, here's an example of a simple shooting game implemented in a single HTML file using JavaScript. Please note that this is just a basic example and you can enhance it further based on your requirements.

This game creates a canvas element on which you can control a player's ship using touch controls on your smartphone. The ship can fire bullets by tapping on the canvas, and it needs to shoot down the enemies that appear from the top of the screen. Each successful hit increases the player's score.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Shooting Game</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Event listeners for touch controls
    canvas.addEventListener("touchstart", fireBullet, false);
    canvas.addEventListener("touchmove", moveShip, false);

// Function to draw player's ship
    function drawShip() {
      ctx.fillStyle = "blue";
      ctx.fillRect(ship.x, ship.y, ship.width, ship.height);
    }

// Function to draw bullets
    function drawBullets() {
      ctx.fillStyle = "red";
      for (var i = 0; i < bullets.length; i++) {
        ctx.fillRect(bullets[i].x, bullets[i].y, bullets[i].width, bullets[i].height);
      }
    }

// Function to draw enemies
    function drawEnemies() {
      ctx.fillStyle = "green";
      for (var i = 0; i < enemies.length; i++) {
        ctx.fillRect(enemies[i].x, enemies[i].y, enemies[i].width, enemies[i].height);
      }
    }

// Function to move player's ship
    function moveShip(event) {
      var touchX = event.touches[0].clientX;
      var touchY = event.touches[0].clientY;
      ship.x = touchX - ship.width / 2;
      ship.y = touchY - ship.height / 2;
    }

// Function to fire bullets
    function fireBullet() {
      bullets.push({ x: ship.x + ship.width / 2, y: ship.y, width: 2, height: 10 });
    }

// Function to generate enemies
    function generateEnemies() {
      var enemy = { x: Math.random() * 360, y: 0, width: 20, height: 20 };
      enemies.push(enemy);
    }

// Function to check for collision between bullets and enemies
    function checkCollision() {
      for (var i = 0; i < bullets.length; i++) {
        for (var j = 0; j < enemies.length; j++) {
          if (
            bullets[i].x < enemies[j].x + enemies[j].width &&
            bullets[i].x + bullets[i].width > enemies[j].x &&
            bullets[i].y < enemies[j].y + enemies[j].height &&
            bullets[i].y + bullets[i].height > enemies[j].y
          ) {
            // Collision detected
            bullets.splice(i, 1);
            enemies.splice(j, 1);
            score++;
          }
        }
      }
    }

// Function to update game state and redraw canvas
    function updateGame() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawShip();
      drawBullets();
      drawEnemies();
      checkCollision();
      moveBullets();
      moveEnemies();

requestAnimationFrame(updateGame);
    }

// Function to move bullets
    function moveBullets() {
      for (var i = 0; i < bullets.length; i++) {
        if (bullets[i].y > 0) {
          bullets[i].y -= 10; // Bullet speed
        } else {
          bullets.splice(i, 1); // Remove out-of-bounds bullets
        }
      }
    }

// Function to move enemies
    function moveEnemies() {
      for (var i = 0; i < enemies.length; i++) {
        if (enemies[i].y < canvas.height) {
          enemies[i].y += 5; // Enemy speed
        } else {
          enemies.splice(i, 1); // Remove out-of-bounds enemies
        }
      }

// Generate new enemy at a certain interval
      if (Math.random() < 0.02) {
        generateEnemies();
      }
    }

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