[Bug] A raquete do oponente não funciona

Oi, Gabriel! Tudo certo por aí?

Quando a função mostrarect() é executada em draw(), o segundo valor que está sendo passado como parâmetro é velocidadeYOponente ao invés de yRectOponente.

mostrarect(xRectOponente,velocidadeYOponente);

Fazendo a alteração, chegamos no seguinte resultado:

mostrarect(xRectOponente, yRectOponente);

Durante o curso, foram apresentados dois caminhos para realizar a colisão da raquete. Sendo assim, podemos escolher uma das opções para utilizar em nosso código. Para evitar erros, recomendo comentar uma das possibilidades, deixando somente uma em funcionamento.

Sinta-se livre para escolher a opção que você mais gostou. Abaixo, eu apresento uma maneira possível e como podemos organizar o código a partir dela, está bem?

Neste caso, eu deixei a função que contém a biblioteca apresentada pelo instrutor. Não só isso, como também adicionei dois parâmetros (x e y) à função colisaoRectBiblioteca e os adicionei ao método collideRectCircle. Desta maneira, tornamos a função genérica, já que ela pode receber diferentes valores!

//  function colisaoRect(){
//   if(xBolinha - raio < xRect + comprimentoRect && yBolinha - raio < yRect + alturaRect && yBolinha + raio > yRect){
//     velocidadeXBolinha *= -1;
//   }
// }

function colisaoRectBiblioteca(x, y){
  colideRect= collideRectCircle(x, y, comprimentoRect, alturaRect, xBolinha, yBolinha, raio);
  if (colideRect){
    velocidadeXBolinha *= -1;
  }
}

Para finalizar, atualizei o draw() com a função colisaoRectBiblioteca e seus respectivos parâmetros — tanto para as variáveis da nossa raquete, como as da raquete do oponente:

function draw() {
  background(0);
  mostrabolinha();
  movimentabolinha();
  colisao();
  mostrarect(xRect,yRect);
  movimentaRect();
  colisaoRectBiblioteca(xRect, yRect); // colisão da nossa raquete!
  mostrarect(xRectOponente, yRectOponente);
  movimentaRectOponente();
  colisaoRectBiblioteca(xRectOponente, yRectOponente) // colisão da raquete do oponente!
}

Com isso, o resultado final do seu código será:

let xBolinha = 300;
let yBolinha = 200;
let diametro = 10;

let raio = diametro/2;

let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

let xRect= 5;
let yRect= 150;
let alturaRect= 80;
let comprimentoRect= 10;
let colideRect=false;

let xRectOponente = 585;
let yRectOponente = 150;
let velocidadeYOponente;

function setup() {
  createCanvas(600, 400);
}
function draw() {
  background(0);
  mostrabolinha();
  movimentabolinha();
  colisao();
  mostrarect(xRect,yRect);
  movimentaRect();
  colisaoRectBiblioteca(xRect, yRect);
  mostrarect(xRectOponente, yRectOponente);
  movimentaRectOponente();
  colisaoRectBiblioteca(xRectOponente, yRectOponente)
}
  function mostrabolinha(){
  circle(xBolinha,yBolinha,diametro);
}

function movimentabolinha(){
  xBolinha += velocidadeXBolinha;
  yBolinha += velocidadeYBolinha;
}

function colisao(){
  if(xBolinha + raio > width || xBolinha - raio < 0){
    velocidadeXBolinha *= -1;
  }
  if(yBolinha + raio > height || yBolinha - raio < 0 ){
    velocidadeYBolinha *= -1;
  }
}

function mostrarect(x,y){
 rect(x,y,comprimentoRect,alturaRect);
}

function movimentaRect(){
  if(keyIsDown(UP_ARROW)){
    yRect -=10;
  }
  if(keyIsDown(DOWN_ARROW)){
    yRect +=10;
  }
}

//  function colisaoRect(){
//   if(xBolinha - raio < xRect + comprimentoRect && yBolinha - raio < yRect + alturaRect && yBolinha + raio > yRect){
//     velocidadeXBolinha *= -1;
//   }
// }

function colisaoRectBiblioteca(x, y){
  colideRect= collideRectCircle(x, y, comprimentoRect, alturaRect,xBolinha, yBolinha, raio);
  if (colideRect){
    velocidadeXBolinha *= -1;
  }
}

function movimentaRectOponente(){
  velocidadeYOponente = yBolinha - yRectOponente - comprimentoRect / 2 - 30;
  yRectOponente += velocidadeYOponente;
}

Caso surjam dúvidas após minha explicação ou ao longo dos seus estudos, lembre-se que você pode contar com o fórum. Fico à disposição para te auxiliar no que for preciso.

Até mais, Gabriel!