Auto Atari Pong with a 3 balls and 3 paddles for all devices's game

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

No:17028

114

←

Prev Next

→

Auto Atari Pong with a 3 balls and 3 paddles for a..ALL
Developer User7570｜Date and time 23/9/22 6:40:01
Build time 33.608 sec｜Game capacity 3.795KB｜

Script

Sure! Here's a simplified version of an auto Atari Pong game using JavaScript and pictograms, enclosed in script tags within a single HTML file. It is designed to be played on all devices, including smartphones:

This game will start automatically and uses three balls and three paddles. The goal is to prevent the balls from crossing the screen boundaries by moving the paddles. The score increases every time a ball collides with a paddle. When one of the balls crosses the screen boundaries, the game is over, and the final score is displayed. To play again, simply reload the page.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Auto Atari Pong Game</title>
  <style>
    #pongCanvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="pongCanvas" width="480" height="320"></canvas>
  
  <script>
    // Variables
    var canvas = document.getElementById("pongCanvas");
    var context = canvas.getContext("2d");
    
    var ball = { x: canvas.width/2, y: canvas.height/2, radius: 10, dx: 2, dy: 2 };
    var paddles = [
      { x: 10, y: canvas.height/2 - 30, width: 10, height: 60 },
      { x: canvas.width - 20, y: canvas.height/2 - 30, width: 10, height: 60 },
      { x: canvas.width/2 - 5, y: 10, width: 10, height: 60 }
    ];
    var paddleSpeed = 5;
    var score = 0;
    var gameOver = false;

// Function to draw the paddles
    function drawPaddles() {
      context.fillStyle = "black";
      for (var i = 0; i < paddles.length; i++) {
        context.fillRect(paddles[i].x, paddles[i].y, paddles[i].width, paddles[i].height);
      }
    }

// Function to draw the ball
    function drawBall() {
      context.beginPath();
      context.arc(ball.x, ball.y, ball.radius, 0, Math.PI*2);
      context.fillStyle = "black";
      context.fill();
      context.closePath();
    }

// Function to move the paddles
    function movePaddles() {
      for (var i = 0; i < paddles.length; i++) {
        if (i === 2) {
          if (ball.y < paddles[i].y && paddles[i].y - paddleSpeed >= 0) {
            paddles[i].y -= paddleSpeed;
          } else if (ball.y > paddles[i].y + paddles[i].height && paddles[i].y + paddles[i].height + paddleSpeed <= canvas.height) {
            paddles[i].y += paddleSpeed;
          }
        } else {
          if (ball.y < paddles[i].y + paddles[i].height/2 && paddles[i].y - paddleSpeed >= 0) {
            paddles[i].y -= paddleSpeed;
          } else if (ball.y > paddles[i].y + paddles[i].height/2 && paddles[i].y + paddles[i].height + paddleSpeed <= canvas.height) {
            paddles[i].y += paddleSpeed;
          }
        }
      }
    }

// Function to check collision between ball and paddles
    function checkCollision() {
      for (var i = 0; i < paddles.length; i++) {
        if (ball.x + ball.radius > paddles[i].x && ball.x < paddles[i].x + paddles[i].width &&
            ball.y + ball.radius > paddles[i].y && ball.y < paddles[i].y + paddles[i].height) {
          ball.dx = -ball.dx;
          score++;
          break;
        }
      }
    }

// Function to update the canvas
    function update() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      drawPaddles();
      drawBall();
      movePaddles();
      checkCollision();

ball.x += ball.dx;
      ball.y += ball.dy;

if (ball.x + ball.radius > canvas.width || ball.x - ball.radius < 0) {
        gameOver = true;
      }

if (ball.y + ball.radius > canvas.height || ball.y - ball.radius < 0) {
        ball.dy = -ball.dy;
      }

if (!gameOver) {
        requestAnimationFrame(update);
      } else {
        alert("Game Over! Score: " + score);
        location.reload(); // Restart the game
      }
    }

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