Segue o código:
//jogo Pong
//variáveis da bolinha
let xBolinha = 300;
let yBolinha = 200;
let diametro = 20;
let raio = diametro / 2;
//variáveis de velocidade da bolinha
let veloXbolinha = 6;
let veloYbolinha = 6;
//variáveis da raquete
let xRaquete1 = 5;
let yRaquete1 = 150;
let wRaquete1 = 10; //comprimento
let hRaquete1= 90; //largura
function setup() {
createCanvas(600, 400);
}
function draw() {
background(0);
mostraBolinha();
movimentaBolinha();
colisaoBorda();
mostraRaquete1();
movimentaMinhaRaquete();
colisaoRaquete1();
}
function mostraBolinha(){
circle(xBolinha, yBolinha, diametro);
}
function movimentaBolinha(){
xBolinha += veloXbolinha;
yBolinha += veloYbolinha;
}
function mostraRaquete1(){
rect(xRaquete1, yRaquete1, wRaquete1, hRaquete1);
}
function movimentaMinhaRaquete() {
if (keyIsDown(UP_ARROW)) {
yRaquete1 -= 10;
}
if (keyIsDown(DOWN_ARROW)) {
yRaquete1 += 10;
}
}
function colisaoBorda(){
if(xBolinha + raio > width || xBolinha - raio < 0){
veloXbolinha *= -1;
}
if(yBolinha + raio > height || yBolinha - raio < 0){
veloYbolinha *= -1;
}
}
function colisaoRaquete1() {
//w comprimento da raquete
//h largura da raquete
if (xBolinha - raio < xRaquete1 + wRaquete1
&& yBolinha - raio < yRaquete1 + hRaquete1
&& yBolinha + raio > yRaquete1) {
veloXbolinha *= -1;
}
}