I was able to produce a ping pong game that contained two paddles, which can be controlled by two players. Player1 uses the W key and S key to move up and down, while player2 uses UP ARROW and DOWN ARROW to move. The project was successful in terms of display and the movement of the paddles. I was also able to make the ball bounce on the paddles by comparing the front of the paddles to the location of the ball. The ball was also able to bounce on the top and bottom surface of canvas, while it runs through the sides to allow players to earn points. Some of the difficulties I have faced, included the malfunction of the score, which only allowed player1 to earn points. Another issue was that, once the ball passes the bar horizontally, it keeps adding up points instead of resetting to start a new round. Because of coding error, the ball would become almost microscopically small. This would make it hard to see and hit on the paddle. I also planned to use the microbit as a controller for player2, but unfortunately it couldn't be done.
var ballSize = 70;
var posX = 500;
var posY = 500;
//Speed of the ball
var xSpeed;
var ySpeed;
//Score
var lScore = 0;
var rScore = 0;
//Left paddle
var lPX = 50;
var lPY = 250;
//right paddle
var rPX = 950;
var rPY = 250;
//var lP = lPX, lPY;
//var rP = rPX, rPY;
var paddleSpeed = 15;
function setup() {
createCanvas(1000,700);
xSpeed = 10;
ySpeed = 5;
}
function draw() {
background(150);
fill(0);
stroke(255, 0, 0);
//draw the left paddle
rect(lPX, lPY, 21, 200);
stroke(255, 0, 0);
//draw the right paddle
rect(rPX, rPY, 21, 200);
bounceoffWalls();
bounceoffPaddles();
trackScore();
gameOver();
posY += ySpeed;
posX += xSpeed;
//bounceoffPaddleLeft();
ellipse(posX, posY, ballSize, ballSize);
// Controls the left paddle
if (keyIsDown(87)){
lPY -= paddleSpeed;
}
else if (keyIsDown(83)){
lPY += paddleSpeed;
}
//controls the right paddle
if (keyIsDown(UP_ARROW)){
rPY -= paddleSpeed;
}
else if (keyIsDown(DOWN_ARROW)){
rPY += paddleSpeed;
}
//here is showing the score
textSize(50);
var leftScore = 'Score: ' + lScore;
text(leftScore, 50, 50);
stroke(255);
strokeWeight(5);
fill(255, 0, 0);
textSize(50);
var rightScore = 'Score: ' + rScore;
text(rightScore, 650, 50);
stroke(255);
strokeWeight(5);
fill(0, 255, 0);
}
function bounceoffWalls(){
//Bouncing on the sides
posX += xSpeed;
//Bouncing from top and bottom
if ((posY > (700 - ballSize/2)) || (posY < ballSize/2)){
ySpeed = -ySpeed;
}
}
function bounceoffPaddles(){
//check if the paddle is within the height of the paddle
//and if it is close to the horizontal position of the
//front face for the paddle
//this is for boucing off the left paddle
if (((posX - (lPX + 21)) < 5)
&& (posY > lPY)
&& (posY < (lPY + 200))){
xSpeed = - xSpeed;
fill('blue');
}
else if (((rPX - posX) < 5)
//this is for bouncing off the right paddle
&& (posY > rPY)
&& (posY < (rPY + 200))){
xSpeed = - xSpeed;
fill('red');
}
}
// Tracks the Score of each player
function trackScore(){
if ((posY < lPY)
&& (posX < lPX)){
xSpeed = xSpeed;
lScore++;
}
else if ((posY > rPY)
&& (posX > rPX)){
xSpeed = xSpeed;
rScore++;
}
//println(x);
}
function gameOver(){
if (lScore == 5){
textSize (40);
text("Player 1 Wins", 500, 250);
ballSize = 0;
fill(255, 0, 0);
println(x);
}
else if (rScore == 5){
textSize (40)
text("Player 2 Wins", 500, 250);
ballSize = 0;
fill(0, 255, 0);
}
}
function keyIsDown(){
if (keyCode === DOWN_ARROW){
lPY += 10;
}
}