File size: 4,076 Bytes
a3b97ad a4b6ccc a3b97ad 5994a14 a4b6ccc a3b97ad 5994a14 fc7647d 5994a14 a4b6ccc 5994a14 a3b97ad a4b6ccc a3b97ad a4b6ccc 5994a14 a4b6ccc a3b97ad a4b6ccc a3b97ad fc7647d 5994a14 a3b97ad a4b6ccc a3b97ad 5994a14 a3b97ad |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 |
const gameArea = document.getElementById('gameArea');
const paddleLeft = document.getElementById('paddleLeft');
const paddleRight = document.getElementById('paddleRight');
const ball = document.getElementById('ball');
const playerScoreDisplay = document.getElementById('playerScore');
const botScoreDisplay = document.getElementById('botScore');
let paddleLeftY = window.innerHeight / 2 - 40; // Center the paddle
let paddleRightY = window.innerHeight / 2 - 40; // Center the paddle
let ballX = window.innerWidth / 2; // Center the ball
let ballY = window.innerHeight / 2; // Center the ball
let ballSpeedX = 3; // Horizontal speed
let ballSpeedY = 3; // Vertical speed
let playerScore = 0;
let botScore = 0;
let isGamePaused = true; // Pause the game until the player moves
const paddleHeight = 80;
const paddleWidth = 10;
const ballSize = 15;
// Touch controls
let touchY = 0;
gameArea.addEventListener('touchmove', (e) => {
e.preventDefault();
touchY = e.touches[0].clientY;
// Move left paddle based on touch position
if (e.touches[0].clientX < window.innerWidth / 2) {
paddleLeftY = touchY - paddleHeight / 2;
if (paddleLeftY < 0) paddleLeftY = 0;
if (paddleLeftY > window.innerHeight - paddleHeight) paddleLeftY = window.innerHeight - paddleHeight;
// Start the game if it's paused
if (isGamePaused) {
isGamePaused = false;
}
}
});
function update() {
if (!isGamePaused) {
// Update ball position
ballX += ballSpeedX;
ballY += ballSpeedY;
// Ball collision with top and bottom walls
if (ballY <= 0 || ballY >= window.innerHeight - ballSize) {
ballSpeedY = -ballSpeedY;
}
// Ball collision with left paddle
if (
ballX <= paddleWidth + 10 && // Left paddle
ballY + ballSize >= paddleLeftY &&
ballY <= paddleLeftY + paddleHeight
) {
ballSpeedX = -ballSpeedX;
}
// Ball collision with right paddle
if (
ballX >= window.innerWidth - paddleWidth - 25 && // Right paddle
ballY + ballSize >= paddleRightY &&
ballY <= paddleRightY + paddleHeight
) {
ballSpeedX = -ballSpeedX;
}
// Ball out of bounds (left or right)
if (ballX <= 0) {
botScore++;
botScoreDisplay.textContent = botScore;
resetBall('right');
} else if (ballX >= window.innerWidth) {
playerScore++;
playerScoreDisplay.textContent = playerScore;
resetBall('left');
}
}
// Bot logic for right paddle
if (ballSpeedX > 0) { // Ball is moving towards the right paddle
if (paddleRightY + paddleHeight / 2 < ballY) {
paddleRightY += 3; // Move paddle down
} else if (paddleRightY + paddleHeight / 2 > ballY) {
paddleRightY -= 3; // Move paddle up
}
}
// Ensure the right paddle stays within bounds
if (paddleRightY < 0) paddleRightY = 0;
if (paddleRightY > window.innerHeight - paddleHeight) paddleRightY = window.innerHeight - paddleHeight;
// Update ball and paddle positions
ball.style.left = ballX + 'px';
ball.style.top = ballY + 'px';
paddleLeft.style.top = paddleLeftY + 'px';
paddleRight.style.top = paddleRightY + 'px';
requestAnimationFrame(update);
}
function resetBall(side) {
isGamePaused = true; // Pause the game
if (side === 'left') {
ballX = paddleWidth + 10; // Place ball on the left paddle
ballY = paddleLeftY + paddleHeight / 2;
ballSpeedX = Math.abs(ballSpeedX); // Move ball to the right
} else if (side === 'right') {
ballX = window.innerWidth - paddleWidth - 25; // Place ball on the right paddle
ballY = paddleRightY + paddleHeight / 2;
ballSpeedX = -Math.abs(ballSpeedX); // Move ball to the left
}
ballSpeedY = (Math.random() - 0.5) * 6; // Randomize vertical speed
}
// Start the game loop
update(); |