Everything has an explicit width (Even if its 0), and renamed getters/setters for x/y to left/top

examples/fire/fire.js

@@ -52,18 +52,18 @@ class FireParticle extends MomentumEngine.Classes.Entity {
     render () {
 
         var gradient = this._game.context.createRadialGradient(
-            this._relativePos.x + fireParticleWidth / 2,
+            this.relativeLeft + fireParticleWidth / 2,
-            this._relativePos.y + fireParticleHeight / 2,
+            this.relativeTop + fireParticleHeight / 2,
             fireParticleWidth / 10,
-            this._relativePos.x + fireParticleWidth / 2,
+            this.relativeLeft + fireParticleWidth / 2,
-            this._relativePos.y + fireParticleHeight / 2,
+            this.relativeTop + fireParticleHeight / 2,
             fireParticleWidth / 2
         );
 
         gradient.addColorStop(0, this.startColor.toString());
         gradient.addColorStop(1, "rgba(0, 0, 0, 0)");
         this._game.context.fillStyle = gradient;
-        this._game.context.fillRect(this._relativePos.x, this._relativePos.y, fireParticleWidth, fireParticleHeight);
+        this._game.context.fillRect(this.relativeLeft, this.relativeTop, fireParticleWidth, fireParticleHeight);
 
         return true;
 

examples/pong/pong.js

@@ -51,11 +51,11 @@ window.onload = function () {
 
         this.pos.add(this.state.speed.clone().multiply(delta));
 
-        if ((this.pos.x + baseSize > width && this.state.speed.x > 0) || (this.pos.x < 0 && this.state.speed.x < 0)) {
+        if ((this.left + baseSize > width && this.state.speed.x > 0) || (this.left < 0 && this.state.speed.x < 0)) {
             this.state.speed.x = -this.state.speed.x;
         }
 
-        if ((this.pos.y + baseSize > height && this.state.speed.y > 0) || (this.pos.y < 0 && this.state.speed.y < 0)) {
+        if ((this.top + baseSize > height && this.state.speed.y > 0) || (this.top < 0 && this.state.speed.y < 0)) {
             this.state.speed.y = -this.state.speed.y;
         }
 
@@ -73,12 +73,12 @@ window.onload = function () {
             leftPaddle.pos.y += (0.5 * delta);
         }
 
-        if (leftPaddle.pos.y > height - (baseSize * 8)) {
+        if (leftPaddle.top > height - (baseSize * 8)) {
-            leftPaddle.pos.y = height - (baseSize * 8);
+            leftPaddle.top = height - (baseSize * 8);
         }
 
-        if (leftPaddle.pos.y < baseSize) {
+        if (leftPaddle.top < baseSize) {
-            leftPaddle.pos.y = baseSize;
+            leftPaddle.top = baseSize;
         }
 
         if (leftPaddle.isCollidingWith(ball) && ball.state.speed.x < 0) {
@@ -99,11 +99,11 @@ window.onload = function () {
             rightPaddle.pos.y += (0.5 * delta);
         }
 
-        if (rightPaddle.pos.y > height - (baseSize * 8)) {
+        if (rightPaddle.pos.top > height - (baseSize * 8)) {
             rightPaddle.pos.y = height - (baseSize * 8);
         }
 
-        if (rightPaddle.pos.y < baseSize) {
+        if (rightPaddle.pos.top < baseSize) {
             rightPaddle.pos.y = baseSize;
         }
 

examples/snowflakes/snowflakes.js

@@ -45,14 +45,14 @@ window.onload = function () {
             var newSnowflake = new MomentumEngine.Classes.Sprite(startPos, -100, 100, 100, snowflakeImg);
 
             newSnowflake.update = function () {
-                this.pos.y = this.pos.y + (delta * 0.06);
+                this.top = this.top + (delta * 0.06);
             };
 
             mainScene.addChildEntity(newSnowflake);
 
             mainScene.children.forEach(function (oldSnowflake) {
 
-                if (oldSnowflake.pos.y > height) {
+                if (oldSnowflake.top > height) {
                     // Clean up snowflakes that are no longer visible
                     mainScene.detachChildEntity(oldSnowflake);
                 }

src/classes/emitter.js

@@ -43,7 +43,7 @@ class Emitter extends Entity {
             velocity = Vector2D.fromAngle(angle, magnitude);
 
         // NK: This might cause a bug where child renders have an incorrect position because preprocess should normally be called after the update function but before the render, here it is before update. We'll see.
-        let particle = new ParticleClass(this.relativeX, this.relativeY);
+        let particle = new ParticleClass(this.relativeLeft, this.relativeTop);
         particle.velocity = velocity;
         Utils.mergeIntoArray(particle.fields, this.particleFields);
 

src/classes/entity.js

@@ -10,6 +10,7 @@ class Entity {
         this.pos = new Vector2D(x || 0, y || 0);
         this.velocity = new Vector2D(0, 0);
         this.acceleration = new Vector2D(0, 0);
+        this.size = new Vector2D(0, 0);
 
         this.fields = [];
 
@@ -26,34 +27,54 @@ class Entity {
     }
 
 
-    get x () {
+    get left () {
         return this.pos.x;
     }
 
-    set x (val) {
+    set left (val) {
         return this.pos.x = val;
     }
 
 
-    get y () {
+    get top () {
         return this.pos.y;
     }
 
-    set y (val) {
+    set top (val) {
         return this.pos.y = val;
     }
 
 
-    get relativeX () {
+    get relativeLeft () {
         return this._calculateRelativePos().x;
     }
 
 
-    get relativeY () {
+    get relativeTop () {
         return this._calculateRelativePos().y;
     }
 
 
+    get width () {
+        return this.size.x;
+    }
+
+
+    set width (width) {
+        return this.size.x = width;
+    }
+
+
+    get height () {
+        return this.size.y;
+    }
+
+
+    set height (height) {
+        return this.size.y = height;
+    }
+
+
     setVelocity (x, y) {
 
         if (x instanceof Vector2D) {
@@ -130,12 +151,12 @@ class Entity {
 
             if (this._parent) {
 
-                this._relativePos.x = this.x + this._parent.relativeX;
+                this._relativePos.x = this.pos.x + this._parent.relativeLeft;
-                this._relativePos.y = this.y + this._parent.relativeY;
+                this._relativePos.y = this.pos.y + this._parent.relativeTop;
 
             } else {
-                this._relativePos.x = this.x;
+                this._relativePos.x = this.pos.x;
-                this._relativePos.y = this.y;
+                this._relativePos.y = this.pos.y;
             }
 
             this._lastCalculated = this._game.frameCounter;
@@ -168,8 +189,8 @@ class Entity {
 
             // NK: These call _relativePos, I don't like using this outside of the render method...
             let vector = new Vector2D(
-                field.relativeX - this.relativeX,
+                field.relativeLeft - this.relativeLeft,
-                field.relativeY - this.relativeY
+                field.relativeTop - this.relativeTop
             );
 
             let force = field.mass / Math.pow(vector.dot(vector), 1.5);

src/classes/rect.js

@@ -13,7 +13,8 @@ class Rect extends Entity {
 
         super(x, y);
 
-        this.size = new Vector2D(width, height);
+        this.size.x = width || 0;
+        this.size.y = height || 0;
         this.color = color;
 
     }
@@ -33,7 +34,7 @@ class Rect extends Entity {
         if (this._game) {
 
             this._game.context.fillStyle = this.color.toString();
-            this._game.context.fillRect(this.relativeX, this.relativeY, this.size.x, this.size.y);
+            this._game.context.fillRect(this.relativeLeft, this.relativeTop, this.width, this.height);
 
             return true;
 

src/classes/sprite.js

@@ -18,7 +18,8 @@ class Sprite extends Entity {
 
         super(x, y);
 
-        this.size = new Vector2D(width || 0, height || 0);
+        this.size.x = width || 0;
+        this.size.y = height || 0;
 
         this._image = image;
         this._imagePos = new Vector2D(0, 0);
@@ -57,10 +58,10 @@ class Sprite extends Entity {
                 this._imagePos.y,
                 this._imageSize.x || subWidth,
                 this._imageSize.y || subHeight,
-                this.relativeX,
+                this.relativeLeft,
-                this.relativeY,
+                this.relativeTop,
-                this.size.x || subWidth,
+                this.width || subWidth,
-                this.size.y || subHeight
+                this.height || subHeight
             );
 
             return true;

src/libs/collisionmethods.js

@@ -9,10 +9,12 @@ class CollisionMethods {
             throw new Error("AABB collisions can only be checked on these entity types: Rect");
         }
 
-        return (entity1.x < entity2.x + entity2.size.x &&
+        let colliding = (entity1.left < entity2.left + entity2.width &&
-            entity1.x + entity1.size.x > entity2.x &&
+            entity1.left + entity1.width > entity2.left &&
-            entity1.y < entity2.y + entity2.size.y &&
+            entity1.top < entity2.top + entity2.height &&
-            entity1.size.y + entity1.y > entity2.y);
+            entity1.height + entity1.top > entity2.top);
+
+        return colliding;
 
     }