Auto Atari Pong with lasers And 18 Balls's game

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

No:17078

108

←

Prev Next

→

Auto Atari Pong with lasers And 18 Balls
Developer User7570｜Date and time 23/9/22 8:03:59
Build time 33.737 sec｜Game capacity 4.57KB｜

Script

Sure! Here's a game of auto Atari Pong with lasers and 18 balls implemented as a single HTML file using JavaScript:

This code implements a simple Auto Atari Pong game using JavaScript. The player controls the paddle, and the goal is to hit the ball while avoiding it from going out of bounds. Additionally, the player can shoot a laser from the paddle to hit the ball for extra points. The player's and computer's scores are displayed on the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

Sure! Here's a game of auto Atari Pong with lasers and 18 balls implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Auto Atari Pong with lasers and 18 balls</title>
</head>
<body>
    <canvas id="pongCanvas" width="800" height="400"></canvas>
    <script>
        // Get the canvas element
        const canvas = document.getElementById("pongCanvas");
        const context = canvas.getContext("2d");

// Define the paddle properties
        const paddleWidth = 10;
        const paddleHeight = 100;
        let paddleY = (canvas.height - paddleHeight) / 2;

// Define the ball properties
        const ballRadius = 10;
        let ballX = canvas.width / 2;
        let ballY = canvas.height / 2;
        let ballSpeedX = 3;
        let ballSpeedY = 3;

// Define the laser properties
        const laserHeight = 5;
        let laserX = canvas.width;
        let laserY = paddleY + paddleHeight / 2 - laserHeight / 2;
        let laserSpeed = 6;

// Define the score properties
        let playerScore = 0;
        let computerScore = 0;

// Function to draw the paddle
        function drawPaddle(x, y, width, height) {
            context.fillStyle = "white";
            context.fillRect(x, y, width, height);
        }

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

// Function to draw the laser
        function drawLaser(x, y, height) {
            context.fillStyle = "red";
            context.fillRect(x, y, 10, height);
        }

// Function to update the game state
        function update() {
            // Move the paddle
            if (paddleY + paddleHeight / 2 < ballY) {
                paddleY += 3;
            } else if (paddleY + paddleHeight / 2 > ballY) {
                paddleY -= 3;
            }

// Move the ball
            ballX += ballSpeedX;
            ballY += ballSpeedY;

// Reflect the ball if it hits the top or bottom wall
            if (ballY + ballRadius > canvas.height || ballY - ballRadius < 0) {
                ballSpeedY = -ballSpeedY;
            }

// Reflect the ball if it hits the paddle
            if (
                ballX - ballRadius < paddleWidth &&
                ballY + ballRadius > paddleY &&
                ballY - ballRadius < paddleY + paddleHeight
            ) {
                ballSpeedX = -ballSpeedX;
            }

// Reset the ball and increase computer score if it goes out of bounds
            if (ballX + ballRadius > canvas.width) {
                ballX = canvas.width / 2;
                ballY = canvas.height / 2;
                ballSpeedX = -ballSpeedX;
                computerScore++;
            }

// Move the laser
            laserX -= laserSpeed;

// Reset the laser if it hits the left wall
            if (laserX < 0) {
                laserX = canvas.width;
                laserY = paddleY + paddleHeight / 2 - laserHeight / 2;
            }

// Check if the laser hits the ball
            if (
                laserX < ballX + ballRadius &&
                laserY + laserHeight > ballY - ballRadius &&
                laserY < ballY + ballRadius
            ) {
                ballSpeedX = -ballSpeedX;
                playerScore++;
            }

// Clear the canvas
            context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the paddle, ball, laser, and scores
            drawPaddle(0, paddleY, paddleWidth, paddleHeight);
            drawBall(ballX, ballY, ballRadius);
            drawLaser(laserX, laserY, laserHeight);
            context.fillText(`Player: ${playerScore}`, 10, 20);
            context.fillText(`Computer: ${computerScore}`, canvas.width - 100, 20);

// Call the update function recursively
            requestAnimationFrame(update);
        }

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