JavaScript

Galera me ajude estou fazendo esse jogo e nao estou conseguindo evitar q minha nave nao passe a borda! e que as naves inimigas ao coledir a minha perda o jogo! e que aparece um campo de pontos ao destruir cada nave!

<!doctype html>

Navinha //pega contexto do canvas var canvas=document.getElementById(“canvas”); var ctx=canvas.getContext(“2d”); // e com o ctx que vou conseguri desenhar na tela

//imagem de fundo
var imgFundo=new Image(); //imagem de fundo do jogo criando o
imgFundo.src=“fundo.png”;

//imagem da nave
var imgNave=new Image();
imgNave.src=“nave.png”;

//imagem da bala
var imgBala=new Image();
imgBala.src=“bala.png”;

//imagem da inimigo
var imgInimigo=new Image();
imgInimigo.src=“inimigo.png”;

//cria vetor de balas
var balas=[];

//cria vetor de fundo
var fundos=[0,1500];

//cria vetor de inimigos
inimigos=[];

//cria objeto nave
var nave={x:30,y:300};

//define funcao para criarInimigos
function criarInimigos(quant)
{
for(var i=0;i<quant;i++)
{
var inimigo={x:Math.random()*canvas.width+canvas.width,y:Math.random()*canvas.height-33};
inimigos.push(inimigo);
}
}
//define funcao para desenhar e movimentar inimigos
function desenharInimigos()
{
var tam=inimigos.length;
for(var i=0;i<tam;i++)
{
ctx.drawImage(imgInimigo,inimigos[i].x,inimigos[i].y,83,33);
inimigos[i].x-=1;
if(inimigos[i].x<-83)
{
inimigos[i].x=Math.random()*canvas.width+canvas.width;
inimigos[i].y=Math.random()*canvas.height-33;
}
}
}
//define funcao para desenhar nave
function desenhaNave()
{
ctx.drawImage(imgNave,nave.x,nave.y,83,33);
}
//define funcao para movimentar nave pelo teclado
function moverNave(evento)
{
if(evento.keyCode==37)//esquerda
nave.x-=10;
if(evento.keyCode==38)//cima
nave.y-=10;
if(evento.keyCode==39)//direita
nave.x+=10;
if(evento.keyCode==40)//baixo
nave.y+=10;
}
//define funcao para atirar quando precionar barra de espaço
function atirar(evento)
{
if(evento.keyCode==32)//barra de espaço
{
var bala={x:nave.x+83,y:nave.y+16};
//if(balas.length<3)
balas.push(bala);
}
}
//define funcao para desenhar balas e movimenta-las
function desenharBalas()
{
var tam=balas.length;
for(var i=tam-1;i>=0;i–)
{
ctx.drawImage(imgBala,balas[i].x,balas[i].y,9,9);
balas[i].x+=10;
if(balas[i].x>1000)
balas.splice(i,1);
}
}

//define funcao para verificar se a bala acertou o inimigo
function colidiu(b,i)
{
if(b.x>i.x&&b.x<i.x+83&&b.y>i.y&&b.y<i.y+33)
return true;
else
return false;
}
function balaAcertouInimigos(b)
{
var quantI=inimigos.length;
for(var i=0;i<quantI;i++)
{
if(colidiu(b,inimigos[i]))
{
inimigos[i].x=Math.random()*canvas.width+canvas.width;
inimigos[i].y=Math.random()*canvas.height-33;
}
}
}
function acertou()
{
var quantB=balas.length;
for(var i=0;i<quantB;i++)
{
balaAcertouInimigos(balas[i]);
}
}
//define funcao para desenhar e movimentar fundo
function desenharFundo()
{
ctx.drawImage(imgFundo,fundos[0],0);
ctx.drawImage(imgFundo,fundos[1],0);
fundos[0]-=2;
fundos[1]-=2;
if(fundos[0]<-1500)
fundos[0]=fundos[1]+1500;
if(fundos[1]<-1500)
fundos[1]=fundos[0]+1500;
}
function loop()
{
//limpa fundo
ctx.clearRect(0,0,canvas.width,canvas.height);
//desenha fundo
desenharFundo();
//desenha nave
desenhaNave();
//desenha balas
desenharBalas();
//desenha inimigos
desenharInimigos();
//verifica se a bala acertou o inimigo
acertou();
}
// chama loop a cada 10 milisegundos
setInterval(loop,10);
//quando abaixar as teclas do teclado chama função para mover nave
onkeydown=moverNave;
//quando soltar as as teclas do teclado chama função para atirar
onkeyup=atirar;
//chama função para vetor de inimigos informando a quantidade de inimigos;
criarInimigos(10);

Oi, @Wellington_Gomes1.

Em primeiro lugar, gostaria de pedir para que você edite seu post para ficar mais legível.

  • Abra a edição de postagem clicando no ícone do lápis em baixo do seu tópico (:pencil2:)
  • Selecione todo o trecho que for CÓDIGO. Clique na ferramenta de pré-formatação de códigos (o ícone é </> , ou pelo atalho de teclado CTRL+SHIFT+C
  • Cheque mais dicas de postagem nesse tópico.

[]'s!