Shoot the guards and don’t let the guards k○ll you's game

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

No:33115

←

Prev Next

→

Shoot the guards and don’t let the guards k○ll you
Developer User15656｜Date and time 24/1/2 17:17:47
Build time 39.476 sec｜Game capacity 4.114KB｜

Script

Sure! Here's a simple game implementation that meets your requirements. Please note that due to limitations in the text-based format, I won't be able to provide actual pictograms, but you can replace the placeholders with appropriate images/icons in the HTML code.

To play the game: 1. Copy the code into a new HTML file (e.g., `guard-shooter.html`). 2. Open the HTML file in a web browser, preferably on a smartphone or using smartphone emulation mode in the browser's developer tools. 3. You can control the player using the left and right arrow keys to move and the spacebar to fire bullets. The objective is to shoot the guard (green rectangle) before it reaches your position. If the guard reaches your position, the game will be over. Note: This is a basic implementation to demonstrate the gameplay mechanics. You can further enhance the game by adding scoring, multiple levels, sound effects, etc., based on your requirements.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Guard Shooter</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Player position and size
    const player = {
      x: 200,
      y: 350,
      width: 40,
      height: 40
    };

// Bullet properties
    const bullet = {
      x: undefined,
      y: undefined,
      radius: 5,
      speed: 5,
      isFired: false
    };

// Guard properties
    const guard = {
      x: 180,
      y: 40,
      width: 40,
      height: 40,
      speed: 2
    };

// Handle player movement
    document.addEventListener("keydown", handlePlayerMove);

// Handle bullet firing
    function fireBullet() {
      bullet.isFired = true;
      bullet.x = player.x + player.width / 2;
      bullet.y = player.y - bullet.radius;
    }

// Handle game logic update
    function update() {
      if (bullet.isFired) {
        bullet.y -= bullet.speed;
        
        if (bullet.y - bullet.radius < 0) {
          bullet.isFired = false;
        }
      }

if (guard.x + guard.width >= canvas.width || guard.x <= 0) {
        guard.speed *= -1;
      }

guard.x += guard.speed;

if (checkCollision()) {
        gameOver();
      }

requestAnimationFrame(update);
    }

// Check for bullet-guard collision
    function checkCollision() {
      if (
        bullet.isFired &&
        bullet.x + bullet.radius > guard.x &&
        bullet.x - bullet.radius < guard.x + guard.width &&
        bullet.y - bullet.radius < guard.y + guard.height
      ) {
        bullet.isFired = false;
        return true;
      }
      return false;
    }

// Game over handle
    function gameOver() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      ctx.font = "40px Arial";
      ctx.fillStyle = "red";
      ctx.fillText("Game Over!", canvas.width / 2 - 100, canvas.height / 2);
      bullet.isFired = false;
      guard.x = 180;
    }

// Game loop
    function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

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

// Draw bullet
      if (bullet.isFired) {
        ctx.beginPath();
        ctx.arc(bullet.x, bullet.y, bullet.radius, 0, Math.PI * 2);
        ctx.fillStyle = "red";
        ctx.fill();
      }

// Draw guard
      ctx.fillStyle = "green";
      ctx.fillRect(guard.x, guard.y, guard.width, guard.height);

requestAnimationFrame(draw);
    }

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

To play the game:
1. Copy the code into a new HTML file (e.g., `guard-shooter.html`).
2. Open the HTML file in a web browser, preferably on a smartphone or using smartphone emulation mode in the browser's developer tools.
3. You can control the player using the left and right arrow keys to move and the spacebar to fire bullets. The objective is to shoot the guard (green rectangle) before it reaches your position. If the guard reaches your position, the game will be over.

Note: This is a basic implementation to demonstrate the gameplay mechanics. You can further enhance the game by adding scoring, multiple levels, sound effects, etc., based on your requirements.