AI game creator

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

No:20985

←

Prev Next

→

Mask gun
Developer User9259｜Date and time 23/10/12 11:11:50
Build time 102.477 sec｜Game capacity 4.167KB｜

Script

Sure! Here's a simple game implemented as a single HTML file using JavaScript, enclosed in script tags. The game is called "Mask Gun" and it can be played on a smartphone. The game involves shooting masks at virus pictograms to eliminate them.

To play the game, simply open the HTML file on a smartphone using a compatible web browser. The player can control the blue rectangle (representing the player character) using the right and left arrow keys. The goal is to stop the red virus pictograms from reaching the player by shooting green rectangle masks at them. Colliding with a virus will end the game, while successfully hitting a virus with a mask eliminates it and spawns a new one.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Mask Gun</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
      // Main game variables
      var canvas = document.getElementById("gameCanvas");
      var ctx = canvas.getContext("2d");

var player = {
        x: canvas.width / 2,
        y: canvas.height - 30,
        width: 30,
        height: 30,
        speed: 5
      };

var virus = {
        x: Math.random() * (canvas.width - 30),
        y: 0,
        width: 30,
        height: 30,
        speed: 2
      };

var mask = {
        x: player.x + player.width / 2 - 5,
        y: player.y - player.height / 2,
        width: 10,
        height: 10,
        speed: 6
      };

// Event listeners to control player movement
      document.addEventListener("keydown", handleKeyDown);
      document.addEventListener("keyup", handleKeyUp);

var rightPressed = false;
      var leftPressed = false;

function handleKeyDown(event) {
        if (event.key === "ArrowRight") {
          rightPressed = true;
        } else if (event.key === "ArrowLeft") {
          leftPressed = true;
        }
      }

function handleKeyUp(event) {
        if (event.key === "ArrowRight") {
          rightPressed = false;
        } else if (event.key === "ArrowLeft") {
          leftPressed = false;
        }
      }

// Function to draw all the game elements
      function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);

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

ctx.fillStyle = "red";
        ctx.fillRect(virus.x, virus.y, virus.width, virus.height);

ctx.fillStyle = "green";
        ctx.fillRect(mask.x, mask.y, mask.width, mask.height);
      }

// Function to update the game state
      function update() {
        if (rightPressed && player.x < canvas.width - player.width) {
          player.x += player.speed;
        } else if (leftPressed && player.x > 0) {
          player.x -= player.speed;
        }

virus.y += virus.speed;

if (mask.y > 0) {
          mask.y -= mask.speed;
        } else {
          mask.x = player.x + player.width / 2 - 5;
          mask.y = player.y - player.height / 2;
        }

// Collision detection
        if (
          virus.y < player.y + player.height &&
          virus.y + virus.height > player.y &&
          virus.x < player.x + player.width &&
          virus.x + virus.width > player.x
        ) {
          // Player loses
          alert("Game Over");
          document.location.reload();
        }

if (
          virus.y < mask.y + mask.height &&
          virus.y + virus.height > mask.y &&
          virus.x < mask.x + mask.width &&
          virus.x + virus.width > mask.x
        ) {
          // Virus eliminated, respawn virus and reset mask position
          virus.y = 0;
          virus.x = Math.random() * (canvas.width - 30);

mask.x = player.x + player.width / 2 - 5;
          mask.y = player.y - player.height / 2;
        }
      }

// Main game loop
      function gameLoop() {
        draw();
        update();
        requestAnimationFrame(gameLoop);
      }

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