[javascript] Estoy haciendo un juego y tengo errores en las variables.

[Ori-chan]

El juego no corre como debería (No se ve nada) y cuando le doy a "inspeccionar elemento" me salen 2 errores: "Can not read de propety 'vel_x' of undefined" y "Can not read de propety 'vel_x' of undefined".

Código (javascript) [Seleccionar] Expandir

window.addEventListener('load',init,false);

//VARIABLES
var canvas=null,ctx=null;
var lastPress=null;
var pause=true;
var gameover=false;
var dir=0;
var score=0;
var player=new Rectangle(40,40,10,10);
player.tam=10;
player.x=40;
player.y=40;
player.vel_x=1;
player.vel_y=1;
var vel_maxima=8;

var KEY_ENTER=13;
var KEY_LEFT=37;
var KEY_UP=38;
var KEY_RIGHT=39;
var KEY_DOWN=40;


var food=new Array();

food.push(new Rectangle(100,50,10,10));
food.push(new Rectangle(100,100,10,10));
food.push(new Rectangle(200,50,10,10));
food.push(new Rectangle(200,100,10,10));

   for(var i=0,l=food.length;i<l;i++){
food[i].tam=10;
food[i].dir=0;
food[i].vel_x=6;
food[i].vel_y=6; }

//VARIABLES









function random(max){
   return Math.floor(Math.random()*max);
}


function init(){
   canvas=document.getElementById('canvas');
   ctx=canvas.getContext('2d');
   run();
   repaint();
}


function run(){
   setTimeout(run,50);
   act();
}


function repaint(){
   requestAnimationFrame(repaint);
   paint(ctx);
}


function reset(){
lastPress=null
dir=0
score=0
player=new Rectangle(40,40,10,10)
player.tam=10
player.vel_x=1
playervel_y=1
vel_maxima=8
   for(var i=0,l=food.length;i<l;i++){
food[i].tam=10
food[i].dir=0
food[i].vel_x=6
food[i].vel_y=6}
pause=true
gameover=false
}


function act(){
   if(!pause){
       if(gameover){
           reset();}

       // Change Direction
       if(lastPress==KEY_UP)
           dir=0;
       if(lastPress==KEY_RIGHT)
           dir=1;
       if(lastPress==KEY_DOWN)
           dir=2;
       if(lastPress==KEY_LEFT)
           dir=3;

       // Move Rect

       if(dir==0)
       if(player.vel_y!=-vel_maxima && dir==0)
           player.vel_y-=1;

       if(dir==1)
       if(player.vel_x!=vel_maxima && dir==1)
           player.vel_x+=1;

       if(dir==2)
       if(player.vel_y!=vel_maxima && dir==2)
           player.vel_y+=1;

       if(dir==3)
       if(player.vel_x!=-vel_maxima && dir==3)
           player.vel_x-=1;

           player.y+=player.vel_y
           player.x+=player.vel_x


       // Out Screen
       if(player.x>canvas.width-player.tam){
           player.vel_x=0
           player.x=canvas.width-player.tam }

       if(player.y>canvas.height-player.tam){
           player.vel_y=0
           player.y=canvas.height-player.tam}

       if(player.x<0){
           player.vel_x=0
           player.x=0 }

       if(player.y<0){
           player.vel_y=0
           player.y=0 }


   for(var i=0,l=food.length;i<l;i++){

       // Move food
           if(food[i].dir==0){
               food[i].x-=food[i].vel_x
               food[i].y+=food[i].vel_y }
           if(food[i].dir==1){
               food[i].x-=food[i].vel_x
               food[i].y-=food[i].vel_y }
           if(food[i].dir==2){
               food[i].x+=food[i].vel_x
               food[i].y+=food[i].vel_y }
           if(food[i].dir==3){
               food[i].x+=food[i].vel_x
               food[i].y-=food[i].vel_y }


       //Food Out Screen
       if(food[i].y>canvas.height-food[i].tam || food[i].y<0){
          food[i].vel_y=-food[i].vel_y}
       if(food[i].x>canvas.width-food[i].tam || food[i].x<0){
          food[i].vel_x=-food[i].vel_x}

    }

   
       // Food Intersects
   for(var i=0,l=food.length;i<l;i++){
       if(player.intersects(food[i])){
       if(food[i].tam>player.tam){
           gameover=true;
           pause=true;
        }else {
           score++;
           player.tam+=2;
           food[i].x=random(canvas.width/10-1)*10;
           food[i].y=random(canvas.height/10-1)*10;
           food[i].tam=Math.floor(Math.random() * (20-10+1)) + 10;
           food[i].dir=Math.floor(Math.random() * (3-0+1)) + 0;
           food[i].vel_x=Math.floor(Math.random() * (7-3+1)) + 3;
           food[i].vel_y=Math.floor(Math.random() * (7-3+1)) + 3; }
       }
       }
   }
   // Pause/Unpause
   if(lastPress==KEY_ENTER){
       pause=!pause;
       lastPress=null;
   }
}


   for(var i=0,l=food.length;i<l;i++){
function paint(ctx){
   ctx.fillStyle='#000';
   ctx.fillRect(0,0,canvas.width,canvas.height);
   ctx.fillStyle='#0f0';
   ctx.fillRect(player.x,player.y,player.tam,player.tam);
   ctx.fillStyle='#f00';
   for(var i=0,l=food.length;i<l;i++){
   ctx.fillRect(food[i].x,food[i].y,food[i].tam,food[i].tam); }

   ctx.fillStyle='#fff';
   //ctx.fillText('Last Press: '+lastPress,0,20);
   ctx.fillText('Score: '+score,0,10);

   if(pause){
       ctx.textAlign='center';
       if(gameover){
           ctx.fillText('GAME OVER',150,75);}
       else{
           ctx.fillText('PAUSE',150,75);
       ctx.textAlign='left';}
   }
}}

document.addEventListener('keydown',function(evt){
   lastPress=evt.keyCode;
},false);

function Rectangle(x,y,width,height){
   this.x=(x==null)?0:x;
   this.y=(y==null)?0:y;
   this.width=(width==null)?0:width;
   this.height=(height==null)?this.width:height;
  for(var i=0,l=food.length;i<l;i++){

   this.intersects=function(rect){
       if(rect!=null){
           return(this.x<rect.x+food[i].tam&&
               this.x+player.tam>rect.x&&
               this.y<rect.y+food[i].tam&&
               this.y+player.tam>rect.y);
        }
       }
   }

   this.fill=function(ctx){
       if(ctx!=null){
           ctx.fillRect(this.x,this.y,this.width,this.height);
       }
   }
}

window.requestAnimationFrame=(function(){
   return window.requestAnimationFrame ||
       window.webkitRequestAnimationFrame ||
       window.mozRequestAnimationFrame ||
       function(callback){window.setTimeout(callback,17);};
})();


¿He cometido algún error con las variables o algo así? El error me dio cuando hice la lista del array de food. Y puse los bucles for por ahí

[EFEX]

Este codigo es de algun lado? deberias buscar el source original..

Posiblemente se deba a que se borro la variable..

[Ori-chan]

El código es enteramente mio. Pero prendí a hacer esto en: http://juegoscanvas.blogspot.com.es/