Tópico de Progresso

//Variáveis da bolota
let xBola = 300;
let yBola = 200;
let diametro = 40;
let raio = diametro /  2;

//Variáveis da raquete
let xRaq = 6;
let yRaq = 150;
let RaqComp = 10;
let RaqAltu = 80;
let RaqBar = RaqAltu / 2;

//Velocidade da bolota
let velocidadeXBola = 5; 
let velocidadeYBola = 5; 


function setup() {
  createCanvas(600, 400);
}

function draw() {
  background(0);
  mostraBola()
  movimentoBola()
  colisaoBorda()
  mostraRaquete()
  movimentoRaquete()
  colisaoRaquete()
}

function mostraBola() {
  circle(xBola,yBola,diametro)
  rect (xRaq,yRaq,RaqComp,RaqAltu)
}

function movimentoBola() {
  xBola += velocidadeXBola;
  yBola += velocidadeYBola;
}

function colisaoBorda() {
  if(xBola + raio > width || xBola - raio < 0){
  velocidadeXBola *= -1;}

  if (yBola + raio > height || yBola - raio < 0){
  velocidadeYBola *= -1;
  }
}
function mostraRaquete() {
  rect (xRaq,yRaq,RaqComp,RaqAltu);
}

function movimentoRaquete() {
  if (keyIsDown(UP_ARROW)){
    yRaq -= 10;}
  if (keyIsDown(DOWN_ARROW)){
    yRaq += 10;
  }}

function colisaoRaquete() {
  if (xBola - raio < xRaq + RaqComp && yBola - raio < yRaq + RaqAltu && yBola + raio > yRaq ){
    velocidadeXBola *= -1
  } 
}