Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Jogo pronto com alterações. Jogo anuncia o vencedor.

Estou começando com o js.

Fiz o jogo que ao atingir 5 pontos ele anuncia o vencedor. Jogo multiplayer, w/s controlam o oponente.

https://editor.p5js.org/eduardabitten/full/R-f1k6ibj

//variáveis da bolinha
let xBolinha = 300;
let yBolinha = 200;
let diametro = 25;
let raio = diametro / 2;

//velocidades da bolinha
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

//variáveis da raquete 
let xRaquete = 8;
let yRaquete = 140;
let larguraRaquete = 12;
let alturaRaquete = 120;


//variáveis do Oponente
let xOponente = 580;
let yOponente = 140;
let velocidadeYOponente;
let colidiu = false;

//placar
let meusPontos = 0;
let pontosOponente = 0;
let tamanho = 0;

//sons de jogo
let raquetada;
let ponto;
let trilha;

function preload (){
  trilha = loadSound("trilha.mp3");
  raquetada = loadSound ("raquetada.mp3");
  ponto = loadSound ("ponto.mp3");
}

function setup() {
  trilha.loop();
  createCanvas(600, 400);
}

function draw() {
  background(20);
  mostrarBolinha();
  velocidadeBolinha();
  verificaColisaoBorda();
  mostrarRaquete(xRaquete, yRaquete);
  mostrarRaquete(xOponente, yOponente);
  movimentarRaquete();
  //verificarColisaoBolinhaRaquete ();
  movimentaRaqueteOponente ();
  colisaoRaquetesBiblioteca (xRaquete,yRaquete);
  colisaoRaquetesBiblioteca (xOponente,yOponente);
  incluirPlacar();
  marcarPonto();
  vencedor();
  zerarPlacar ();

}

function mostrarBolinha (){
  stroke (color(250,20,147))
  fill (color(250,20,147))
  circle(xBolinha,yBolinha,diametro);
}

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

function mostrarRaquete(x,y){
  stroke(255)
  fill (255)
  rect(x,y,larguraRaquete,alturaRaquete)
}


function movimentarRaquete (){
  if (keyIsDown(UP_ARROW)){
      yRaquete -= 10;
      }
   if (keyIsDown(DOWN_ARROW)){
      yRaquete += 10;
      }

  }


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

function verificarColisaoBolinhaRaquete (){
if (xBolinha - raio < xRaquete + larguraRaquete && yBolinha - raio < yRaquete + alturaRaquete && yBolinha + raio > yRaquete)
  {  
raquetada.play();
velocidadeXBolinha *= -1;
  }
}

function colisaoRaquetesBiblioteca (x,y){
  colidiu =
    collideRectCircle(x, y, larguraRaquete, alturaRaquete, xBolinha, yBolinha, raio);
  if (colidiu){
    raquetada.play();
    velocidadeXBolinha *= -1;
  }

}

function movimentaRaqueteOponente (){
  if (keyIsDown(87)){
      yOponente -= 10;
      }
   if (keyIsDown(83)){
      yOponente += 10;
      }

}

function incluirPlacar(){
  //textAlign (CENTER)
  stroke (255)
  textSize (30)
  fill (color(250,20,147))
  rect(253,11, 30,30)
  rect(303, 11, 30, 30)
  fill (255)
  text(meusPontos, 260, 36)
  text("-", 288, 36)
  text(pontosOponente, 310, 36)
  textSize (12)
  text ("JOGADOR 1", 170,30)
  text ("OPONENTE", 350,30)
}

function marcarPonto(){
  if (xBolinha > 590){
    ponto.play();
    meusPontos += 1;
  }

  if (xBolinha < 15){
    ponto.play();
    pontosOponente += 1;
  }
}

function vencedor() {
  if (meusPontos == 5){
    fill (255)
  textSize (25)
  text ("JOGADOR 1 VENCEU!!", 120,100)
  }

  if (pontosOponente == 5){
    fill (255)
  textSize (25)
  text ("JOGADOR OPONENTE VENCEU!!", 120,100)
  }  
}

function zerarPlacar () {
  if (meusPontos == 5 && xBolinha < 200){
    meusPontos = 0
  pontosOponente = 0
  }
  if (pontosOponente == 5 && xBolinha > 400){
    meusPontos = 0
  pontosOponente = 0
  }
}
1 resposta
solução!

Oi oi, Eduarda! Tudo bom?

É maravilhoso encontrar projetos feitos com tanto cuidado e dedicação. Tenho certeza que você será uma grande desenvolvedora!

Parabéns pelo projeto e pelas customizações.

Obrigada por compartilhar seu código e, em caso de dúvidas, conte conosco!

Um abraço e bons estudos!