AI game creator

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

No:15687

121

←

Prev Next

→

Shooting Game
Developer User6823｜Date and time 23/9/10 20:26:59
Build time 39.809 sec｜Game capacity 4.926KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<html>
  <head>
    <title>Shooting Game</title>
    <style>
      canvas {
        border: 1px solid black;
        display: block;
        margin: 0 auto;
      }
    </style>
  </head>

<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
      // Game variables
      var canvas, ctx, player, bullets, enemies, score;
      var gameWidth = 400;
      var gameHeight = 400;

function init() {
        // Get canvas element and context
        canvas = document.getElementById("gameCanvas");
        ctx = canvas.getContext("2d");

// Create the player
        player = {
          x: gameWidth / 2,
          y: gameHeight - 50,
          width: 40,
          height: 40,
          color: "blue",
          fireRate: 250, // Time between bullet firing in milliseconds
          lastFired: 0,
        };

// Create arrays for bullets and enemies
        bullets = [];
        enemies = [];

// Initialize score
        score = 0;

// Bind touch events for mobile devices
        canvas.addEventListener("touchstart", handleTouchStart, false);
        canvas.addEventListener("touchmove", handleTouchMove, false);

// Start game loop
        gameLoop();
      }

function gameLoop() {
        update();
        draw();

// Run game loop recursively
        requestAnimationFrame(gameLoop);
      }

function update() {
        // Update player position based on touch input
        if (player.touchX) {
          player.x = player.touchX - player.width / 2;
        }

// Cooldown between bullet firing
        var now = Date.now();
        var delta = now - player.lastFired;
        if (delta > player.fireRate) {
          player.lastFired = now;
          // Fire a bullet
          bullets.push({
            x: player.x + player.width / 2,
            y: player.y,
            width: 5,
            height: 10,
            color: "red",
            speed: 5,
          });
        }

// Update bullet positions
        bullets.forEach(function (bullet, index) {
          bullet.y -= bullet.speed;

// Remove bullets that are out of bound
          if (bullet.y < 0) {
            bullets.splice(index, 1);
          }

// Check for bullet-enemy collision
          enemies.forEach(function (enemy, enemyIndex) {
            if (
              bullet.x < enemy.x + enemy.width &&
              bullet.x + bullet.width > enemy.x &&
              bullet.y < enemy.y + enemy.height &&
              bullet.y + bullet.height > enemy.y
            ) {
              // Bullet hit an enemy
              bullets.splice(index, 1);
              enemies.splice(enemyIndex, 1);
              score++;
            }
          });
        });

// Update enemy positions
        enemies.forEach(function (enemy, index) {
          enemy.y += enemy.speed;

// Check for player-enemy collision
          if (
            player.x < enemy.x + enemy.width &&
            player.x + player.width > enemy.x &&
            player.y < enemy.y + enemy.height &&
            player.y + player.height > enemy.y
          ) {
            // Game over
            alert("Game Over! Your score is: " + score);
            init();
          }

// Remove enemies that are out of bound
          if (enemy.y > gameHeight) {
            enemies.splice(index, 1);
          }
        });

// Add new enemy every 1000ms
        if (Math.random() < 0.02) {
          enemies.push({
            x: Math.random() * (gameWidth - 20),
            y: 0,
            width: 20,
            height: 20,
            color: "green",
            speed: Math.random() * 2 + 1,
          });
        }
      }

function draw() {
        // Clear canvas
        ctx.clearRect(0, 0, gameWidth, gameHeight);

// Draw player
        ctx.fillStyle = player.color;
        ctx.fillRect(player.x, player.y, player.width, player.height);

// Draw bullets
        bullets.forEach(function (bullet) {
          ctx.fillStyle = bullet.color;
          ctx.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
        });

// Draw enemies
        enemies.forEach(function (enemy) {
          ctx.fillStyle = enemy.color;
          ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
        });

// Draw score
        ctx.font = "20px Arial";
        ctx.fillStyle = "black";
        ctx.fillText("Score: " + score, 10, 30);
      }

function handleTouchStart(event) {
        // Store touch position in player.touchX
        var touch = event.touches[0];
        player.touchX = touch.clientX;
      }

function handleTouchMove(event) {
        // Update touch position in player.touchX
        var touch = event.touches[0];
        player.touchX = touch.clientX;
      }

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