{ Crafty.init(500,250, document.getElementById('game')); Crafty.c( "Wall", { init: function() { this.addComponent("2D,Canvas,Color,Collision,WiredHitBox,wall") .color('black'); }, wall: function(x,y,w,h) { this.x = x*1 || 0; this.y = y*1 || 0; this.w = w*1 || 0; this.h = h*1 || 0; this.attr({x:this.x, y:this.y, w:this.w, h:this.h}) .collision(); return this; } } ); Crafty.c( "Thing", { init: function() { this.addComponent("2D,Canvas,Color,thing"); }, thing: function(x,y,w,h,col) { this.x = x || 0; this.y = y || 0; this.w = w || 20; this.h = h || 20; this.col = col || "black"; /* Might get usefull later! this.last_position={x:this.x, y:this.y};*/ this.attr({x:this.x, y:this.y, w:this.w, h:this.h}) .color(col); return this; } } ); /* Crafty.c( "Creature", { init: function() { this.addComponent*/ Crafty.c( "Player", { init: function() { this.addComponent("Thing,Fourway,Draggable,Collision,WiredHitBox,player");}, player: function(x,y,w,h,col) { this.h = h || 40; this.w = w || 40; this.thing(x,y,w,h,col) .collision() .fourway(4) .onHit("wall",function() { this.stopDrag(); }); return this; } } ); var wall = []; wall.push(Crafty.e("Wall").wall(240,0,10,250)); wall.push(Crafty.e("Wall").wall(0,240,240,10)); wall.push(Crafty.e("Wall").wall(0,0,10,240)); wall.push(Crafty.e("Wall").wall(10,0,230,10)); var player = []; player.push(Crafty.e("Player").player(40,40,40,40,'red')); player.push(Crafty.e("Player").player(100,100,30,30,'blue')); /* var fig=Crafty.e('Collision, 2D, Canvas, Color,Fourway,Draggable,WiredHitBox,Mouse,player') .attr({x: 20, y: 20, w: 100, h: 100}) .color('#F00') .fourway(4) .collision() .onHit("wall",function() { this.stopDrag(); });*/ }