Quando vou testar o jogo após adicionar a função de colisão o navegador não carrega mais.
Quando vou testar o jogo após adicionar a função de colisão o navegador não carrega mais.
Olá, Álvaro! Espero que esteja tudo bem por aí!
Olhei seu projeto e há um pequeno erro que compromete o funcionamento do código. Esse erro é no for da função verificaColisao(). Vamos ver?
Observe atentamente o seu código:
function verificaColisao(){
for( let i=0; imagemCarros.length; i++){ //faltou passar a condição
colisao = collideRectCircle(xCarros[i], yCarros[i], wCarro, hCarro, xAtor, yAtor, 15)
if(colisao){
voltaInicio();
}
}
}
Podemos perceber que falta passar uma informação na condição do seu for, o que gerou o conflito de informações e o comportamento do código ficar eternamente realizando a aferição do comprimento da lista de "imagens.carro".
Por que isso ocorreu?
A sintaxe do for possui a seguinte estrutura:
for ([inicialização]; [condição]; [expressão final])
declaração
Nesse sentido, você enviou corretamente a inicialização e a expressão final. No entanto a condição ficou como a leitura do comprimento de imagensCarros e o for ficou realizando essa operação eternamente (por isso que travou o navegador). A condição é muito importante , pois é:
condição
Uma expressão para ser avaliada antes de cada iteração do loop. Se esta expressão for avaliada para true, declaração será executado. Este teste da condição é opcional. Se omitido, a condição sempre será avaliada como verdadeira. Se a expressão for avaliada como falsa, a execução irá para a primeira expressão após a construção loop for.
Dessa forma, para solucionar o problema basta passarmos uma condição que esteja de acordo com a lógica do projeto. No código abaixo o instrutor utiliza uma verificação que é baseada em "se o contador for menor que o comprimento da lista de imagens dos carros", vejamos:
function verificaColisao(){
for( let i = 0; i < imagemCarros.length; i++){ //bem aqui a condição
colisao = collideRectCircle(xCarros[i], yCarros[i], wCarro, hCarro, xAtor, yAtor, 15)
if(colisao){
voltaInicio();
}
}
}
Você poderia copiar e testar no seu p5.js para ver se funciona?
Vou deixar um link com a documentação da MDN sobre o for: for MDN Web Docs
Espero que tenha ajudado você!
Um abraço e bons estudos!