scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-05 20:32:00 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Reuse PaperScope objects when associating multiple scripts with the same canvas.

Browse source 
Closes #504.
This commit is contained in:
Jürg Lehni 2014-07-26 12:03:34 +02:00
parent e0ec2bf2c3
commit 0198f4c45f
3 changed files with 88 additions and 91 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/core/PaperScope.js
View file

@ -42,8 +42,8 @@ var PaperScope = Base.extend(/** @lends PaperScope# */{
* @function
*/
// DOCS: initialize() parameters
initialize: function PaperScope(script) {
// script is only used internally, when creating scopes for PaperScript.
initialize: function PaperScope() {
// element is only used internally when creating scopes for PaperScript.
// Whenever a PaperScope is created, it automatically becomes the active
// one.
paper = this;
@ -57,15 +57,8 @@ var PaperScope = Base.extend(/** @lends PaperScope# */{
this.projects = [];
this.tools = [];
this.palettes = [];
// Assign an id to this canvas that's either extracted from the script
// or automatically generated.
this._id = script && (script.getAttribute('id') || script.src)
|| ('paperscope-' + (PaperScope._id++));
// Make sure the script tag also has this id now. If it already had an
// id, we're not changing it, since it's the first option we're
// trying to get an id from above.
if (script)
script.setAttribute('id', this._id);
// Assign a unique id to each scope .
this._id = PaperScope._id++;
PaperScope._scopes[this._id] = this;
if (!this.support) {
// Set up paper.support, as an object containing properties that
@ -189,15 +182,18 @@ var PaperScope = Base.extend(/** @lends PaperScope# */{
* Sets up an empty project for us. If a canvas is provided, it also creates
* a {@link View} for it, both linked to this scope.
*
* @param {HTMLCanvasElement} canvas The canvas this scope should be
* @param {HTMLCanvasElement} element the HTML canvas this scope should be
* associated with.
*/
setup: function(canvas) {
// Create an empty project for the scope.
setup: function(element) {
// Make sure this is the active scope, so the created project and view
// are automatically associated with it.
paper = this;
this.project = new Project(canvas);
// Link the element to this scope, so we can reuse the scope when
// compiling multiple scripts for the same element.
element.setAttribute('data-paper-scope', this._id);
// Create an empty project for the scope.
this.project = new Project(element);
// This is needed in PaperScript.load().
return this;
},
@ -247,9 +243,9 @@ var PaperScope = Base.extend(/** @lends PaperScope# */{
* @param id
*/
get: function(id) {
// If a script tag is passed, get the id from it.
// If an element is passed, get the id from it.
if (id && id.getAttribute)
id = id.getAttribute('id');
id = id.getAttribute('data-paper-scope');
return this._scopes[id] || null;
},

11
src/core/PaperScript.js
View file

@ -443,12 +443,13 @@ Base.exports.PaperScript = (function() {
// If a canvas id is provided, pass it on to the PaperScope
// so a project is created for it now.
var canvas = PaperScope.getAttribute(script, 'canvas'),
// See if there already is a scope for this canvas and reuse
// it, to support multiple scripts per canvas. Otherwise
// create a new one.
scope = PaperScope.get(canvas)
|| new PaperScope(script).setup(canvas),
src = script.src;
canvas = document.getElementById(canvas) || canvas;
// See if there already is a scope for this canvas and reuse
// it, to support multiple scripts per canvas. Otherwise
// create a new one.
var scope = PaperScope.get(canvas)
|| new PaperScope().setup(canvas);
if (src) {
// If we're loading from a source, request that first and
// then run later.

2
src/project/Project.js
View file

@ -43,7 +43,7 @@ var Project = PaperScopeItem.extend(/** @lends Project# */{
* Note that when working with PaperScript, a project is automatically
* created for us and the {@link PaperScope#project} variable points to it.
*
* @param {HTMLCanvasElement} element an HTML anvas element that should be
* @param {HTMLCanvasElement} element the HTML canvas element that should be
* used as the element for the view.
*/
initialize: function Project(element) {