From 1267f415595ffcfb8cffcdf8f4cde7996e0f1b9f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=BCrg=20Lehni?= <juerg@scratchdisk.com>
Date: Wed, 16 Mar 2011 23:32:46 +0100
Subject: [PATCH] Add beginning of ObservedRectangle support and test it in
 animatedStar example.

---
 examples/Animated/animatedStar.html |  1 +
 src/basic/Rectangle.js              | 77 +++++++++++++++++++++++++++++
 src/item/Group.js                   |  3 +-
 src/item/PlacedSymbol.js            |  4 +-
 src/path/CompoundPath.js            |  3 +-
 src/path/Path.js                    |  7 ++-
 6 files changed, 90 insertions(+), 5 deletions(-)

diff --git a/examples/Animated/animatedStar.html b/examples/Animated/animatedStar.html
index 6c764be8..01738e5f 100644
--- a/examples/Animated/animatedStar.html
+++ b/examples/Animated/animatedStar.html
@@ -31,6 +31,7 @@
 			path.smooth();
 			var placedSymbol = new PlacedSymbol(path);
 			placedSymbol.position = center;
+			//placedSymbol.bounds.center = center;
 			layer.appendBottom(placedSymbol);
 		}
 
diff --git a/src/basic/Rectangle.js b/src/basic/Rectangle.js
index ecbd8a1a..4dbdd10f 100644
--- a/src/basic/Rectangle.js
+++ b/src/basic/Rectangle.js
@@ -266,3 +266,80 @@ var Rectangle = this.Rectangle = Base.extend({
 			};
 		}, { beans: true });
 });
+
+var ObservedRectangle = Rectangle.extend({
+	beans: true,
+
+	set: function(x, y, width, height) {
+		this._x = x;
+		this._y = y;
+		this._width = width;
+		this._height = height;
+		if (this._observer)
+			this._observer[this._set](this);
+		return this;
+	},
+
+	// TODO: Use loop to create these?
+	getX: function() {
+		return this._x;
+	},
+
+	setX: function(x) {
+		this._x = x;
+		this._observer[this._set](this);
+	},
+
+	getY: function() {
+		return this._y;
+	},
+
+	setY: function(y) {
+		this._y = y;
+		this._observer[this._set](this);
+	},
+
+	getWidth: function() {
+		return this._width;
+	},
+
+	setWidth: function(width) {
+		this._width = width;
+		this._observer[this._set](this);
+	},
+
+	getHeight: function() {
+		return this._height;
+	},
+
+	setHeight: function(height) {
+		this._height = height;
+		this._observer[this._set](this);
+	},
+
+	// TODO: Implement for all properties on ObservedRectangle using loop
+	setCenter: function(center) {
+		Rectangle.prototype.setCenter.apply(this, center);
+		this._observer[this._set](this);
+		return this;
+	},
+
+	statics: {
+		/**
+		 * Provide a faster creator for Points out of two coordinates that
+		 * does not rely on Point#initialize at all. This speeds up all math
+		 * operations a lot.
+		 */
+		create: function(observer, set, x, y, width, height) {
+			// Don't use the shorter form as we want absolute maximum
+			// performance here:
+			// return new Point(Point.dont).set(x, y);
+			// TODO: Benchmark and decide
+			var rect = new ObservedRectangle(ObservedRectangle.dont).set(x, y,
+					width, height);
+			rect._observer = observer;
+			rect._set = set;
+			return rect;
+		}
+	}
+});
diff --git a/src/item/Group.js b/src/item/Group.js
index 65fd3d2b..2c7af3e8 100644
--- a/src/item/Group.js
+++ b/src/item/Group.js
@@ -43,7 +43,8 @@ var Group = this.Group = Item.extend({
 				y2 = Math.max(rect2.y + rect2.height, y1 + y2 - y1);
 			}
 		}
-		return Rectangle.create(x1, y1, x2 - x1, y2 - y1);
+		return ObservedRectangle.create(this, 'setBounds',
+				x1, y1, x2 - x1, y2 - y1);
 	},
 
 	/**
diff --git a/src/item/PlacedSymbol.js b/src/item/PlacedSymbol.js
index b6819e3b..a50e1f87 100644
--- a/src/item/PlacedSymbol.js
+++ b/src/item/PlacedSymbol.js
@@ -43,7 +43,9 @@ var PlacedSymbol = this.PlacedSymbol = Item.extend({
 	},
 
 	getBounds: function() {
-		return this.symbol._definition.getStrokeBounds(this.matrix);
+		var bounds = this.symbol._definition.getStrokeBounds(this.matrix, true);
+		return ObservedRectangle.create(this, 'setBounds',
+				bounds.x, bounds.y, bounds.width, bounds.height);
 	},
 
 	getStrokeBounds: function() {
diff --git a/src/path/CompoundPath.js b/src/path/CompoundPath.js
index 954021b2..a4672489 100644
--- a/src/path/CompoundPath.js
+++ b/src/path/CompoundPath.js
@@ -42,7 +42,8 @@ var CompoundPath = this.CompoundPath = PathItem.extend({
 				y2 = Math.max(rect2.y + rect2.height, y1 + y2 - y1);
 			}
 		}
-		return Rectangle.create(x1, y1, x2 - x1, y2 - y1);
+		return ObservedRectangle.create(this, 'setBounds',
+				x1, y1, x2 - x1, y2 - y1);
 	},
 
 	/**
diff --git a/src/path/Path.js b/src/path/Path.js
index 6f924154..3528df9c 100644
--- a/src/path/Path.js
+++ b/src/path/Path.js
@@ -650,7 +650,8 @@ var Path = this.Path = PathItem.extend({
 			processSegment(segments[i]);
 		if (that.closed)
 			processSegment(first);
-	    return new Rectangle(min[0], min[1], max[0] - min[0], max[1] - min[1]);
+		return Rectangle.create(min[0], min[1],
+					max[0] - min[0], max[1] - min[1]);
 	}
 
 	function getPenPadding(radius, matrix) {
@@ -703,7 +704,9 @@ var Path = this.Path = PathItem.extend({
 		getBounds: function(/* matrix */) {
 			// Pass the matrix hidden from Bootstrap, so it still inject 
 			// getBounds as bean too.
-			return getBounds(this, arguments[0]);
+			var bounds = getBounds(this, arguments[0]);
+			return ObservedRectangle.create(this, 'setBounds',
+					bounds.x, bounds.y, bounds.width, bounds.height);
 		},
 
 		/**