Pong Parte 3 - Concluído | Lógica de programação: comece em lógica com o jogo Pong e JavaScript

Mais uma etapa concluída. Estava com dúvidas sobre o oponente invencível criado, mas vi em outras respostas que isso ainda será ensinado. Errei em um dos códigos e não encontrei de forma alguma, demorei um bom tempo (talvez agora sim eu tenha iniciado na programação lol).

//Variaveis Bolinha;
let xBolinha = 300
let yBolinha = 200
let diametro = 30
let raio = diametro/2

//Variaveis Velocidade
xVelocidadeBolinha = 2;
yVelocidadeBolinha = 2;

//Variavel RaqueteA
let xRaqueteA = 5;
let yRaqueteA = 150;
let AlturaRaquete = 65;
let ComprimentoRaquete = 10;

//Variavel RaqueteB
let xRaqueteB = 585;
let yRaqueteB = 150
let velocidadeYB;

//Biblioteca
let colidiu = false

//Placar
let meusPontos = 0
let pontosOponente = 0

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

function draw() {
  background(0);
  mostraBolinha ();
  moveBolinha ();
  colisaoBorda ();
  mostraRaquete (xRaqueteA, yRaqueteA);
  moveRaqueteA ();
  //colisaoRaqueteA ();
  colisaoRaqueteaBiblioteca ();
  mostraRaquete (xRaqueteB, yRaqueteB);
  //movimentaRaqueteB ();
  criarPlacar ();
  somarPlacar ();
}

function mostraBolinha (){
  circle (xBolinha, yBolinha, diametro);
}

function moveBolinha () {
  (xBolinha += xVelocidadeBolinha); 
  (yBolinha += yVelocidadeBolinha)
}

function colisaoBorda (){
  if (xBolinha + raio > width || xBolinha - raio < 0) (xVelocidadeBolinha *= -1);
  if (yBolinha + raio > height || yBolinha - raio < 0)  (yVelocidadeBolinha *= -1);
}

function mostraRaquete (x,y){
  rect ( x, y, ComprimentoRaquete, AlturaRaquete)
}

function moveRaqueteA (){
  if (keyIsDown (UP_ARROW)) { yRaqueteA -= 10}
  if (keyIsDown (DOWN_ARROW)) { yRaqueteA += 10}
}

function colisaoRaqueteA (){
 if ( xBolinha - raio < xRaqueteA + ComprimentoRaquete && yBolinha - raio < yRaqueteA + AlturaRaquete && yBolinha - raio > yRaqueteA) { xVelocidadeBolinha *= -1};
}

function colisaoRaqueteaBiblioteca () {
  colidiu =
  collideRectCircle(xRaqueteA, yRaqueteA, ComprimentoRaquete, AlturaRaquete, xBolinha, yBolinha, raio);
  if (colidiu) {
    xVelocidadeBolinha *= -1
  }
}

function movimentaRaqueteB (){
  velocidadeYB = yBolinha - yRaqueteB - ComprimentoRaquete/2 - 60;
  yRaqueteB += velocidadeYB
}

function criarPlacar (){
  fill (255)
  text (meusPontos, 278 , 26)
  text (pontosOponente, 321 , 26)
}

function somarPlacar (){
  if (xBolinha > 585){
    meusPontos += 1;
  }
  if (xBolinha < 15) {
    pontosOponente += 1;
  }
}

Oi, Daniel! Tudo bem?

Excelente projeto, parabéns pelo resultado e desempenho! É muito gratificante poder acompanhar o seu inicio nessa jornada, espero que continue a explorar os conteúdos para ampliar seu conhecimento e desenvolver novas habilidades.

Caso tenha restado alguma dúvida em relação a qualquer conteúdo do curso ou atividade, não hesite em perguntar. Estou disponível e ficarei super feliz em poder ajudar!

Deixo como sugestão apenas a alteração da função colisaoRaqueteaBiblioteca de forma que passe a receber dois parametros (x e y) para que assim a sua funcionalidade possa ser aplicada tanto para a raquete A quanto a raquete B, ficando de acordo com o código abaixo:

function colisaoRaqueteaBiblioteca (x, y) {
  colidiu =
  collideRectCircle(x, y, ComprimentoRaquete, AlturaRaquete, xBolinha, yBolinha, raio);
  if (colidiu) {
    xVelocidadeBolinha *= -1
  }
}

Somado a isso, não podemos esquecer de fazermos a chamada da função para cada raquete dentro da função draw, deixando-a da seguinte forma:

function draw() {
  background(0);
  mostraBolinha ();
  moveBolinha ();
  colisaoBorda ();
  mostraRaquete (xRaqueteA, yRaqueteA);
  moveRaqueteA ();
  //colisaoRaqueteA ();
  colisaoRaqueteaBiblioteca (xRaqueteA, yRaqueteA);
  colisaoRaqueteaBiblioteca (xRaqueteB, yRaqueteB);
  mostraRaquete (xRaqueteB, yRaqueteB);
  movimentaRaqueteB ();
  criarPlacar ();
  somarPlacar ();
}

Espero ter ajudado!

Um forte abraço e bons estudos!