// ball variables
let xBall = 300;
let yBall = 200;
let diameter = 20;
let lightning = diameter / 2;
// ball speed
let speedXBall = 6;
let speedYBall = 6;
// racket variables
let xRacket = 5;
let yRacket = 150;
let heightRacket = 90;
let widthRacket = 10;
function setup() {
createCanvas(600, 400);
}
function draw() {
background(0);
showMeBall();
moveBall();
checksCollisionEdge();
showMeRacket();
moveRacket();
checkCollisionRacket();
}
function showMeBall() {
circle(xBall, yBall, diameter);
}
function moveBall() {
xBall += speedXBall;
yBall += speedYBall;
}
function checksCollisionEdge() {
if (xBall + lightning > width || xBall - lightning < 0) {
speedXBall *= -1;
}
if (yBall + lightning > height || yBall - lightning < 0) {
speedYBall *= -1;
}
}
function showMeRacket() {
rect(xRacket, yRacket, widthRacket, heightRacket);
}
function moveRacket() {
if (keyIsDown(UP_ARROW)) {
yRacket -= 10;
}
if (keyIsDown(DOWN_ARROW)) {
yRacket += 10;
}
}
function checkCollisionRacket() {
if( xBall - lightning < xRacket + widthRacket && yBall - lightning < yRacket + heightRacket && yBall - lightning > yRacket) {
speedXBall *= -1;
}
}