AI game creator

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

No:13017

←

Prev Next

→

Pool Bob
Developer User5711｜Date and time 23/8/26 5:41:14
Build time 21.275 sec｜Game capacity 3.299KB｜

Script

Sure! Below is a simple example of a game implemented as a single HTML file, using JavaScript and encased within script tags. The game is designed for smartphone operation and uses pictograms.

This game is a simple touch-based game where the player needs to touch the moving ball to increase their score. The game loop continuously updates the ball's position, checks for collisions with walls, displays the score, and ends the game when a touch event ends. The player's score is shown at the top left corner of the canvas, and when the game ends, the text "Game Over" is displayed.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Sure! Below is a simple example of a game implemented as a single HTML file, using JavaScript and encased within script tags. The game is designed for smartphone operation and uses pictograms.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Pool Bob Game</title>
  <style>
    #canvas {
      border: 1px solid black;
      margin: 0 auto;
      display: block;
    }
  </style>
</head>
<body>
  <canvas id="canvas" width="300" height="400"></canvas>

// Event listeners for touchscreen
    canvas.addEventListener("touchstart", handleTouchStart, false);
    canvas.addEventListener("touchend", handleTouchEnd, false);

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

// Draw ball
      ctx.beginPath();
      ctx.arc(ball.x, ball.y, ball.size, 0, Math.PI * 2);
      ctx.fillStyle = ball.color;
      ctx.fill();
      ctx.closePath();

// Update ball position
      ball.x += ball.dx;
      ball.y += ball.dy;

// Check collision with walls
      if (ball.x + ball.size >= canvas.width || ball.x - ball.size <= 0) {
        ball.dx *= -1; // Reverse direction on x-axis
      }
      if (ball.y + ball.size >= canvas.height || ball.y - ball.size <= 0) {
        ball.dy *= -1; // Reverse direction on y-axis
      }

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

// Game over condition
      if (gameOver) {
        ctx.font = "30px Arial";
        ctx.fillText("Game Over", 80, canvas.height / 2);
        return; // Stop game loop if game over
      }

// Request for next animation frame
      requestAnimationFrame(gameLoop);
    }

// Function to handle touch start event
    function handleTouchStart(event) {
      if (event.touches.length === 1) {
        gameOver = false; // Reset game over status
        ball.color = "blue"; // Reset ball color

// Check if the touch point is within the ball
        var touchX = event.touches[0].clientX;
        var touchY = event.touches[0].clientY;
        if (
          touchX > ball.x - ball.size &&
          touchX < ball.x + ball.size &&
          touchY > ball.y - ball.size &&
          touchY < ball.y + ball.size
        ) {
          score++; // Increase score
          ball.color = "green"; // Change ball color on successful touch
        }
      }
    }

// Function to handle touch end event
    function handleTouchEnd(event) {
      if (event.touches.length === 0) {
        gameOver = true; // Set game over when touch ends
      }
    }

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