Your mom versus rat game's game

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

No:21948

←

Prev Next

→

Your mom versus rat game
Developer User8074｜Date and time 23/10/19 11:34:15
Build time 51.444 sec｜Game capacity 2.7KB｜

Script

In this game, your goal is to touch the rat as many times as possible within the given canvas area using touch events on a smartphone. The player will control the mom pictogram, represented by the file "emozi_all/game.png", and each time the rat pictogram, represented by the file "emozi_all/time.png", is touched, the score will increase by 1. The rat will move randomly across the canvas. The current score will be displayed on the top left corner of the canvas. You can replace "emozi_chicken.png" and "emozi_all/rat.png" with your own pictograms as per your requirement. Remember to update the image source accordingly.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Your Mom vs Rat Game</title>
  </head>
  <body>
    <canvas id="gameCanvas" width="300" height="300"></canvas>
    <script>
      // Game variables
      var canvas = document.getElementById("gameCanvas");
      var ctx = canvas.getContext("2d");
      var momImage = new Image();
      var ratImage = new Image();
      var momX = 100;
      var momY = 100;
      var ratX = 200;
      var ratY = 200;
      var score = 0;

// Load game images
      momImage.src = "mom.png";
      ratImage.src = "rat.png";

// Handle touch events
      canvas.addEventListener("touchstart", handleTouchStart, { passive: false });

// Update game position based on touch event
      function handleTouchStart(event) {
        var touchX = event.touches[0].clientX - canvas.offsetLeft;
        var touchY = event.touches[0].clientY - canvas.offsetTop;
        
        // Increase score if touch event occurs on rat
        if (
          touchX > ratX &&
          touchX < ratX + ratImage.width &&
          touchY > ratY &&
          touchY < ratY + ratImage.height
        ) {
          score++;
        }
      }

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

// Draw mom
        ctx.drawImage(momImage, momX, momY);

// Draw rat
        ctx.drawImage(ratImage, ratX, ratY);

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

// Move the rat randomly
        ratX += getRandomMovement();
        ratY += getRandomMovement();

// Request next frame
        requestAnimationFrame(drawGame);
      }

// Generate random movement for the rat
      function getRandomMovement() {
        return Math.floor(Math.random() * 10) - 5; // Random movement between -5 and 5
      }

// Start the game
      momImage.onload = function() {
        ratImage.onload = function() {
          drawGame();
        };
      };
    </script>
  </body>
</html>
```

In this game, your goal is to touch the rat as many times as possible within the given canvas area using touch events on a smartphone. The player will control the mom pictogram, represented by the file "mom.png", and each time the rat pictogram, represented by the file "rat.png", is touched, the score will increase by 1. The rat will move randomly across the canvas. The current score will be displayed on the top left corner of the canvas.

You can replace "mom.png" and "rat.png" with your own pictograms as per your requirement. Remember to update the image source accordingly.