From 828c3ae369cd8341daf3577bb4b2f250d2c0c980 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Mon, 1 Aug 2011 16:21:00 +0100 Subject: [PATCH 01/11] Doc: Improve View#initialize(canvas). --- src/ui/View.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/ui/View.js b/src/ui/View.js index 29c9c573..2bbdbdaf 100644 --- a/src/ui/View.js +++ b/src/ui/View.js @@ -26,7 +26,8 @@ var View = this.View = Base.extend(/** @lends View# */{ /** * Creates a view object - * @param {Canvas} canvas + * @param {HTMLCanvasElement|String} canvas The canvas object that this + * view should wrap, or the String id that represents it */ initialize: function(canvas) { // Associate this view with the active paper scope. From 14881b8b1997e9a50d9df0a0fdaec268a9f91b2e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Mon, 1 Aug 2011 16:23:56 +0100 Subject: [PATCH 02/11] Let View handle the retrieving of the canvas object. --- src/core/PaperScript.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/core/PaperScript.js b/src/core/PaperScript.js index d9b91dda..3e1edb6d 100644 --- a/src/core/PaperScript.js +++ b/src/core/PaperScript.js @@ -234,10 +234,8 @@ var PaperScript = this.PaperScript = new function() { // retrieved through PaperScope.get(). // If a canvas id is provided, pass it on to the PaperScope // so a project is created for it now. - var canvas = PaperScript.getAttribute(script, 'canvas'); - canvas = canvas && document.getElementById(canvas); var scope = new PaperScope(script); - scope.setup(canvas); + scope.setup(PaperScript.getAttribute(script, 'canvas')); if (script.src) { // If we're loading from a source, request that first and then // run later. From 2d5788540d3e3f050a6642a3888fb89422f55577 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Tue, 2 Aug 2011 08:32:55 +0100 Subject: [PATCH 03/11] Hide internal properties even if they are enumerable in Base#toString() --- src/core/Base.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/core/Base.js b/src/core/Base.js index b6f580a1..009c779f 100644 --- a/src/core/Base.js +++ b/src/core/Base.js @@ -40,9 +40,13 @@ this.Base = Base.inject(/** @lends Base# */{ */ toString: function() { return '{ ' + Base.each(this, function(value, key) { - var type = typeof value; - this.push(key + ': ' + (type === 'number' ? Base.formatNumber(value) - : type === 'string' ? "'" + value + "'" : value)); + // Hide internal properties even if they are enumerable + if (key.charAt(0) != '_') { + var type = typeof value; + this.push(key + ': ' + (type === 'number' + ? Base.formatNumber(value) + : type === 'string' ? "'" + value + "'" : value)); + } }, []).join(', ') + ' }'; }, From fe97b94340b60a031ac44285e6408b7b38bf9a2c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Tue, 2 Aug 2011 10:08:08 +0100 Subject: [PATCH 04/11] Define PaperScopeItem as a private base class for all classes that have lists and references in the PaperScope (Project, View, Tool), so they can share functionality (#initialize(), #activate(), #remove()), and add support for multiple tools. Closes #27 --- src/core/PaperScopeItem.js | 58 ++++++++++++++++++++++++++++++++++++ src/core/PaperScript.js | 3 +- src/paper.js | 1 + src/project/Project.js | 57 ++++++++++++++--------------------- src/tool/Tool.js | 23 ++++++++++++-- src/ui/View.js | 61 +++++++++++++++++++++++--------------- 6 files changed, 139 insertions(+), 64 deletions(-) create mode 100644 src/core/PaperScopeItem.js diff --git a/src/core/PaperScopeItem.js b/src/core/PaperScopeItem.js new file mode 100644 index 00000000..f7b9d7f8 --- /dev/null +++ b/src/core/PaperScopeItem.js @@ -0,0 +1,58 @@ +/* + * 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/ + * + * Copyright (c) 2011, Juerg Lehni & Jonathan Puckey + * http://lehni.org/ & http://jonathanpuckey.com/ + * + * Distributed under the MIT license. See LICENSE file for details. + * + * All rights reserved. + */ + +/** + * @name PaperScopeItem + * + * @class A private base class for all classes that have lists and references in + * the {@link PaperScope} ({@link Project}, {@link View}, {@link Tool}), so + * functionality can be shared. + * + * @private + */ +var PaperScopeItem = Base.extend(/** @lends PaperScopeItem# */{ + + /** + * Creates a PaperScopeItem object. + */ + initialize: function(activate) { + // Store reference to the currently active global paper scope: + this._scope = paper; + // Push it onto this._scope.projects and set index: + this._index = this._scope[this._list].push(this) - 1; + // If the project has no active reference, activate this one + if (activate || !this._scope[this._reference]) + this.activate(); + }, + + activate: function() { + if (!this._scope) + return false; + this._scope[this._reference] = this; + return true; + }, + + remove: function() { + if (this._index == null) + return false; + Base.splice(this._scope[this._list], null, this._index, 1); + // Clear the active tool reference if it was pointint to this. + if (this._scope[this._reference] == this) + this._scope[this._reference] = null; + this._scope = null; + return true; + } +}); diff --git a/src/core/PaperScript.js b/src/core/PaperScript.js index 3e1edb6d..413f32ef 100644 --- a/src/core/PaperScript.js +++ b/src/core/PaperScript.js @@ -156,8 +156,7 @@ var PaperScript = this.PaperScript = new function() { // Set currently active scope. paper = scope; var view = scope.view, - // TODO: Add support for multiple tools - tool = scope.tool = /on(?:Key|Mouse)(?:Up|Down|Move|Drag)/.test(code) + tool = /on(?:Key|Mouse)(?:Up|Down|Move|Drag)/.test(code) && new Tool(), res; // Define variables for potential handlers, so eval() calls below to diff --git a/src/paper.js b/src/paper.js index 3e970546..9065d690 100644 --- a/src/paper.js +++ b/src/paper.js @@ -53,6 +53,7 @@ var paper = new function() { /*#*/ include('core/Base.js'); /*#*/ include('core/PaperScope.js'); +/*#*/ include('core/PaperScopeItem.js'); // Include Paper classes, which are later injected into PaperScope by setting // them on the 'this' object, e.g.: diff --git a/src/project/Project.js b/src/project/Project.js index ea141b06..ee253b8e 100644 --- a/src/project/Project.js +++ b/src/project/Project.js @@ -34,7 +34,10 @@ * An array of all open projects is accessible through the * {@link PaperScope#projects} variable. */ -var Project = this.Project = Base.extend(/** @lends Project# */{ +var Project = this.Project = PaperScopeItem.extend(/** @lends Project# */{ + _list: 'projects', + _reference: 'project', + // TODO: Add arguments to define pages /** * Creates a Paper.js project. @@ -43,16 +46,12 @@ var Project = this.Project = Base.extend(/** @lends Project# */{ * and the {@link PaperScope#project} variable points to it. */ initialize: function() { - // Store reference to the currently active global paper scope: - this._scope = paper; - // Push it onto this._scope.projects and set index: - this._index = this._scope.projects.push(this) - 1; + // Activate straight away so paper.project is set, as required by + // Layer and DoumentView constructors. + this.base(true); this._currentStyle = new PathStyle(); this._selectedItems = {}; this._selectedItemCount = 0; - // Activate straight away so paper.project is set, as required by - // Layer and DoumentView constructors. - this.activate(); this.layers = []; this.symbols = []; this.activeLayer = new Layer(); @@ -63,6 +62,21 @@ var Project = this.Project = Base.extend(/** @lends Project# */{ this._scope._needsRedraw(); }, + /** + * Activates this project, so all newly created items will be placed + * in it. + * + * @name Project#activate + * @function + */ + + /** + * Removes this project from the {@link PaperScope#projects} list. + * + * @name Project#remove + * @function + */ + /** * The currently active path style. All selected items and newly * created items will be styled with this style. @@ -98,33 +112,6 @@ var Project = this.Project = Base.extend(/** @lends Project# */{ this._currentStyle.initialize(style); }, - /** - * Activates this project, so all newly created items will be placed - * in it. - */ - activate: function() { - if (this._scope) { - this._scope.project = this; - return true; - } - return false; - }, - - /** - * Removes this project from the {@link PaperScope#projects} list. - */ - remove: function() { - if (this._scope) { - Base.splice(this._scope.projects, null, this._index, 1); - // Clear the active project reference if it was pointint to this. - if (this._scope.project == this) - this._scope.project = null; - this._scope = null; - return true; - } - return false; - }, - /** * The index of the project in the {@link PaperScope#projects} list. * diff --git a/src/tool/Tool.js b/src/tool/Tool.js index a701ccc1..73b27a06 100644 --- a/src/tool/Tool.js +++ b/src/tool/Tool.js @@ -46,16 +46,33 @@ * path.add(event.point); * } */ -var Tool = this.Tool = Base.extend(/** @lends Tool# */{ +var Tool = this.Tool = PaperScopeItem.extend(/** @lends Tool# */{ + _list: 'tools', + _reference: 'tool', + // DOCS: rewrite Tool constructor explanation initialize: function() { - // Store reference to the currently active global paper scope: - this._scope = paper; + this.base(); this._firstMove = true; this._count = 0; this._downCount = 0; }, + /** + * Activates this tool, meaning {@link PaperScope#tool} will + * point to it and it will be the one that recieves mouse events. + * + * @name Tool#activate + * @function + */ + + /** + * Removes this tool from the {@link PaperScope#tools} list. + * + * @name Tool#remove + * @function + */ + /** * The fixed time delay in milliseconds between each call to the * {@link #onMouseDrag} event. Setting this to an interval means the diff --git a/src/ui/View.js b/src/ui/View.js index 2bbdbdaf..11d5fad7 100644 --- a/src/ui/View.js +++ b/src/ui/View.js @@ -23,17 +23,17 @@ * center, both useful for constructing artwork that should appear centered on * screen. */ -var View = this.View = Base.extend(/** @lends View# */{ +var View = this.View = PaperScopeItem.extend(/** @lends View# */{ + _list: 'views', + _reference: 'view', + /** * Creates a view object * @param {HTMLCanvasElement|String} canvas The canvas object that this * view should wrap, or the String id that represents it */ initialize: function(canvas) { - // Associate this view with the active paper scope. - this._scope = paper; - // Push it onto project.views and set index: - this._index = this._scope.views.push(this) - 1; + this.base(); // Handle canvas argument var size; if (typeof canvas === 'string') @@ -109,6 +109,32 @@ var View = this.View = Base.extend(/** @lends View# */{ this._scope._redrawNotified = false; }, + /** + * Makes this view the active one, meaning {@link PaperScope#view} will + * point to it. + * + * @name View#activate + * @function + */ + + /** + * Removes thsi view from the {@link PaperScope#views} list and frees the + * associated canvas. + */ + remove: function() { + if (!this.base()) + return false; + // Clear focus if removed view had it + if (View._focused == this) + View._focused = null; + delete View._views[this._id]; + // Uninstall event handlers again for this view. + DomEvent.remove(this._canvas, this._events); + // Clearing _onFrame makes the frame handler stop automatically. + this._canvas = this._events = this._onFrame = null; + return true; + }, + /** * The underlying native canvas element. * @@ -239,6 +265,12 @@ var View = this.View = Base.extend(/** @lends View# */{ this._inverse = null; }, + /** + * Draws the view. + * + * @name View#draw + * @function + */ draw: function(checkRedraw) { if (checkRedraw && !this._redrawNeeded) return false; @@ -264,25 +296,6 @@ var View = this.View = Base.extend(/** @lends View# */{ return true; }, - activate: function() { - this._scope.view = this; - }, - - remove: function() { - if (this._index == null) - return false; - // Clear focus if removed view had it - if (View._focused == this) - View._focused = null; - delete View._views[this._id]; - Base.splice(this._scope.views, null, this._index, 1); - // Uninstall event handlers again for this view. - DomEvent.remove(this._canvas, this._events); - // Clearing _onFrame makes the frame handler stop automatically. - this._scope = this._canvas = this._events = this._onFrame = null; - return true; - }, - // TODO: getInvalidBounds // TODO: invalidate(rect) // TODO: style: artwork / preview / raster / opaque / ink From 0bbb4640cebbafb3ed7b889157e3c8f9d1b2d841 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Tue, 2 Aug 2011 10:09:40 +0100 Subject: [PATCH 05/11] Increase version to 0.21, supporting tools in direct JavaScript mode, including support for multiple tools. --- build/preprocess.sh | 2 +- dist/docs/classes/CompoundPath.html | 21 ++--- dist/docs/classes/Group.html | 21 ++--- dist/docs/classes/Item.html | 21 ++--- dist/docs/classes/Layer.html | 21 ++--- dist/docs/classes/Path.html | 21 ++--- dist/docs/classes/PathItem.html | 21 ++--- dist/docs/classes/PlacedItem.html | 21 ++--- dist/docs/classes/PlacedSymbol.html | 21 ++--- dist/docs/classes/PointText.html | 21 ++--- dist/docs/classes/Raster.html | 21 ++--- dist/docs/classes/TextItem.html | 21 ++--- dist/docs/classes/Tool.html | 56 +++++++++++++ dist/docs/classes/View.html | 82 ++++++++++++++++++- dist/docs/resources/js/paper.js | 122 +++++++++++++++------------- dist/paper.js | 122 +++++++++++++++------------- 16 files changed, 392 insertions(+), 223 deletions(-) diff --git a/build/preprocess.sh b/build/preprocess.sh index ae32f850..83fcd483 100755 --- a/build/preprocess.sh +++ b/build/preprocess.sh @@ -31,7 +31,7 @@ # stripped Formated but without comments # compressed Uses UglifyJS to reduce file size -VERSION=0.2 +VERSION=0.21 DATE=$(git log -1 --pretty=format:%ad) COMMAND="./prepro.js -d '{ \"version\": $VERSION, \"date\": \"$DATE\" }' -d '$4' $2" diff --git a/dist/docs/classes/CompoundPath.html b/dist/docs/classes/CompoundPath.html index c946fad8..8332fcf7 100644 --- a/dist/docs/classes/CompoundPath.html +++ b/dist/docs/classes/CompoundPath.html @@ -2584,18 +2584,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Group.html b/dist/docs/classes/Group.html index 09964e3b..9b4b70bf 100644 --- a/dist/docs/classes/Group.html +++ b/dist/docs/classes/Group.html @@ -1789,18 +1789,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Item.html b/dist/docs/classes/Item.html index 9528318c..fb3be929 100644 --- a/dist/docs/classes/Item.html +++ b/dist/docs/classes/Item.html @@ -1654,18 +1654,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Layer.html b/dist/docs/classes/Layer.html index c9bfc7b2..244196e1 100644 --- a/dist/docs/classes/Layer.html +++ b/dist/docs/classes/Layer.html @@ -1748,18 +1748,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Path.html b/dist/docs/classes/Path.html index 36231796..c31da42a 100644 --- a/dist/docs/classes/Path.html +++ b/dist/docs/classes/Path.html @@ -4900,18 +4900,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/PathItem.html b/dist/docs/classes/PathItem.html index 70b21cfa..4cce21b1 100644 --- a/dist/docs/classes/PathItem.html +++ b/dist/docs/classes/PathItem.html @@ -2481,18 +2481,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/PlacedItem.html b/dist/docs/classes/PlacedItem.html index 18e366cf..efbc37cf 100644 --- a/dist/docs/classes/PlacedItem.html +++ b/dist/docs/classes/PlacedItem.html @@ -1695,18 +1695,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/PlacedSymbol.html b/dist/docs/classes/PlacedSymbol.html index de697a13..0b7c7db8 100644 --- a/dist/docs/classes/PlacedSymbol.html +++ b/dist/docs/classes/PlacedSymbol.html @@ -1781,18 +1781,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/PointText.html b/dist/docs/classes/PointText.html index 20cb8112..2ebd14af 100644 --- a/dist/docs/classes/PointText.html +++ b/dist/docs/classes/PointText.html @@ -1744,18 +1744,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Raster.html b/dist/docs/classes/Raster.html index bbe7eae3..21c0e17a 100644 --- a/dist/docs/classes/Raster.html +++ b/dist/docs/classes/Raster.html @@ -2365,18 +2365,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/TextItem.html b/dist/docs/classes/TextItem.html index afc089b0..1a9860a6 100644 --- a/dist/docs/classes/TextItem.html +++ b/dist/docs/classes/TextItem.html @@ -1802,18 +1802,19 @@ points.

options.type: Only hit test again a certain item type: PathItem, Raster, TextItem, etc.

options.fill: Boolean - Hit test the fill of items.

-

options.stroke: Boolean - Hit test the curves of path items, -taking into account stroke width.

-

options.segment: Boolean - Hit test for segment.point of -Path items.

+

options.stroke: Boolean - Hit test the curves of path +items, taking into account stroke width.

+

options.segment: Boolean - Hit test for +segment.point of Path items.

options.handles: Boolean - Hit test for the handles (segment.handleIn / segment.handleOut) of path segments.

-

options.ends: Boolean - Only hit test for the first or last -segment points of open path items.

-

options.bounds: Boolean - Hit test the corners and side-centers -of the bounding rectangle of items (item.bounds).

-

options.center: Boolean - Hit test the rectangle.center -of the bounding rectangle of items (item.bounds).

+

options.ends: Boolean - Only hit test for the first or +last segment points of open path items.

+

options.bounds: Boolean - Hit test the corners and +side-centers of the bounding rectangle of items (item.bounds).

+

options.center: Boolean - Hit test the +rectangle.center of the bounding rectangle of items +(item.bounds).

options.guide: Boolean - Hit test items that have item.guide set to true.

options.selected: Boolean - Only hit selected items.

diff --git a/dist/docs/classes/Tool.html b/dist/docs/classes/Tool.html index 4a07cfce..8c5f0347 100644 --- a/dist/docs/classes/Tool.html +++ b/dist/docs/classes/Tool.html @@ -518,6 +518,62 @@ keys.

+ +

Methods

+ + +
+ + +
+ + +
+ + +
+ +
+ diff --git a/dist/docs/classes/View.html b/dist/docs/classes/View.html index ad23c19a..bfcb8e9e 100644 --- a/dist/docs/classes/View.html +++ b/dist/docs/classes/View.html @@ -50,8 +50,9 @@ screen.

  • canvas: -Canvas - +HTMLCanvasElement / String +— The canvas object that this +view should wrap, or the String id that represents it
    • @@ -379,6 +380,58 @@ function onResize(event) {

    Methods

    +
    + + +
    + + +
    + + +
    + +
    +
    +
    + + +
    + +
    diff --git a/dist/docs/resources/js/paper.js b/dist/docs/resources/js/paper.js index b5a250ea..ea11ce94 100644 --- a/dist/docs/resources/js/paper.js +++ b/dist/docs/resources/js/paper.js @@ -1,5 +1,5 @@ /*! - * Paper.js v0.2 + * Paper.js v0.21 * * This file is part of Paper.js, a JavaScript Vector Graphics Library, * based on Scriptographer.org and designed to be largely API compatible. @@ -13,7 +13,7 @@ * * All rights reserved. * - * Date: Mon Aug 1 12:03:23 2011 +0100 + * Date: Tue Aug 2 10:08:08 2011 +0100 * *** * @@ -303,9 +303,12 @@ this.Base = Base.inject({ toString: function() { return '{ ' + Base.each(this, function(value, key) { - var type = typeof value; - this.push(key + ': ' + (type === 'number' ? Base.formatNumber(value) - : type === 'string' ? "'" + value + "'" : value)); + if (key.charAt(0) != '_') { + var type = typeof value; + this.push(key + ': ' + (type === 'number' + ? Base.formatNumber(value) + : type === 'string' ? "'" + value + "'" : value)); + } }, []).join(', ') + ' }'; }, @@ -406,7 +409,7 @@ var PaperScope = this.PaperScope = Base.extend({ PaperScope._scopes[this._id] = this; }, - version: 0.2, + version: 0.21, evaluate: function(code) { var res = PaperScript.evaluate(code, this); @@ -476,6 +479,33 @@ var PaperScope = this.PaperScope = Base.extend({ } }); +var PaperScopeItem = Base.extend({ + + initialize: function(activate) { + this._scope = paper; + this._index = this._scope[this._list].push(this) - 1; + if (activate || !this._scope[this._reference]) + this.activate(); + }, + + activate: function() { + if (!this._scope) + return false; + this._scope[this._reference] = this; + return true; + }, + + remove: function() { + if (this._index == null) + return false; + Base.splice(this._scope[this._list], null, this._index, 1); + if (this._scope[this._reference] == this) + this._scope[this._reference] = null; + this._scope = null; + return true; + } +}); + var Point = this.Point = Base.extend({ initialize: function(arg0, arg1) { if (arg1 !== undefined) { @@ -1623,14 +1653,15 @@ var Line = this.Line = Base.extend({ } }); -var Project = this.Project = Base.extend({ +var Project = this.Project = PaperScopeItem.extend({ + _list: 'projects', + _reference: 'project', + initialize: function() { - this._scope = paper; - this._index = this._scope.projects.push(this) - 1; + this.base(true); this._currentStyle = new PathStyle(); this._selectedItems = {}; this._selectedItemCount = 0; - this.activate(); this.layers = []; this.symbols = []; this.activeLayer = new Layer(); @@ -1649,25 +1680,6 @@ var Project = this.Project = Base.extend({ this._currentStyle.initialize(style); }, - activate: function() { - if (this._scope) { - this._scope.project = this; - return true; - } - return false; - }, - - remove: function() { - if (this._scope) { - Base.splice(this._scope.projects, null, this._index, 1); - if (this._scope.project == this) - this._scope.project = null; - this._scope = null; - return true; - } - return false; - }, - getIndex: function() { return this._index; }, @@ -6470,12 +6482,16 @@ DomEvent.requestAnimationFrame = new function() { }; }; -var View = this.View = Base.extend({ +var View = this.View = PaperScopeItem.extend({ + _list: 'views', + _reference: 'view', + initialize: function(canvas) { - this._scope = paper; - this._index = this._scope.views.push(this) - 1; + this.base(); var size; - if (canvas && canvas instanceof HTMLCanvasElement) { + if (typeof canvas === 'string') + canvas = document.getElementById(canvas); + if (canvas instanceof HTMLCanvasElement) { this._canvas = canvas; if (PaperScript.hasAttribute(canvas, 'resize')) { var offset = DomElement.getOffset(canvas, true), @@ -6530,6 +6546,17 @@ var View = this.View = Base.extend({ this._scope._redrawNotified = false; }, + remove: function() { + if (!this.base()) + return false; + if (View._focused == this) + View._focused = null; + delete View._views[this._id]; + DomEvent.remove(this._canvas, this._events); + this._canvas = this._events = this._onFrame = null; + return true; + }, + getCanvas: function() { return this._canvas; }, @@ -6623,22 +6650,6 @@ var View = this.View = Base.extend({ return true; }, - activate: function() { - this._scope.view = this; - }, - - remove: function() { - if (this._index == null) - return false; - if (View._focused == this) - View._focused = null; - delete View._views[this._id]; - Base.splice(this._scope.views, null, this._index, 1); - DomEvent.remove(this._canvas, this._events); - this._scope = this._canvas = this._events = this._onFrame = null; - return true; - }, - projectToView: function(point) { return this._matrix._transformPoint(Point.read(arguments)); }, @@ -7046,9 +7057,12 @@ var ToolEvent = this.ToolEvent = Event.extend({ } }); -var Tool = this.Tool = Base.extend({ +var Tool = this.Tool = PaperScopeItem.extend({ + _list: 'tools', + _reference: 'tool', + initialize: function() { - this._scope = paper; + this.base(); this._firstMove = true; this._count = 0; this._downCount = 0; @@ -7675,7 +7689,7 @@ var parse_js=new function(){function W(a,b,c){var d=[];for(var e=0;e Date: Tue, 2 Aug 2011 14:31:35 +0200 Subject: [PATCH 06/11] Fix PointText#setPoint(point) and PointText#setPosition(point). --- src/text/PointText.js | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/src/text/PointText.js b/src/text/PointText.js index f1385d2a..f73c30db 100644 --- a/src/text/PointText.js +++ b/src/text/PointText.js @@ -37,7 +37,7 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ */ initialize: function(point) { this.base(); - var point = Point.read(arguments); + point = Point.read(arguments); this._point = LinkedPoint.create(this, 'setPoint', point.x, point.y); this._matrix = new Matrix().translate(point); }, @@ -56,10 +56,17 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ * @bean */ getPoint: function() { - return this._point; + // this._point is a LinkedPoint, so we can use _x and _y. + // Do not cache LinkedPoints directly, since we would not be able to + // use them to calculate the difference in #setPoint, as when it is + // modified, it would hold new values already and only then cause the + // calling of #setPoint. + return LinkedPoint.create(this, 'setPoint', this._point._x, + this._point._y); }, setPoint: function(point) { + this._changed(Change.GEOMETRY); this._transform(new Matrix().translate( Point.read(arguments).subtract(this._point))); }, @@ -67,7 +74,7 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ // TODO: Position should be the center point of the bounds but we currently // don't support bounds for PointText. getPosition: function() { - return this._point; + return this.getPoint(); }, setPosition: function(point) { From 7c95eb7694de5a42d252ca81bcc20b02a353a464 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Tue, 2 Aug 2011 16:08:00 +0100 Subject: [PATCH 07/11] Do not usse LinkedPoint internally for PointText#point, since we're returning new instances each time now in #getPoint(). --- src/text/PointText.js | 25 ++++++++++--------------- 1 file changed, 10 insertions(+), 15 deletions(-) diff --git a/src/text/PointText.js b/src/text/PointText.js index f73c30db..699a101b 100644 --- a/src/text/PointText.js +++ b/src/text/PointText.js @@ -37,9 +37,8 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ */ initialize: function(point) { this.base(); - point = Point.read(arguments); - this._point = LinkedPoint.create(this, 'setPoint', point.x, point.y); - this._matrix = new Matrix().translate(point); + this._point = Point.read(arguments).clone(); + this._matrix = new Matrix().translate(this._point); }, clone: function() { @@ -56,13 +55,10 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ * @bean */ getPoint: function() { - // this._point is a LinkedPoint, so we can use _x and _y. - // Do not cache LinkedPoints directly, since we would not be able to - // use them to calculate the difference in #setPoint, as when it is - // modified, it would hold new values already and only then cause the - // calling of #setPoint. - return LinkedPoint.create(this, 'setPoint', this._point._x, - this._point._y); + // Se Item#getPosition for an explanation why we create new LinkedPoint + // objects each time. + return LinkedPoint.create(this, 'setPoint', + this._point.x, this._point.y); }, setPoint: function(point) { @@ -72,7 +68,8 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ }, // TODO: Position should be the center point of the bounds but we currently - // don't support bounds for PointText. + // don't support bounds for PointText, so let's return the same as #point + // for the time being. getPosition: function() { return this.getPoint(); }, @@ -83,10 +80,8 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ _transform: function(matrix, flags) { this._matrix.preConcatenate(matrix); - // We need to transform the LinkedPoint, passing true for dontNotify so - // chaning it won't trigger calls of setPoint(), leading to an endless - // recursion. - matrix._transformPoint(this._point, this._point, true); + // Also transform _point: + matrix._transformPoint(this._point, this._point); }, draw: function(ctx) { From 4e78c55859aed49a6e78bd96956f3e71168505db Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Wed, 3 Aug 2011 23:37:56 +0200 Subject: [PATCH 08/11] Simplify PointText#setPoint() --- src/text/PointText.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/text/PointText.js b/src/text/PointText.js index 699a101b..6e9959ad 100644 --- a/src/text/PointText.js +++ b/src/text/PointText.js @@ -62,9 +62,7 @@ var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{ }, setPoint: function(point) { - this._changed(Change.GEOMETRY); - this._transform(new Matrix().translate( - Point.read(arguments).subtract(this._point))); + this.translate(Point.read(arguments).subtract(this._point)); }, // TODO: Position should be the center point of the bounds but we currently From 3a3f5ecabb6cd7afe1fbd7313509d5a8788ca1a9 Mon Sep 17 00:00:00 2001 From: Jonathan Puckey Date: Thu, 4 Aug 2011 10:54:56 +0200 Subject: [PATCH 09/11] Segment: notify path of change when selection state of handles changes, so the view is redrawn. --- src/path/Segment.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/path/Segment.js b/src/path/Segment.js index c08702a9..19998d33 100644 --- a/src/path/Segment.js +++ b/src/path/Segment.js @@ -203,6 +203,9 @@ var Segment = this.Segment = Base.extend(/** @lends Segment# */{ if (selected) selection[0] = false; selection[index] = selected; + // Let path know that we changed something and the view + // should be redrawn + path._changed(Change.ATTRIBUTE); } } this._selectionState = (selection[0] ? SelectionState.POINT : 0) From a58bbaf6cfcd8f8e0f6dbd309a874b4cb8ab8b23 Mon Sep 17 00:00:00 2001 From: Jonathan Puckey Date: Thu, 4 Aug 2011 15:06:35 +0200 Subject: [PATCH 10/11] Fix Size#isZero(). --- src/basic/Size.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/basic/Size.js b/src/basic/Size.js index db90b6ab..bc231289 100644 --- a/src/basic/Size.js +++ b/src/basic/Size.js @@ -351,7 +351,7 @@ var Size = this.Size = Base.extend(/** @lends Size# */{ * @return {Boolean} {@true both width and height are 0} */ isZero: function() { - return this.width == 0 && this.width == 0; + return this.width == 0 && this.height == 0; }, /** From e82a83808520f384279c9347faea486ec6d38296 Mon Sep 17 00:00:00 2001 From: Jonathan Puckey Date: Mon, 8 Aug 2011 18:43:45 +0200 Subject: [PATCH 11/11] Fix problem in Item#rasterize(resolution) where rasterizing the active layer caused the resulting Raster to be positioned wrongly. --- src/item/Item.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/item/Item.js b/src/item/Item.js index 75b73eef..8fea80c8 100644 --- a/src/item/Item.js +++ b/src/item/Item.js @@ -677,8 +677,7 @@ var Item = this.Item = Base.extend(/** @lends Item# */{ matrix.applyToContext(ctx); this.draw(ctx, {}); var raster = new Raster(canvas); - raster.setPosition(this.getPosition()); - raster.scale(1 / scale); + raster.setBounds(bounds); return raster; },