AI game creator

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

No:52737

285

←

Prev Next

→

Asher,s adventures
Developer User22126｜Date and time 24/3/24 10:45:07
Build time 0.954 sec｜Game capacity 0.128KB｜

Script

The AI could not be gamified with this prompt. Please try again with different prompts. .
Displays games created by AI in the past at random.

Sure! Here's a simple Table Tennis game implemented as a single HTML file with JavaScript:

To play the game, simply copy and paste the code into a text editor and save it with a .html extension. Then open the file in a web browser. You can move the player's paddle by moving your mouse inside the browser window. The computer-controlled paddle will try to follow the ball's movement. The objective is to hit the ball with your paddle and score points by making the ball go past the computer's paddle. Please note that this is a basic implementation and could be extended to include more features and improvements.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<p style='font-size:14px;background-color:#FF0'>The AI could not be gamified with this prompt. Please try again with different prompts. . <br>Displays games created by AI in the past at random.</p>Sure! Here's a simple Table Tennis game implemented as a single HTML file with JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Table Tennis Game</title>
  <style>
    canvas {
      border: 1px solid black;
      background-color: #f2f2f2;
    }
  </style>
</head>
<body>
  <canvas id="pong" width="800" height="400"></canvas>

// Create the pong paddle
    const paddleHeight = 100;
    const paddleWidth = 20;
    const player = {
      x: 0,
      y: canvas.height / 2 - paddleHeight / 2,
      width: paddleWidth,
      height: paddleHeight,
      color: "#0000FF",
      dy: 10 // Paddle movement speed
    };

const computer = {
      x: canvas.width - paddleWidth,
      y: canvas.height / 2 - paddleHeight / 2,
      width: paddleWidth,
      height: paddleHeight,
      color: "#FF0000",
      dy: 4 // Paddle movement speed
    };

// Create the pong ball
    const ball = {
      x: canvas.width / 2,
      y: canvas.height / 2,
      radius: 10,
      speed: 4,
      dx: 4,
      dy: 4
    };

// Draw the paddle
    function drawPaddle(x, y, width, height, color) {
      context.fillStyle = color;
      context.fillRect(x, y, width, height);
    }

// Draw the ball
    function drawBall(x, y, radius, color) {
      context.fillStyle = color;
      context.beginPath();
      context.arc(x, y, radius, 0, Math.PI * 2, false);
      context.closePath();
      context.fill();
    }

// Draw the game canvas
    function draw() {
      // Clear the canvas
      context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the paddle
      drawPaddle(player.x, player.y, player.width, player.height, player.color);
      drawPaddle(
        computer.x,
        computer.y,
        computer.width,
        computer.height,
        computer.color
      );

// Draw the ball
      drawBall(ball.x, ball.y, ball.radius, ball.color);

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

// Ensure the ball stays within the canvas
      if (ball.y + ball.radius > canvas.height || ball.y - ball.radius < 0) {
        ball.dy *= -1;
      }

// Handle paddle collisions
      if (
        ball.x + ball.radius > computer.x &&
        ball.y >= computer.y &&
        ball.y <= computer.y + computer.height
      ) {
        ball.dx *= -1;
      }

if (
        ball.x - ball.radius < player.x + player.width &&
        ball.y >= player.y &&
        ball.y <= player.y + player.height
      ) {
        ball.dx *= -1;
      }

// Move player paddle
      function movePaddle(event) {
        let rect = canvas.getBoundingClientRect();
        player.y = event.clientY - rect.top - player.height / 2;
      }

canvas.addEventListener("mousemove", movePaddle);

// Move computer paddle
      function computerMovement() {
        const computerCenter = computer.y + computer.height / 2;
        if (computerCenter < ball.y) {
          computer.y += computer.dy;
        } else {
          computer.y -= computer.dy;
        }
      }

computerMovement();
    }

// Update the canvas every frame
    function gameLoop() {
      draw();
      requestAnimationFrame(gameLoop);
    }

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

Please note that this is a basic implementation and could be extended to include more features and improvements.