AI game creator

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

No:23095

←

Prev Next

→

particle
Developer User10656｜Date and time 23/10/27 20:26:32
Build time 102.742 sec｜Game capacity 3.231KB｜

Script

Sure! Here's an example of a simple game implemented as a single HTML file using JavaScript:

This game creates particles with random colors on the screen, and the objective is to tap on the particles to increase the score. The particles will move randomly around the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure! Here's an example of a simple game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Pictogram Game</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
    }
    #gameCanvas {
      width: 100%;
      height: 100vh;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// Initialize the game
    function init() {
      canvas = document.getElementById("gameCanvas");
      context = canvas.getContext("2d");
      canvas.width = window.innerWidth;
      canvas.height = window.innerHeight;

// Start the game loop
      setInterval(gameLoop, 1000 / 60);

// Register touch event listener
      canvas.addEventListener("touchstart", onTouchStart);
    }

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

// Update particles
      particles.forEach(function(particle) {
        particle.update();
        particle.draw();
      });

// Display score
      context.font = "20px Arial";
      context.fillStyle = "#000000";
      context.fillText("Score: " + score, 10, 30);
    }

// Handle touchstart event
    function onTouchStart(event) {
      var touch = event.touches[0];
      var x = touch.clientX;
      var y = touch.clientY;

// Check if touch intersects with a particle
      particles.forEach(function(particle) {
        if (x >= particle.x && x <= particle.x + particle.size &&
            y >= particle.y && y <= particle.y + particle.size) {
          // Increase score and remove particle
          score++;
          particles.splice(particles.indexOf(particle), 1);
        }
      });
    }

// Particle class
    function Particle() {
      this.size = 50;
      this.x = Math.random() * (canvas.width - this.size);
      this.y = Math.random() * (canvas.height - this.size);
      this.color = getRandomColor();

this.update = function () {
        // Update particle position
        this.x += Math.random() * 2 - 1;
        this.y += Math.random() * 2 - 1;

// Wrap particle around the screen
        if (this.x < 0) this.x = canvas.width;
        if (this.y < 0) this.y = canvas.height;
        if (this.x > canvas.width) this.x = 0;
        if (this.y > canvas.height) this.y = 0;
      };

this.draw = function () {
        // Draw particle on canvas
        context.fillStyle = this.color;
        context.fillRect(this.x, this.y, this.size, this.size);
      };
    }

// Helper function to generate a random color
    function getRandomColor() {
      var letters = "0123456789ABCDEF";
      var color = "#";
      for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
      }
      return color;
    }

// Initialize the game when the page has finished loading
    window.onload = init;
  </script>
</body>
</html>
```

This game creates particles with random colors on the screen, and the objective is to tap on the particles to increase the score. The particles will move randomly around the screen.