Move more getter / setter injection functionality from PathStyle to Style, to be shared among all Style classes.

src/item/ChangeFlag.js

@@ -38,7 +38,7 @@ var ChangeFlag = {
 var Change = {
 	HIERARCHY: ChangeFlag.HIERARCHY | ChangeFlag.APPEARANCE,
 	GEOMETRY: ChangeFlag.GEOMETRY | ChangeFlag.APPEARANCE,
-	STROKE: ChangeFlag.STROKE | ChangeFlag.APPEARANCE,
+	STROKE: ChangeFlag.STROKE | ChangeFlag.STYLE | ChangeFlag.APPEARANCE,
 	STYLE: ChangeFlag.STYLE | ChangeFlag.APPEARANCE,
 	ATTRIBUTE: ChangeFlag.ATTRIBUTE | ChangeFlag.APPEARANCE,
 	CONTENT: ChangeFlag.CONTENT | ChangeFlag.APPEARANCE

src/item/PathStyle.js

@@ -14,13 +14,12 @@
  * All rights reserved.
  */
 
-var PathStyle = this.PathStyle = Style.extend(new function() {
+var PathStyle = this.PathStyle = Style.extend({
+	/** @lends PathStyle# */
+
 	// windingRule / resolution / fillOverprint / strokeOverprint are currently
-	// not supported. The full list of properties would be:
+	// not supported.
-	//	['windingRule', 'resolution', 'strokeColor', 'strokeWidth',
+	_defaults: {
-	//		'strokeCap', 'strokeJoin', 'miterLimit', 'dashOffset','dashArray',
-	//		'strokeOverprint', 'fillColor', 'fillOverprint'],
-	var defaults = {
 		fillColor: undefined,
 		strokeColor: undefined,
 		strokeWidth: 1,
@@ -29,80 +28,18 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 		miterLimit: 10,
 		dashOffset: 0,
 		dashArray: []
-	};
+	},
-
+	_flags: {
-	var strokeFlags = {
+		strokeWidth: Change.STROKE,
-		strokeWidth: true,
+		strokeCap: Change.STROKE,
-		strokeCap: true,
+		strokeJoin: Change.STROKE,
-		strokeJoin: true,
+		miterLimit: Change.STROKE
-		miterLimit: true
+	},
-	};
-
-	return Base.each(defaults, function(value, key) {
-		var isColor = !!key.match(/Color$/),
-			part = Base.capitalize(key),
-			set = 'set' + part,
-			get = 'get' + part;
-
-		this[set] = function(value) {
-			var children = this._item && this._item._children;
-			value = isColor ? Color.read(arguments) : value;
-			if (children) {
-				for (var i = 0, l = children.length; i < l; i++)
-					children[i]._style[set](value);
-			} else {
-				var old = this['_' + key];
-				if (old != value && !(old && old.equals && old.equals(value))) {
-					this['_' + key] = value;
-					if (isColor) {
-						if (old)
-							old._removeOwner(this._item);
-						if (value)
-							value._addOwner(this._item);
-					}
-					if (this._item) {
-						this._item._changed(Change.STYLE
-								| (strokeFlags[key] ? Change.STROKE : 0));
-					}
-				}
-			}
-			return this;
-		};
-
-		this[get] = function() {
-			var children = this._item && this._item._children,
-				style;
-			// If this item has children, walk through all of them and see if
-			// they all have the same style.
-			if (children) {
-				for (var i = 0, l = children.length; i < l; i++) {
-					var childStyle = children[i]._style[get]();
-					if (!style) {
-						style = childStyle;
-					} else if (style != childStyle && !(style && style.equals
-							&& style.equals(childStyle))) {
-						// If there is another item with a different style,
-						// the style is not defined:
-						// PORT: Change this in Scriptographer
-						// (currently returns null)
-						return undefined;
-					}
-				}
-				return style;
-			} else {
-				return this['_' + key];
-			}
-		};
-	}, {
-		_defaults: defaults,
 	_owner: Item,
 	_style: '_style'
-	});
-});
 
-// TODO: See if these still show up?
+	// DOCS: why isn't the example code showing up?
-// DOCS: why isn't the example code showing up?
+	/**
-/**
 	 * PathStyle objects don't need to be created directly. Just pass an
 	 * object to {@link Item#style} or {@link Project#currentStyle}, it will
 	 * be converted to a PathStyle object internally.
@@ -131,7 +68,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * var path = new Path.Circle(new Point(80, 50), 30);
 	 * path.style = circleStyle;
 	 */
-/**
+	/**
 	 * {@grouptitle Stroke Style}
 	 * 
 	 * The color of the stroke.
@@ -151,7 +88,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * circle.strokeColor = new RGBColor(1, 0, 0);
 	 */
 
-/**
+	/**
 	 * The width of the stroke.
 	 * 
 	 * @property
@@ -173,7 +110,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * circle.strokeWidth = 10;
 	 */
 
-/**
+	/**
 	 * The shape to be used at the end of open {@link Path} items, when they
 	 * have a stroke.
 	 * 
@@ -206,7 +143,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * line2.strokeCap = 'butt';
 	 */
 
-/**
+	/**
 	 * The shape to be used at the corners of paths when they have a stroke.
 	 * 
 	 * @property
@@ -235,7 +172,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * path3.strokeJoin = 'bevel';
 	 */
 
-/**
+	/**
 	 * The dash offset of the stroke.
 	 * 
 	 * @property
@@ -244,7 +181,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * @type Number
 	 */
 
-/**
+	/**
 	 * Specifies an array containing the dash and gap lengths of the stroke.
 	 * 
 	 * @example {@paperscript}
@@ -261,7 +198,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * @type Array
 	 */
 
-/**
+	/**
 	 * The miter limit of the stroke.
 	 * When two line segments meet at a sharp angle and miter joins have been
 	 * specified for {@link #strokeJoin}, it is possible for the miter to extend
@@ -274,7 +211,7 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * @type Number
 	 */
 
-/**
+	/**
 	 * {@grouptitle Fill Style}
 	 * 
 	 * The fill color.
@@ -293,3 +230,4 @@ var PathStyle = this.PathStyle = Style.extend(new function() {
 	 * // Set the fill color of the circle to RGB red:
 	 * circle.fillColor = new RGBColor(1, 0, 0);
 	 */
+});

src/item/Style.js

@@ -19,7 +19,6 @@
  * PargraphStyle.
  */
 var Style = Item.extend({
-
 	initialize: function(style) {
 		// If the passed style object is also a Style, clone its clonable
 		// fields rather than simply copying them.
@@ -44,17 +43,69 @@ var Style = Item.extend({
 			// Inject style getters and setters into the 'owning' class, which
 			// redirect calls to the linked style objects through their internal
 			// property on the instances of that class, as defined by _style.
-			var style = src._style;
+			var styleKey = src._style,
+				flags = src._flags || {};
 			src._owner.inject(Base.each(src._defaults, function(value, key) {
-				var part = Base.capitalize(key),
+				var isColor = !!key.match(/Color$/),
+					part = Base.capitalize(key),
 					set = 'set' + part,
 					get = 'get' + part;
+				// Simply extend src with these getters and setters, to be
+				// injected into this class using this.base() further down.
+				src[set] = function(value) {
+					var children = this._item && this._item._children;
+					value = isColor ? Color.read(arguments) : value;
+					if (children) {
+						for (var i = 0, l = children.length; i < l; i++)
+							children[i][styleKey][set](value);
+					} else {
+						var old = this['_' + key];
+						if (old != value && !(old && old.equals
+									&& old.equals(value))) {
+							this['_' + key] = value;
+							if (isColor) {
+								if (old)
+									old._removeOwner(this._item);
+								if (value)
+									value._addOwner(this._item);
+							}
+							if (this._item)
+								this._item._changed(flags[key] || Change.STYLE);
+						}
+					}
+					return this;
+				};
+				src[get] = function() {
+					var children = this._item && this._item._children,
+						style;
+					// If this item has children, walk through all of them and
+					// see if they all have the same style.
+					if (!children)
+						return this['_' + key];
+					for (var i = 0, l = children.length; i < l; i++) {
+						var childStyle = children[i][styleKey][get]();
+						if (!style) {
+							style = childStyle;
+						} else if (style != childStyle && !(style
+								&& style.equals && style.equals(childStyle))) {
+							// If there is another item with a different
+							// style, the style is not defined:
+							// PORT: Change this in Scriptographer
+							// (currently returns null)
+							return undefined;
+						}
+					}
+					return style;
+				};
+				// Style-getters and setters for owner class:
+				// 'this' = the Base.each() side-car = the object that is
+				// returned from Base.each and injected into _owner above:
 				this[set] = function(value) {
-					this[style][set](value);
+					this[styleKey][set](value);
 					return this;
 				};
 				this[get] = function() {
-					return this[style][get]();
+					return this[styleKey][get]();
 				};
 			}, {}));
 			return this.base(src);