Marquei solucionado na outra postagem por engano pois ela solucionou apenas metade do problema não consigo colocar colisão na raquete do oponente, a bolinha fica "tremendo" no meio da tela se movimentando apenas no eixo y optei por usar o código de colisão criado no curso e não o trazido de fora
segue meu código
//var bolinha
let xBolinha = 300;
let yBolinha = 200;
let diametro = 15;
let vxBolinha = 6;
let vyBolinha = 6;
let raio = diametro / 2;
//var barra
let xBarra = 0;
let yBarra = 150;
let hBarra = 90;
let lBarra = 10;
//var barra 2
let xBarra2 = 790;
let yBarra2 = 150;
let vyBarra2;
//placar do jogo
let pontos1 = 0;
let pontos2 = 0;
function setup() {
createCanvas(800, 450);
}
function draw() {
background(0);
bolinha();
velocidade_bolinha();
colisao_bolinha();
barra(xBarra, yBarra);
barra(xBarra2, yBarra2);
movimentoBarra();
colisaoBarra(xBarra, yBarra);
colisaoBarra(xBarra2, yBarra2);
movimentoBarra2();
placar();
marcaPonto();
}
function bolinha() {
circle(xBolinha, yBolinha, diametro);
}
function velocidade_bolinha() {
xBolinha += vxBolinha;
yBolinha += vyBolinha;
}
function colisao_bolinha() {
if (xBolinha + raio > width || xBolinha - raio < 0) {
vxBolinha *= -1.0;
}
if (yBolinha + raio > height || yBolinha - raio < 0) {
vyBolinha *= -1.0;
}
}
function barra(x, y) {
rect(x, y, lBarra, hBarra);
}
function movimentoBarra() {
if (keyIsDown(UP_ARROW)) {
yBarra -= 10;
}
if (keyIsDown(DOWN_ARROW)) {
yBarra += 10;
}
}
function colisaoBarra(x, y){
if (xBolinha - raio < x + lBarra &&
yBolinha - raio < y + hBarra &&
yBolinha + raio > y) {
vxBolinha *= -1;
}
}
function movimentoBarra2(){
vyBarra2 = yBolinha - yBarra2 - lBarra / 2 - 30;
yBarra2 += vyBarra2
}
function marcaPonto(){
if (xBolinha < 10){
pontos2 += 1
}
if (xBolinha > 795){
pontos1 += 1
}
}
function placar(){
stroke(255);
textAlign(CENTER);
textSize(25);
fill(color(255, 140, 0))
rect(180, 5, 40, 26)
fill(255)
text(pontos1, 200, 26)
fill(color(255, 140, 0))
rect(580, 5, 40, 26)
fill(255)
text(pontos2, 600, 26)
}