Proxy

packages/melonjs/src/camera/camera2d.js

@@ -1,7 +1,5 @@
 import Vector2d from "./../math/vector2.js";
 import Vector3d from "./../math/vector3.js";
-import ObservableVector2d from "./../math/observable_vector2.js";
-import ObservableVector3d from "./../math/observable_vector3.js";
 import Matrix2d from "./../math/matrix2.js";
 import Matrix3d from "./../math/matrix3.js";
 import Rect from "./../geometries/rectangle.js";
@@ -322,12 +320,7 @@ export default class Camera2d extends Renderable {
 	follow(target, axis, damping) {
 		if (target instanceof Renderable) {
 			this.target = target.pos;
-		} else if (
-			target instanceof Vector2d ||
-			target instanceof Vector3d ||
-			target instanceof ObservableVector2d ||
-			target instanceof ObservableVector3d
-		) {
+		} else if (target instanceof Vector2d || target instanceof Vector3d) {
 			this.target = target;
 		} else {
 			throw new Error("invalid target for me.Camera2d.follow");

packages/melonjs/src/geometries/ellipse.js

@@ -2,7 +2,7 @@ import pool from "./../system/pooling.js";
 
 /**
  * additional import for TypeScript
- * @import Vector2d from "./../math/vector2.js";
+ * @import Vector3d from "./../math/vector3.js";
  * @import Matrix2d from "./../math/matrix2.js";
  * @import Bounds from "./../physics/bounds.js";
  */
@@ -21,9 +21,9 @@ export default class Ellipse {
 		/**
 		 * the center coordinates of the ellipse
 		 * @public
-		 * @type {Vector2d}
+		 * @type {Vector3d}
 		 */
-		this.pos = pool.pull("Vector2d");
+		this.pos = pool.pull("Vector3d");
 
 		/**
 		 * The bounding rectangle for this shape

packages/melonjs/src/geometries/poly.js

@@ -3,7 +3,7 @@ import { earcut } from "./earcut.js";
 
 /**
  * additional import for TypeScript
- * @import Vector2d from "./../math/vector2.js";
+ * @import Vector3d from "./../math/vector3.js";
  * @import Matrix2d from "./../math/matrix2.js";
  * @import Bounds from "./../physics/bounds.js";
  */
@@ -25,9 +25,27 @@ export default class Polygon {
 	constructor(x = 0, y = 0, points) {
 		/**
 		 * origin point of the Polygon
-		 * @type {Vector2d}
+		 * @type {Vector3}
 		 */
-		this.pos = pool.pull("Vector2d");
+		this.pos = pool.pull("Vector3d");
+		/**
+		 * Proxy to the pos Vector3d object
+		 * @ignore
+		 */
+		this.posProxy = new Proxy(this.pos, {
+			set: (obj, prop, value) => {
+				// only update bounds if x or y has changed (ignore z)
+				if (prop !== "z") {
+					const newX = prop === "x" ? value : obj.x;
+					const newY = prop === "y" ? value : obj.y;
+					this.getBounds().translate(newX - obj.x, newY - obj.y);
+				}
+
+				obj[prop] = value;
+
+				return true;
+			},
+		});
 
 		/**
 		 * Array of points defining the Polygon <br>
@@ -86,8 +104,8 @@ export default class Polygon {
 	 * @returns {Polygon} this instance for objecf chaining
 	 */
 	setShape(x, y, points) {
-		this.pos.set(x, y);
 		this.setVertices(points);
+		this.pos.set(x, y);
 		return this;
 	}
 
@@ -334,7 +352,6 @@ export default class Polygon {
 
 		this.pos.x += _x;
 		this.pos.y += _y;
-		this.getBounds().translate(_x, _y);
 
 		return this;
 	}
@@ -362,7 +379,6 @@ export default class Polygon {
 		}
 		this.pos.x = _x;
 		this.pos.y = _y;
-		this.updateBounds();
 	}
 
 	/**

packages/melonjs/src/index.js

@@ -5,8 +5,6 @@ import "./polyfill/index.ts";
 import Color from "./math/color.js";
 import Vector2d from "./math/vector2.js";
 import Vector3d from "./math/vector3.js";
-import ObservableVector2d from "./math/observable_vector2.js";
-import ObservableVector3d from "./math/observable_vector3.js";
 import Matrix2d from "./math/matrix2.js";
 import Matrix3d from "./math/matrix3.js";
 import Polygon from "./geometries/poly.js";
@@ -101,8 +99,6 @@ export {
 	Color,
 	Vector2d,
 	Vector3d,
-	ObservableVector2d,
-	ObservableVector3d,
 	Matrix2d,
 	Matrix3d,
 	Polygon,
@@ -228,8 +224,6 @@ export function boot() {
 	pool.register("me.ColorLayer", ColorLayer, true);
 	pool.register("me.Vector2d", Vector2d, true);
 	pool.register("me.Vector3d", Vector3d, true);
-	pool.register("me.ObservableVector2d", ObservableVector2d, true);
-	pool.register("me.ObservableVector3d", ObservableVector3d, true);
 	pool.register("me.Matrix2d", Matrix2d, true);
 	pool.register("me.Matrix3d", Matrix3d, true);
 	pool.register("me.Rect", Rect, true);
@@ -258,8 +252,6 @@ export function boot() {
 	pool.register("ColorLayer", ColorLayer, true);
 	pool.register("Vector2d", Vector2d, true);
 	pool.register("Vector3d", Vector3d, true);
-	pool.register("ObservableVector2d", ObservableVector2d, true);
-	pool.register("ObservableVector3d", ObservableVector3d, true);
 	pool.register("Matrix2d", Matrix2d, true);
 	pool.register("Matrix3d", Matrix3d, true);
 	pool.register("Rect", Rect, true);

packages/melonjs/src/level/tiled/TMXTileMap.js

@@ -493,7 +493,7 @@ export default class TMXTileMap {
 					obj.body = new Body(obj, shape);
 					obj.body.setStatic(true);
 					// set the obj z order
-					obj.pos.setMuted(settings.x, settings.y, settings.z);
+					obj.pos.set(settings.x, settings.y, settings.z);
 				} else {
 					// pull the corresponding object from the object pool
 					if (typeof settings.name !== "undefined" && settings.name !== "") {