diff --git a/src/document/Doc.js b/src/document/Doc.js index 3e7d0b01..2dbc76f8 100644 --- a/src/document/Doc.js +++ b/src/document/Doc.js @@ -1,4 +1,6 @@ Doc = Base.extend({ + beans: true, + initialize: function(canvas) { if (canvas) { this.canvas = canvas; @@ -9,12 +11,21 @@ Doc = Base.extend({ this.activate(); this.layers = []; this.activeLayer = new Layer(); + this.currentStyle = null; }, - + + getCurrentStyle: function() { + return this._currentStyle; + }, + + setCurrentStyle: function(style) { + this._currentStyle = new PathStyle(this, style); + }, + activate: function() { Paper.activateDocument(this); }, - + redraw: function() { if (this.canvas) { this.ctx.clearRect(0, 0, this.size.width, this.size.height); diff --git a/src/item/Item.js b/src/item/Item.js index ca076cba..852c0140 100644 --- a/src/item/Item.js +++ b/src/item/Item.js @@ -2,8 +2,8 @@ Item = Base.extend({ beans: true, initialize: function() { - this.parent = Paper.document.activeLayer; - this.parent.children.push(this); + Paper.document.activeLayer.appendTop(this); + this.style = this.document.currentStyle; }, /** @@ -448,9 +448,9 @@ Item = Base.extend({ * Default: ['objects', 'children'] */ transform: function(matrix, flags) { + // TODO: Walk DOM and call transform on chidren, depending on flags // TODO: Handle flags, add TransformFlag class and convert to bit mask // for quicker checking - // TODO: Call transform on chidren only if 'children' flag is provided if (this.transformContent) this.transformContent(matrix, flags); if (this.children) { @@ -544,5 +544,26 @@ Item = Base.extend({ shy = shx; } this.transform(new Matrix().shear(shx, shy, center || this.position)); + }, + + /** + * The path style of the item. + * + * Sample code: + * + * var circle = new Path.Circle(new Point(10, 10), 10); + * circle.style = { + * fillColor: new RGBColor(1, 0, 0), + * strokeColor: new RGBColor(0, 1, 0), + * strokeWidth: 5 + * }; + * + */ + getStyle: function() { + return this._style; + }, + + setStyle: function(style) { + this._style = new PathStyle(this, style); } -}); +}); \ No newline at end of file diff --git a/src/item/PathStyle.js b/src/item/PathStyle.js new file mode 100644 index 00000000..57e8c28c --- /dev/null +++ b/src/item/PathStyle.js @@ -0,0 +1,72 @@ +new function() { + var keys = ['windingRule', 'resolution', 'strokeColor', + 'strokeWidth', 'strokeCap', 'strokeJoin', 'dashOffset','dashArray', + 'miterLimit', 'strokeOverprint', 'fillColor', 'fillOverprint']; + + PathStyle = Base.extend({ + initialize: function(item, style) { + this.item = item; + if(style) { + for (var i = 0, l = keys.length; i < l; i++) { + var key = keys[i]; + if(style[key]) + this[key] = style[key]; + } + } + }, + + _setChildrenStyle: function(name, value) { + for(var i = 0, l = this.item.children.length; i < l; i++) { + this.item.children[i].style[name] = value; + } + }, + + _getChildrenStyle: function(name) { + var style; + for (var i = 0, l = this.item.children.length; i < l; i++) { + if(!style) { + style = this.item.children[i].style[name]; + } else if(style != this.item.children[i].style[name]) { + // If there is another item with a different style: + return null; + } + } + return style; + } + }); + + + var pathStyleProps = { beans: true }; + var itemProps = { beans: true }; + function addStyleBean(key) { + pathStyleProps['set' + key.capitalize()] = function(value) { + if(this.item && this.item.children) { + this._setChildrenStyle(key, value); + } else { + this['_' + key] = value; + } + }; + pathStyleProps['get' + key.capitalize()] = function() { + if(this.item && this.item.children) { + return this._getChildrenStyle(key); + } else { + return this['_' + key]; + } + }; + } + function addItemBean(key) { + itemProps['set' + key.capitalize()] = function(value) { + this.style[key] = value; + }; + itemProps['get' + key.capitalize()] = function() { + return this.style[key]; + }; + } + for (var i = 0, l = keys.length; i < l; i++) { + var key = keys[i]; + addStyleBean(key); + addItemBean(key); + } + PathStyle.inject(pathStyleProps); + Item.inject(itemProps); +}; \ No newline at end of file