entityjs 0.3.2 → 0.4.0

data/src/pattern/pathfind.js

@@ -0,0 +1,168 @@
+/*
+The pathfind comp finds a path towards a target position. The .search() method will return
+an int array describing the movements to the target position.
+
+searchNodes() and checkNode() can be overwritten.
+
+//example
+
+//1 is unwalkable
+var map = 
+[
+[0,0,0,1],
+[0,1,0,0]
+]
+
+//automap is helpful for two-dim arrays
+var level = re.e('automap').automap(map);
+
+var path = re.e('pathfind')
+.attr({
+  //this is checked for every tile. Returning false will skip it, making the tile unwalkable.
+  checkNode:function(x, y, parentX, parentY){
+    return level.within(x, y) && level.automap(x, y) == 0;
+  }
+});
+
+//search
+var start = {x:0, y:0};
+var end = {x:2, y:1};
+
+//also called on every tile exactly like checkNode.
+//this can be used for custom spcific pathfinds
+var onCheck = function(x, y, parentX, parentY){
+  return true;
+}
+
+//called when a tile is accepted into path
+var onTile = function(x, y, parentX, parentY, cost){
+  
+}
+
+var ints = path.pathfind(start.x, start.y, end.x, end.y, onCheck, onTile);
+
+//will return a path of ints like so..
+// [x3, y3, x2, y2, x1, y1]
+
+while(ints.length){
+  var y = ints.pop();
+  var x = ints.pop();
+  
+  //move unit to x,y, etc..
+  
+}
+
+*/
+re.pathfind = re.c('pathfind')
+.statics({
+  search:function(){
+    var p = re.e('pathfind');
+    var path = p.pathfind.apply(p, arguments);
+    p.dispose();
+    return path;
+  }
+})
+.defines({
+  
+  pathfind_max:100,
+  
+  pathfind:function(x, y, targetX, targetY, onCheck, onTile){
+    this.targetX = targetX;
+    this.targetY = targetY;
+    
+    this.onCheck = onCheck;
+    this.onTile = onTile;
+    
+    this.visit = {};
+    this.nodes = [];
+    
+    this.addNode(x, y, -1, -1);
+    
+    var n, count = 0;
+    
+    while(this.nodes.length){
+      n = this.nodes.shift();
+      
+      if(n.x == this.targetX && n.y == this.targetY){
+        return this.makePath(n);
+      } else {
+        
+        this.searchNodes(n.x, n.y, n.px, n.py);
+        
+        if(++count >= this.pathfind_max){
+          //limit reached
+          return null;
+        }
+        
+      }
+      
+    }
+    
+    return null;
+  },
+  
+  searchNodes:function(x, y){
+    this.addNode(x+1, y, x, y);
+    this.addNode(x-1, y, x, y);
+    this.addNode(x, y+1, x, y);
+    this.addNode(x, y-1, x, y);
+  },
+  
+  checkNode:function(){
+    return true;
+  },
+  
+  makePath:function(node){
+    var path = [], num=0;
+    
+    do{
+      //starts at target and moves backwards to initial position
+      
+      path[num++] = node.x;
+      path[num++] = node.y;
+      
+      node = this.nodes[node.px+'_'+node.py];
+      
+    } while(node && node.px != -1);
+    
+    return path;
+  },
+  
+  addNode:function(x, y, px, py){
+    
+    if(!this.checkNode(x, y, px, py) || (this.onCheck && !this.onCheck(x, y, px, py))){
+      return false;
+    }
+      
+    var name = x+'_'+y;
+    
+    var cost = re.distance(x, y, this.targetX, this.targetY);
+    
+    if(!this.nodes[name] || this.nodes[name].cost > cost){
+      
+      var n = this.nodes[name] = {x:x, y:y, cost:cost, px:px, py:py};
+      
+      var placed = false;
+      //enter in better cost nodes
+      for(var i=0, l = this.nodes.length; i<l; i++){
+        if(cost < this.nodes[i].cost){
+          this.nodes.splice(i, 0, n);
+          placed = true;
+          break;
+        }
+      }
+      
+      //just push it
+      if(!placed){
+        this.nodes.push(n);
+      }
+      
+      //hook in methods
+      if(this.onTile) this.onTile(x, y, px, py, cost);
+      
+      return true;
+    }
+        
+  }
+  
+});

data/src/pattern/timestep.js

@@ -21,9 +21,12 @@ re.c('timestep')
         
         while(this.stepProgress >= this.stepSize){
             
-            callback.call((context)?context:this);
+            callback.call(context || this);
             
             this.stepProgress -= this.stepSize;
+            
+            //break if stepSize is zero
+            if(!this.stepSize) break;
         }
         
     }

data/src/util/polyfill.js

@@ -12,7 +12,7 @@ re.c('polyfill')
 .run(function(){
 	
 	//setup requestanimationframe on support
-	window.requestAnimFrame = 
+	requestAnimFrame = 
 	window.requestAnimationFrame ||
 	window.webkitRequestAnimationFrame ||
 	window.mozRequestAnimationFrame ||

data/templates/isometric/config.yml

@@ -0,0 +1,22 @@
+# Configure your game settings
+
+width: 500
+height: 400
+canvas-id: game-canvas
+
+#files to ignore in /scripts
+scripts-ignore:
+  
+#specify files to be loaded first in /scripts
+order:
+  
+#components to ignore in the entityjs source
+#reduce file size by ignoring unused components
+entity-ignore:
+  socket
+  wait
+  group
+
+#ignore tests in /tests
+tests-ignore:
+  

data/templates/isometric/readme.txt

@@ -0,0 +1,79 @@
+------------- EntityJS Gem ----------------------
+
+The EntityJS Gem lets you quickly create HTML5 javascript games.
+
+# Directory Structure
+
+## /assets 
+Contains all sounds, images and data files. Place all sounds in the sounds directory
+and all the images in the images directory. These directories will be looked at
+and an asset array will be created for easy asset loading (see scripts/scenes/load.js)
+
+Creating any other directory or placing files in the levels directory will be seen
+as data files and will be read and automatically put in js files.
+
+For example, if I have a directory like /assets/animations/monster.json.
+
+The file will automatically be read upon calling 'entityjs refresh' and will be turned into this:
+
+re.e('monster.json animation')
+.attr(**Animation JSON here**);
+
+Which means you can edit files in different programs and not worry about copying and pasting
+the contents. Just run entityjs refresh.
+
+At the moment JSON, XML and TMX is supported but in the future, YAML, and CSV will be supported.
+TMX is a special XML format for a tile map editor called tiled.
+
+## /builds
+
+Contains assets and minified code for the game.
+
+## /scripts
+
+Contains javascripts for the game.
+
+## /tests
+
+Contains tests for the game. It is good practice to keep this structured exactly the same as the scripts
+directory.
+
+## config.yml
+
+A configuration file in yaml. This can be edited in any text editor.
+
+## readme.txt
+
+Good practice to make one for every game to help other people.
+
+# Commands
+
+## create a new entityjs game
+entityjs new [project_name]
+
+- example
+entityjs new alien_shooter
+
+- create game with arrow_keys template
+entityjs new alien_shooter alien arrow_keys
+
+## create a new component
+entityjs comp [component_name]
+
+- example
+entityjs comp hero
+
+## build game
+entityjs build
+
+Exports game in builds directory
+
+## build game with custom name
+entityjs build release1
+
+## Run server
+entityjs server
+or
+entityjs s
+
+Navigate to localhost:2345 to play the game.

data/templates/isometric/scripts/displays/cursor.js

@@ -0,0 +1,34 @@
+re.c('cursor')
+.requires('isoimage mouse')
+.defines({
+  
+  screenable:true,
+  frameX:2,
+  
+  click:function(x, y){
+    var iso = re.iso.toIso(x, y);
+    
+    console.log(iso.isoX, iso.isoY);
+    
+    var box = re('#box')[0];
+    
+    box.place(iso.isoX, iso.isoY);
+    
+    re.draw.sort();
+  },
+  
+  move:function(x, y){
+    var iso = re.iso.toIso(x, y);
+    
+    this.place(iso.isoX, iso.isoY);
+    
+    re.draw.sort();
+  }
+  
+})
+.init(function(){
+  this.on({
+    'click':this.click,
+    'mousemove':this.move
+  });
+});

data/templates/isometric/scripts/displays/isoimage.js

@@ -0,0 +1,32 @@
+re.c('isoimage')
+.requires('iso sprite isotiles.png')
+.defines({
+  
+  sizeX:51,
+  layer:0,
+  
+  isoHeight:function(){
+    //high tile
+    if(this.frameX == 1){
+      return 10;
+    }
+    return 0;
+  },
+  
+  place:function(x, y){
+    //find the tile height
+    var height = re.currentLevel.tileHeight(x, y);
+    
+    this.iso(x, y, height / re.iso.sizeZ);
+    
+  },
+  
+  depth:function(){
+    return this.posY + this.layer + this.posZ;
+  }
+  
+})
+.init(function(){
+  //pushes tiles up so they are leveled
+  this.regY = this.sizeY - re.iso.sizeY;
+});

data/templates/isometric/scripts/init.js

@@ -0,0 +1,7 @@
+re.ready(function(){
+  
+  re.sys.init(re.canvas).start();
+  
+  re.scene('load').enter();
+  
+});

data/templates/isometric/scripts/levels/level.js

@@ -0,0 +1,55 @@
+re.c('level')
+.requires('automap')
+.defines({
+  
+  setup:function(){
+    
+    re.iso.sizeX = 25;
+    re.iso.sizeY = 25;
+    re.iso.sizeZ = 25;
+    
+    //setups layers for objects on the same tile
+    re.draw.cursor = 1;
+    re.draw.box = 2;
+    
+    for(var y=0; y<this.map.length; y++){
+      for(var x=0; x<this.map[0].length; x++){
+        
+        var e = re.e('isoimage');
+        
+        var tile = this.map[y][x];
+        
+        if(tile == 1){
+          e.frame(1);
+          e.sizeY = 35;
+        }
+        
+        e.iso(x, y);
+        
+        //place in map
+        this.automap(x, y, e);
+      }
+    }
+    
+    this.cursor = re.e('cursor')
+    .attr('layer', re.draw.cursor);
+    
+    this.box = re.e('isoimage')
+    .attr({
+      id:'box',
+      frameX:3,
+      layer:re.draw.box,
+      place:[0,0]
+    });
+    
+  },
+  
+  tileHeight:function(x, y){
+    var tile =  this.automap(x, y);
+    if(!tile){
+      return 0;
+    }
+    return tile.isoHeight();
+  }
+  
+})

data/templates/isometric/scripts/levels/level1.js

@@ -0,0 +1,11 @@
+re.e('level')
+.attr({
+  map:[
+  [1,1,0,0,0,0],
+  [0,0,0,0,0,0],
+  [0,0,0,0,0,0],
+  [0,0,0,0,0,0],
+  [0,0,0,0,0,0],
+  [0,0,1,1,1,1]
+  ]
+});