From dabc2b97edbe5bab99b0b916764e3ff66f1ad120 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Sat, 7 May 2011 13:39:17 +0100 Subject: [PATCH] Implement change-notification in a proper way, using ChangeFlags that tell it what exactly has changed, and clearing caches accordingly. --- src/item/ChangeFlags.js | 21 +++++++++++++++++++++ src/item/Item.js | 6 ++++++ src/item/PathStyle.js | 16 +++++++++++----- src/load.js | 1 + src/paper.js | 1 + src/path/Path.js | 27 ++++++++++++++------------- src/path/Segment.js | 2 +- 7 files changed, 55 insertions(+), 19 deletions(-) create mode 100644 src/item/ChangeFlags.js diff --git a/src/item/ChangeFlags.js b/src/item/ChangeFlags.js new file mode 100644 index 00000000..301868b6 --- /dev/null +++ b/src/item/ChangeFlags.js @@ -0,0 +1,21 @@ +/* + * Paper.js + * + * This file is part of Paper.js, a JavaScript Vector Graphics Library, + * based on Scriptographer.org and designed to be largely API compatible. + * http://paperjs.org/ + * http://scriptographer.org/ + * + * Distributed under the MIT license. See LICENSE file for details. + * + * Copyright (c) 2011, Juerg Lehni & Jonathan Puckey + * http://lehni.org/ & http://jonathanpuckey.com/ + * + * All rights reserved. + */ + +var ChangeFlags = { + PATH: 1, // Path geometry + STROKE: 2, // Stroke geometry + STYLE: 4 // Fille style or stroke color / dash +}; \ No newline at end of file diff --git a/src/item/Item.js b/src/item/Item.js index b9fc62c8..d5a7d3fc 100644 --- a/src/item/Item.js +++ b/src/item/Item.js @@ -22,6 +22,12 @@ var Item = this.Item = Base.extend({ this.setStyle(this._document.getCurrentStyle()); }, + _changed: function(flags) { + if (flags & ChangeFlags.PATH) { + delete this._position; + } + }, + /** * When passed a document, copies the item to the document, * or duplicates it within the same document. When passed an item, diff --git a/src/item/PathStyle.js b/src/item/PathStyle.js index 51867351..3e7df09e 100644 --- a/src/item/PathStyle.js +++ b/src/item/PathStyle.js @@ -17,7 +17,13 @@ var PathStyle = this.PathStyle = Base.extend(new function() { var keys = ['windingRule', 'resolution', 'strokeColor', 'strokeWidth', 'strokeCap', 'strokeJoin', 'dashOffset','dashArray', 'miterLimit', - 'strokeOverprint', 'fillColor', 'fillOverprint']; + 'strokeOverprint', 'fillColor', 'fillOverprint'], + strokeFlags = { + strokeWidth: true, + strokeCap: true, + strokeJoin: true, + miterLimit: true + }; var fields = { beans: true, @@ -63,10 +69,10 @@ var PathStyle = this.PathStyle = Base.extend(new function() { var old = this['_' + key]; if (old != value && !(old && old.equals && old.equals(value))) { this['_' + key] = value; - // TODO: Tell _item what exactly has changed. Maybe introduce - // ChangeFlags, e.g. STROKE, COLOR, FILL, GEOMETRY, etc? - if (this._item && this._item._changed) - this._item._changed(); + if (this._item) { + this._item._changed(ChangeFlags.STYLE + | (strokeFlags[key] ? ChangeFlags.STROKE : 0)); + } } } return this; diff --git a/src/load.js b/src/load.js index 784e1a45..2de4c0d9 100644 --- a/src/load.js +++ b/src/load.js @@ -36,6 +36,7 @@ var sources = [ 'src/document/Document.js', 'src/document/Symbol.js', + 'src/item/ChangeFlags.js', 'src/item/Item.js', 'src/item/Group.js', 'src/item/Layer.js', diff --git a/src/paper.js b/src/paper.js index 7cc38f9e..77e5dcef 100644 --- a/src/paper.js +++ b/src/paper.js @@ -100,6 +100,7 @@ Base.inject({ //#include "document/Document.js" //#include "document/Symbol.js" +//#include "item/ChangeFlags.js" //#include "item/Item.js" //#include "item/Group.js" //#include "item/Layer.js" diff --git a/src/path/Path.js b/src/path/Path.js index 57d59e8b..78074654 100644 --- a/src/path/Path.js +++ b/src/path/Path.js @@ -28,13 +28,15 @@ var Path = this.Path = PathItem.extend({ || typeof segments[0] !== 'object' ? arguments : segments); }, - _changed: function() { - // TODO: Implement ChangeFlags, e.g. STROKE, COLOR, FILL, GEOMETRY, - // and only clear caches if affected by change. - delete this._length; - delete this._bounds; - delete this._strokeBounds; - delete this._position; + _changed: function(flags) { + if (flags & ChangeFlags.PATH) { + delete this._length; + delete this._bounds; + delete this._position; + delete this._strokeBounds; + } else if (flags & ChangeFlags.STROKE) { + delete this._strokeBounds; + } }, /** @@ -114,7 +116,7 @@ var Path = this.Path = PathItem.extend({ this._curves[i = length - 1] = Curve.create(this, this._segments[i], this._segments[0]); } - this._changed(); + this._changed(ChangeFlags.PATH); } }, @@ -129,7 +131,7 @@ var Path = this.Path = PathItem.extend({ this._segments[i]._transformCoordinates(matrix, coords, true); } } - this._changed(); + this._changed(ChangeFlags.PATH); }, /** @@ -177,7 +179,7 @@ var Path = this.Path = PathItem.extend({ if (curve) curve._segment1 = segments[index + amount]; } - this._changed(); + this._changed(ChangeFlags.PATH); return segs; }, @@ -261,7 +263,7 @@ var Path = this.Path = PathItem.extend({ if (last && this._closed && (curve = curves[curves.length - 1])) curve._segment2 = segments[0]; } - this._changed(); + this._changed(ChangeFlags.PATH); return removed; }, @@ -306,7 +308,6 @@ var Path = this.Path = PathItem.extend({ segment._handleIn = segment._handleOut; segment._handleOut = handleIn; } - this._changed(); }, join: function(path) { @@ -341,7 +342,7 @@ var Path = this.Path = PathItem.extend({ last1.remove(); this.setClosed(true); } - this._changed(); + this._changed(ChangeFlags.PATH); return true; } return false; diff --git a/src/path/Segment.js b/src/path/Segment.js index a2672f78..d4145173 100644 --- a/src/path/Segment.js +++ b/src/path/Segment.js @@ -69,7 +69,7 @@ var Segment = this.Segment = Base.extend({ } } } - this._path._changed(); + this._path._changed(ChangeFlags.PATH); } },