entityjs 0.2.2 → 0.3.0

data/src/{entityjs/math → math}/drag.js

@@ -1,39 +1,45 @@
-/*
-The drag component adds functions to move points
-in relation to its starting postion.
-*/
-re.c('drag')
-.inherit({
-	posX:0,
-	posY:0,
-	
-	dragX:0,
-	dragY:0,
-	
-	dragging:false
-})
-.extend({
-	
-	startDrag:function(x, y){
-		if(!this.dragging){
-			this.dragging = true;
-			this.dragX = x;
-			this.dragY = y;
-		}
-	},
-	
-	endDrag:function(){
-		this.dragging = false;
-	},
-	
-	updateDrag:function(x, y){
-		if(this.dragging){
-			this.posX += x - this.dragX;
-			this.posY += y - this.dragY;
-			
-			this.dragX = x;
-			this.dragY = y;
-		}
-	}
-	
+/*
+The drag component adds functions to move points
+in relation to its starting postion.
+*/
+re.c('drag')
+.defaults({
+	posX:0,
+	posY:0,
+	
+	dragX:0,
+	dragY:0,
+	
+	dragging:false
+})
+.defines({
+	
+	dragStart:function(x, y){
+		if(!this.dragging){
+			this.dragging = true;
+			this.dragX = x;
+			this.dragY = y;
+      this.trigger('drag:start');
+		}
+    return this;
+	},
+	
+	dragEnd:function(){
+		this.dragging = false;
+    return this.trigger('drag:end');
+	},
+	
+	dragUpdate:function(x, y){
+		if(this.dragging){
+			this.posX += x - this.dragX;
+			this.posY += y - this.dragY;
+			
+			this.dragX = x;
+			this.dragY = y;
+      
+      this.trigger('drag:update');
+		}
+    return this;
+	}
+	
 });

data/src/math/force.js

@@ -0,0 +1,143 @@
+/*
+The Force component adds velocity, acceleration and other physical properties to an entity.
+
+This does not implement collision detection! This allows an entity to move fluidly
+through 2d, with gravity, and friction.
+
+You can add hit collision check by defining a hitmap. Like so:
+
+var mountainHits = re.e('hitmap');
+
+re.e('force')
+.attr(hitmap:mountainHits);
+
+//or define a hitmap for all physics objects
+re.hitmap = re.e('hitmap');
+
+var e = re.e('force');
+
+e.hitmap == re.hitmap //true
+
+Warning - this component is not delta time safe. It assumes a fixed timestep.
+*/
+re.force = re.c('force')
+.requires('update')
+.statics({
+    graX:0,
+    graY:0
+})
+.defaults({
+    
+    posX:0,
+    posY:0,
+    
+    velX:0,
+    velY:0,
+    
+    friX:0.4,
+    friY:0.4,
+    
+    accX:0,
+    accY:0,
+    
+    resX:0.4,
+    resY:0.4,
+    
+    mass:1
+    
+})
+.namespaces({
+    
+    update:function(){
+        
+        this.velX = this.force(this.velX, this.accX, this.friX, this.graX, this.mass);
+        this.velY = this.force(this.velY, this.accY, this.friY, this.graY, this.mass);
+        
+        //check collisions and get result
+        if(this.hitmap){
+            
+            this.aftermath(this.hitmap.checkHit(this));
+            
+        } else {
+            
+            this.aftermath(this.posX + this.velX, this.posY + this.velY);
+        }
+        
+    }
+    
+})
+.defines({
+    
+    aftermath:function(posx, posy, hitx, hity, tarx, tary){
+        
+        if(re.is(posx, 'object')){
+            hitx = posx.hitX;
+            hity = posx.hitY;
+            
+            tarx = posx.tarX;
+            tary = posx.tarY;
+            
+            posy = posx.posY;
+            posx = posx.posX;
+        }
+        
+        this.posX = posx;
+        this.posY = posy;
+        
+        if(hitx){
+            this.velX = this.forceRes(this.velX, this.resX);
+        }
+        
+        if(hity){
+            this.velY = this.forceRes(this.velY, this.resY);
+        }
+        
+        return this.trigger('aftermath', hitx, hity, tarx, tary);
+    },
+    
+    forceRes:function(vel, res){
+        return vel * -res;
+    },
+    
+    forceGra:function(gra, mas){
+        return gra * mas;
+    },
+    
+    forceVel:function(vel, acc, fri){
+        return (vel + acc) * fri;
+        
+    },
+    
+    force:function(vel, acc, fri, gra, mas){
+        
+        var v = this.forceVel(vel, acc, fri) + this.forceGra(gra, mas);
+        
+        if(Math.abs(v) < 0.01){
+            v = 0;
+        }
+        
+        return v;
+    },
+    
+    isIdle:function(offset){
+      offset = offset || 0;
+        return Math.abs(this.velY + this.velX + this.accX + this.accY) <= offset;
+    }
+    
+})
+.init(function(c){
+    
+    //setup defaults
+    this.def({
+      hitmap:re.hitmap,
+      graX:c.graX,
+      graY:c.graY
+    });
+    
+    this.on('update', this.force_update);
+})
+.dispose(function(){
+    
+    this.off('update', this.force_update);
+    
+});

data/src/math/hit.js

@@ -0,0 +1,32 @@
+re.c('hit')
+.defaults({
+	
+	posX:0,
+	posY:0,
+	
+	sizeX:1,
+	sizeY:1,
+	
+	/*
+	checks if the two targets intersect with each other.
+	
+	k.hit(x, y, width, height);
+	
+	*/
+	hit:function(x, y, w, h){
+    if(re.is(x, 'object')){
+      y = x.posY || x.y;
+      w = x.sizeX || x.w;
+      h = x.sizeY || x.h;
+      x = x.posX || x.x;
+    }
+		return !
+		(
+		x > this.posX + this.sizeX ||
+		x + w < this.posX ||
+		y > this.posY + this.sizeY ||
+		y + h < this.posY
+		);
+	}
+	
+});

data/src/math/hitmap.js

@@ -0,0 +1,167 @@
+/*
+
+The hitmap component is used for collision detection in a tile-based game.
+This can be sent to a physics entity and it will recieve checks if it hits
+a tile.
+
+Creating this bind system will allow other developers to easily implement
+their own hit collision system.
+*/
+re.c('hitmap')
+.requires('automap')
+.defines({
+
+    hitValue:1,
+    
+    checkAxisX:function(value, x, y, vx, vy){
+        
+        return value == this.hitValue;
+        
+    },
+    
+    checkAxisY:function(value, x, y, vx, vy){
+        return value == this.hitValue;
+    },
+    
+    checkHit:function(posX, posY, velX, velY, bodX, bodY, padX, padY){
+        if(re.is(posX,'object')){
+            velX = posX.velX;
+            velY = posX.velY;
+            
+            bodX = posX.bodyX || posX.sizeX;
+            bodY = posX.bodyY || posX.sizeY;
+            
+            padX = posX.padX || 0;
+            padY = posX.padY || 0;
+            
+            posY = posX.posY;
+            posX = posX.posX;
+        }
+        
+        /*
+        Can also include tarX, tarY.
+        They contain the target positions of the hit.
+        Useful information to calculate which axis was hit
+        */
+        var res = {
+            posX:posX,
+            posY:posY
+        };
+        
+        var step = (Math.max(Math.abs(velX), Math.abs(velY)) / ((re.tile.sizeX + re.tile.sizeY) * 0.5) + 0.5) | 0;
+        
+        if(step > 1) {
+            var sx = velX / step;
+            var sy = velY / step;
+            
+            for(var i=0; i<step && (sx || sy); i++) {
+                
+                this.hitmap_step(res, posX, posY, sx, sy, bodX, bodY, padY, padY);
+                
+                if(res.hitX) {
+                    sx = 0;
+                }
+                
+                if(res.hitY) {
+                    sy = 0;
+                }
+            }
+            
+        } else {
+            
+            this.hitmap_step(res, posX, posY, velX, velY, bodX, bodY, padX, padY);
+            
+        }
+        
+        return res;
+    }
+    
+})
+.namespaces({
+    
+    /*
+    TODO:
+    refactor
+    possibly utilize entity methods for more robust calculations.
+    */
+    step:function(res, x, y, vx, vy, width, height, padx, pady){
+    
+        res.posX += vx;
+        res.posY += vy;
+        
+        var t, ty, tx;
+        
+        if(vx) {
+            
+            t = re.tile.sizeX;
+            
+            var offsetx = (vx > 0 ? width - padx : padx);
+            
+            var firsty = Math.floor((y + pady)/ t);
+            var lasty = Math.ceil((y + height - pady) / t);
+            
+            tx = Math.floor((x + vx + offsetx) / t);
+            
+            var offx = (vx < 0 ? t : 0);
+            //is inside
+            if(tx >= 0 && tx < this.lenX && lasty >= 0 && firsty < this.lenY) {
+                
+                for(ty = firsty; ty<lasty; ty++){
+                    
+                    if(this.map[ty]){
+                        
+                        this.trigger('hit', this.map[ty][tx], tx, ty);
+                        
+                        if(this.checkAxisX(this.map[ty][tx], x, y, vx, vy)) {
+                            res.hitX = true;
+                            res.posX = tx * t + offx  - offsetx;
+                            res.tarX = tx * t;
+                            res.tarY = ty * t;
+                            break;
+                        }
+                    }
+                    
+                }
+                
+            }
+            
+        }
+        
+        if(vy) {
+            t = re.tile.sizeY;
+            
+            var offsety = (vy > 0 ? height -pady : pady);
+            
+            var firstx = Math.floor((res.posX + padx) / t);
+            var lastx = Math.ceil((res.posX + width - padx) / t);
+            ty = Math.floor((y + vy + offsety) / t);
+            
+            var offy = (vy < 0 ? t : 0);
+            // Still inside this collision map?
+            if(ty >= 0 && ty < this.lenY && lastx >= 0 && firstx< this.lenX) {
+                    
+                for(tx = firstx; tx<lastx; tx++) {
+                    
+                    if(this.map[ty]){
+                        
+                        this.trigger('hit', this.map[ty][tx], tx, ty);
+                        
+                        if(this.checkAxisY(this.map[ty][tx], x, y, vx, vy)) {
+                            res.hitY = true;
+                            res.posY = ty * t + offy - offsety;
+                            res.tarX = tx * t;
+                            res.tarY = ty * t;
+                            break;
+                        }
+                    }
+                    
+                }
+            }
+            
+            
+            
+        }
+        
+    }
+    
+});

data/src/math/limit.js

@@ -0,0 +1,37 @@
+/*
+The limit component constraints a value inside a range.
+
+This can be useful for maps, characters, enemies, boxes etc..
+
+re.e('limit bitmap char.png')
+.limit('posX', 0, 10) //limits to 0-10
+.limit('health', 0) //minimum 0
+
+//maybe in the future..
+//.limit('name', 'ben', 'roger', 'bob') //limits name to one of these
+//.limit('name', ['yep', 'beb'])
+//.limit('type, [0, 10, 13])
+*/
+
+re.c('limit')
+.defines('limit',
+function(prop){
+
+    var c = arguments;
+    //if(re.is(min, 'array')) c = min;
+    
+    //if(re.is(c[1], 'number')){
+        if(this[prop] < c[1]){
+            this[prop] = c[1];
+        } else if(re.is(c[2]) && this[prop] > c[2]){
+            this[prop] = c[2];
+        }
+    /*} else {
+        
+        for(var i=1; i<c.length; i++){
+            if(this[prop] == c[i]) return this;
+        }
+        this[prop] = c[1];
+    }*/
+    return this;
+});

data/src/math/point.js

@@ -0,0 +1,40 @@
+/*
+The point component definess an entity that has a 2d position in space.
+This can be used for 2d calculations or most commonly 2d sprite positioning.
+
+*/
+
+re.c('point')
+.defaults({
+    
+    posX:0,
+    posY:0
+    
+})
+.defines({
+    
+    pos:function(x, y){
+        if(re.is(x,'object')){
+            y = x.posY || x.y;
+            x = x.posX || x.x;
+        }
+        
+        this.posX = x;
+        this.posY = y;
+        
+        return this;
+    },
+    
+    distanceTo:function(x, y){
+        if(re.is(x,'object')){
+            y = x.posY || x.y;
+            x = x.posX || x.x;
+        }
+        var kx, ky;
+        kx = x - this.posX;
+        ky = y - this.posY;
+        
+        return Math.sqrt(kx*kx + ky*ky) + 0.5 | 0;
+    }
+    
+});

data/src/math/tile.js

@@ -0,0 +1,109 @@
+/*
+The tile component adds tile positioning functions and helper functions for tile based games.
+
+@usage
+
+//set tile size
+re.tile.sizeX = 40;
+re.tile.sizeY = 40;
+
+//convert mouse coordinates to a tile position..
+var mouse = {x:10, y:234};
+
+re.tile.toX(mouse.x) // 0
+re.tile.toY(mouse.y) 
+
+//create tile
+var tile = re.e('tile sprite tiles.png')
+.tile(2, 4);
+
+tile.posX // 2 * re.tile.sizeX == 80
+tile.posY // 4 * re.tile.sizeY == 160
+
+//create a bunch of tiles from a map
+
+var map = 
+[
+[1,2,4,5,0,3,4,5,6,7],
+[1,2,4,5,0,3,4,5,6,7],
+[1,2,4,5,0,3,4,5,6,7],
+[1,2,4,5,0,3,4,5,6,7]
+];
+
+re.e('tile sprite tiles.png', map.length * map[0].length)
+.tilemap(map.length[0].length,function(x, y){
+  this.tile(x, y);
+  this.frame(map[y][x]);
+});
+
+
+*/
+re.tile = re.c('tile')
+.statics({
+    sizeX:40,
+    sizeY:40,
+    
+    toX:function(x, size){
+        size = size || this.sizeX;
+        return this.toTileX(x, size) * size;
+    },
+    
+    toY:function(y, size){
+      size = size || this.sizeY;
+        return this.toTileY(y, size) * size;
+    },
+    
+    //converts the given coordinate to a tile position
+    toTileX:function(x, size){
+        size = size || this.sizeX;
+        return (x - size * 0.5) / size + 0.5 | 0
+    },
+    
+    toTileY:function(y, size){
+        size = size || this.sizeY;
+        return (y - size * 0.5) / size + 0.5 | 0
+    }
+    
+})
+.defaults({
+    
+    posX:0,
+    posY:0
+    
+})
+.init(function(){
+  this.def({
+    sizeX:re.tile.sizeX,
+    sizeY:re.tile.sizeY
+  });
+  
+})
+.defines({
+
+    tile:function(x, y){
+      if(re.is(x,'object')){
+        y = x.posY || x.y;
+        x = x.posX || x.x;
+      }
+      this.tileX(x);
+      this.tileY(y);
+      return this;
+    },
+    
+    tileX:function(v){
+        if(re.is(v)){
+          this.posX = v * this.sizeX;
+            return this;
+        }
+        return re.tile.toTileX(this.posX, this.sizeX);
+    },
+    
+    tileY:function(v){
+        if(re.is(v)){
+            this.posY = v * this.sizeY; 
+            return this;
+        }
+        return re.tile.toTileY(this.posY, this.sizeY);
+    }
+    
+});

data/src/media/channel.js

@@ -0,0 +1,93 @@
+/*
+The channel component allows you to play a sound component more than
+once at the sametime. This is useful for shooting or fast games.
+
+//create a new channel
+re.e('channel attack.sfx')
+.play()
+.play()
+.play();
+
+//extension sfx is created for every 
+//sound loaded regards of type
+
+//TODO
+
+//add more channels
+
+        //cloning glitch fix
+        document.body.appendChild(s);
+        
+        s.addEventListener('canplaythrough', function(e){
+            
+            //multiple channels will allow the sound to be played more at the sametime.
+            //this will load the sound multiple times sadly FIX
+            for(var i=0; i<re.load.maxChannels-1; i++){
+                channels.push(s.cloneNode(true));
+            }
+            
+            if(that._p){
+                that._p.call(that, that.current, that.total, a);
+            }
+            
+            if(that.current >= that.total){
+                
+                if(that._s){
+                    that._s.call(that, that.assets);
+                }
+                
+            }
+            
+        }, false);
+*//*
+re.channel = re.c('channel')
+.requires('sound')
+.defaults({
+    volume:1,
+    max:3
+})
+.defines({
+
+    play:function(loop){
+        if(!this.channels || !re.sound.enabled) return this;
+        
+        var c;
+        for(var i=0; i<this.channels.length; i++){
+            
+            c = this.channels[i];
+            if(c.ended || !c.currentTime){
+                //play new channel
+                c.play();
+                break;
+            } else if(i == this.channels[i].length-1){
+                c.currentTime = 0;
+                c.play();
+            }
+            
+        }
+        
+        if(loop){
+            
+            var l = 0;
+            
+            c.addEventListener('ended', function(){
+                
+                if(loop == -1 || l >= loop){
+                    this.currentTime = 0;
+                    l++;
+                }
+                
+            }, false);
+            
+        }
+        
+        return this;
+    },
+    
+    stop:function(){
+        
+        //stop all channels
+        
+    }
+    
+});*/

data/src/{entityjs/media → media}/playlist.js

@@ -1,5 +1,5 @@
-/*
-The playlist component allows you to play background music during a game.
-It has methods for adding tracks and playing through them.
-*/
+/*
+The playlist component allows you to play background music during a game.
+It has methods for adding tracks and playing through them.
+*/
 re.c('playlist');