4
respostas

Crash no jogo.

Assim que a bolinha toca na raquete do oponente a mesma some, o placar também e o jogo para.

A trilha continua.

let xBolinha = 300;
let yBolinha = 200;
let diametro = 28;
let raio = diametro/2; 

let xRaquete = 5;
let yRaquete = 150;
let alturaRaquete = 90;
let comprimentoRaquete = 10;

let xRaqueteOponente = 585;
let yRaqueteOponente = 150;

let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

let velocidadeYOponente;

let meusPontos = 0;
let pontosOponente = 0;

let colidiu = false;

let trilha; 
let raquetada;
let ponto;

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

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

function draw() {
  background(0);
  criaBolinha();
  moveBolinha();
  colisaoBorda();
  mostraRaquete(xRaquete, yRaquete);
  moveRaquete();
  // colisaoRaquete();
  verificaColisaoRaquete(xRaquete, yRaquete);
  verificaColisaoRaquete(xRaqueteOponente, yRaqueteOponente);
  mostraRaquete(xRaqueteOponente, yRaqueteOponente);
  moveRaqueteOponente();
  incluiPlacar();
  marcaPonto();

}

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

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

function colisaoBorda(){

  if (xBolinha + raio > width || 
      xBolinha - raio < 0 ){
    velocidadeXBolinha *= -1;
  }

  if (yBolinha  + raio > height ||
      yBolinha - raio < 0){
    velocidadeYBolinha *= -1;
  }
}

function mostraRaquete(x, y){
  rect(x, y, comprimentoRaquete, alturaRaquete);
}


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

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

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

function moveRaqueteOponente(){
  velocidadeYOponente = yBolinha - yRaqueteOponente - comprimentoRaquete / 2 - 30;
  yRaqueteOponente += velocidadeYOponente;
}

function incluiPlacar(){
  stroke(255);
  textAlign(CENTER);
  textSize(16);  
  fill(color(255, 40, 0))
  rect(150, 10, 40, 20);
  fill(255)
  text(meusPontos, 170, 26);
  fill(color(255, 40, 0))
  rect(450, 10, 40, 20);
  fill(255)
  text(pontosOponente, 470, 26);
  preload();
}

function marcaPonto(){
  if (xBolinha > 585){
    meusPontos += 1;
    ponto.play();
  }
  if (xBolinha < 15){
    pontosOponente += 1;
    ponto.play();
  }
}
4 respostas

Gabriel, bom dia.

Ao que consegui ver, você está tentando inicializar a váriavel "colidiu" dentro da função "verificaColisaoRaquete(x, y);" sem parâmetro.

Acredito que adicionar um simples "true" já resolve.

Código antigo:

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

Código novo:

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

Não funcionou, afinal a variável "colidiu" tem como parâmetros as varáveis "collideRectCircle(x, y, comprimentoRaquete, alturaRaquete, xBolinha, yBolinha, raio)"

Assim como na vídeo aula. Dando assim sentido a condição "if" a seguir.

if (colidiu)

sendo

if (colidiu == true){...

Entendi seu ponto!!

Gabriel, rodando apenas esse trecho de código no navegador é retornado " Uncaught ReferenceError: collideRectCircle is not defined "

A variável collideRectCircle não foi iniciada.

// teste que rodei no navegador
<!DOCTYPE html>

<html>

<script>
    colidiu = collideRectCircle(x, y, comprimentoRaquete, alturaRaquete, xBolinha, yBolinha, raio);
</script>

</html>

Tenta adicionar "var" e roda. Vamos ver se funciona!

    colidiu = var collideRectCircle(x, y, comprimentoRaquete, alturaRaquete, xBolinha, yBolinha, raio);

Eu também entendo o que estás a dizer. Porém, primeiramente acredito que dentro desse projeto, usando o p5, nós declaramos todas as variáreis desde o início usando "let".

Se observar no início do meu código verá o que seguinte:

let colidiu = false;

Se trata de uma de Boolean que nós declaramos false por padrão.

Sendo assim não faz sentido declarar novamente a variável dentro de uma função, ainda mais usando "var".

Por fim, realizei um teste declarando através de "var" mas não funcionou. Talvez seja um problema da própria plataforma "p5".