Give me a game that you place cameras that shoots the evil toilets and the evil toilets move to your base's game

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

No:25521

←

Prev Next

→

Give me a game that you place cameras that shoots ..ALL
Developer User12433｜Date and time 23/11/22 12:40:17
Build time 133.161 sec｜Game capacity 3.332KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

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

// Define game variables
      const baseSize = 50;
      const toiletSize = 40;
      const cameraSize = 30;

let baseX = canvas.width / 2 - baseSize / 2;
      let baseY = canvas.height - baseSize;

let toilets = [];
      let cameras = [];

// Function to draw the base, toilets, and cameras
      function draw() {
        // Clear the canvas
        context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the base
        context.fillStyle = "blue";
        context.fillRect(baseX, baseY, baseSize, baseSize);

// Draw the toilets
        context.fillStyle = "brown";
        for (let i = 0; i < toilets.length; i++) {
          context.fillRect(
            toilets[i].x - toiletSize / 2,
            toilets[i].y - toiletSize / 2,
            toiletSize,
            toiletSize
          );
        }

// Draw the cameras
        context.fillStyle = "red";
        for (let i = 0; i < cameras.length; i++) {
          context.fillRect(
            cameras[i].x - cameraSize / 2,
            cameras[i].y - cameraSize / 2,
            cameraSize,
            cameraSize
          );
        }
      }

// Function to update the game state
      function update() {
        // Move the toilets towards the base
        for (let i = 0; i < toilets.length; i++) {
          if (toilets[i].y < baseY) {
            toilets[i].y += 1;
          } else {
            // Game over if a toilet reaches the base
            alert("Game Over!");
            resetGame();
            return;
          }
        }

// Check for collisions between cameras and toilets
        for (let i = 0; i < cameras.length; i++) {
          for (let j = 0; j < toilets.length; j++) {
            if (
              Math.abs(cameras[i].x - toilets[j].x) < toiletSize / 2 &&
              Math.abs(cameras[i].y - toilets[j].y) < toiletSize / 2
            ) {
              // Remove the toilet if hit by a camera
              toilets.splice(j, 1);
            }
          }
        }

// Redraw the game
        draw();

// Call the update function again after a short delay
        setTimeout(update, 10);
      }

// Function to handle mouse clicks
      function handleMouseClick(event) {
        // Calculate the clicked position
        const rect = canvas.getBoundingClientRect();
        const mouseX = event.clientX - rect.left;
        const mouseY = event.clientY - rect.top;

// Add a new camera at the clicked position
        cameras.push({ x: mouseX, y: mouseY });
      }

// Reset the game state
      function resetGame() {
        baseX = canvas.width / 2 - baseSize / 2;
        toilets = [];
        cameras = [];
        draw();
      }

// Start the game
      draw();
      update();

// Register mouse click event listener
      canvas.addEventListener("click", handleMouseClick);
    </script>
  </body>
</html>