AI game creator

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

No:27692

5347

←

Prev Next

→

Make a 🦝 game
Developer anonymous｜Date and time 70/1/1 10:26:19
Build time unknown sec｜Game capacity 5.179KB｜

Script

Sure! Here's a simple game where you can control a raccoon 🦝 using your smartphone's touch controls. The objective is to collect as many fruits 🍎🍌 as possible within a limited time frame.

This game uses HTML canvas to render the graphics and JavaScript to handle the game logic. Racoon and fruit images are displayed using the `drawImage` function. The raccoon is moved by tracking touch events from the smartphone and updating its position accordingly. Collision between the raccoon and fruits is checked using simple geometry calculations. The score and remaining time are displayed on the canvas, and the game ends when the time runs out.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game where you can control a raccoon 🦝 using your smartphone's touch controls. The objective is to collect as many fruits 🍎🍌 as possible within a limited time frame.

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Raccoon Game</title>
    <style>
      html,
      body {
        margin: 0;
        padding: 0;
        overflow: hidden;
      }
      canvas {
        display: block;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas"></canvas>
    <script>
      // Game variables
      var canvas;
      var canvasContext;
      var raccoonImg;
      var fruitImgs = [];
      var raccoonX = 50;
      var raccoonY = 50;
      var fruitX = 500;
      var fruitY = 300;
      var score = 0;
      var timeLeft = 30;

// Initialization
      function startGame() {
        canvas = document.getElementById("gameCanvas");
        canvasContext = canvas.getContext("2d");
        loadImages();
        setInterval(updateGame, 1000 / 30); // 30 FPS
        canvas.addEventListener("touchmove", touchMoved);
      }

// Load images
      function loadImages() {
        raccoonImg = new Image();
        raccoonImg.onload = function () {
          fruitImgs.forEach(function (fruitImg) {
            if (!fruitImg.loaded) return;
            drawImage(fruitImg, fruitX, fruitY);
          });
        };
        raccoonImg.src = "raccoon.png";

["apple.png", "banana.png"].forEach(function (fruitSrc) {
          var fruitImg = new Image();
          fruitImg.src = fruitSrc;
          fruitImg.onload = function () {
            fruitImg.loaded = true;
            fruitImgs.push(fruitImg);

if (raccoonImg.complete) {
              drawImage(raccoonImg, raccoonX, raccoonY);
            }
          };
        });
      }

// Update game state
      function updateGame() {
        clearCanvas();
        moveRaccoon();
        drawImage(raccoonImg, raccoonX, raccoonY);

drawImage(fruitImgs[0], fruitX, fruitY);
        drawImage(fruitImgs[1], fruitX + 100, fruitY);

if (collisionCheck()) {
          score++;
          resetFruits();
        }

displayScore();
        displayTimeLeft();

if (timeLeft <= 0) {
          endGame();
        } else {
          timeLeft--;
        }
      }

// Move raccoon based on touch input
      function touchMoved(event) {
        var touchX = event.touches[0].clientX - 50; // Subtracting half of image width for better positioning
        var touchY = event.touches[0].clientY - 50; // Subtracting half of image height for better positioning
        if (touchX >= 0 && touchY >= 0 && touchX <= canvas.width - 100 && touchY <= canvas.height - 100) {
          raccoonX = touchX;
          raccoonY = touchY;
        }
      }

// Draw image on canvas
      function drawImage(image, x, y) {
        canvasContext.drawImage(image, x, y, 100, 100);
      }

// Clear canvas
      function clearCanvas() {
        canvasContext.clearRect(0, 0, canvas.width, canvas.height);
      }

// Move raccoon
      function moveRaccoon() {
        // Modify raccoon position based on game logic
        // Implement any movement or animation logic here
      }

// Check collision between raccoon and fruits
      function collisionCheck() {
        var raccoonCenterX = raccoonX + 50;
        var raccoonCenterY = raccoonY + 50;
        var fruitCenterX = fruitX + 50;
        var fruitCenterY = fruitY + 50;
        var distance = Math.sqrt(
          Math.pow(fruitCenterX - raccoonCenterX, 2) + Math.pow(fruitCenterY - raccoonCenterY, 2)
        );
        return distance <= 100;
      }

// Reset fruit position after collision
      function resetFruits() {
        fruitX = Math.floor(Math.random() * (canvas.width - 100));
        fruitY = Math.floor(Math.random() * (canvas.height - 100));
      }

// Display score
      function displayScore() {
        canvasContext.font = "24px Arial";
        canvasContext.fillStyle = "black";
        canvasContext.fillText("Score: " + score, 10, 30);
      }

// Display time left
      function displayTimeLeft() {
        canvasContext.font = "24px Arial";
        canvasContext.fillStyle = "black";
        canvasContext.fillText("Time left: " + timeLeft, 10, canvas.height - 10);
      }

// End the game
      function endGame() {
        canvas.removeEventListener("touchmove", touchMoved);
        alert("Game Over! Your score: " + score);
        // Add any additional logic to restart or end the game here
      }

// Start the game when the page loads
      window.onload = function () {
        startGame();
      };
    </script>
  </body>
</html>
```