From c03e9961d2c2ec46b5e8ac334a6d1b701f63512b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=BCrg=20Lehni?= Date: Mon, 25 Aug 2014 12:21:27 +0200 Subject: [PATCH] Allow PaperScript.load(script) to only load specific scripts, and define / improve documentation. --- src/core/PaperScript.js | 121 ++++++++++++++++++++++++---------------- 1 file changed, 72 insertions(+), 49 deletions(-) diff --git a/src/core/PaperScript.js b/src/core/PaperScript.js index 5e87f3fb..508ae03c 100644 --- a/src/core/PaperScript.js +++ b/src/core/PaperScript.js @@ -125,9 +125,9 @@ Base.exports.PaperScript = (function() { * * @name PaperScript.compile * @function - * @param {String} code The PaperScript code. - * @param {String} url The url of the source, for source-map debugging. - * @return {String} The compiled PaperScript as JavaScript code. + * @param {String} code the PaperScript code. + * @param {String} url the url of the source, for source-map debugging. + * @return {String} the compiled PaperScript as JavaScript code. */ function compile(code, url, options) { if (!code) @@ -335,9 +335,9 @@ Base.exports.PaperScript = (function() { * * @name PaperScript.execute * @function - * @param {String} code The PaperScript code. - * @param {PaperScript} scope The scope for which the code is executed. - * @param {String} url The url of the source, for source-map debugging. + * @param {String} code the PaperScript code. + * @param {PaperScript} scope the scope for which the code is executed. + * @param {String} url the url of the source, for source-map debugging. */ function execute(code, scope, url, options) { // Set currently active scope. @@ -446,57 +446,80 @@ Base.exports.PaperScript = (function() { /*#*/ if (__options.environment == 'browser') { - function load() { - Base.each(document.getElementsByTagName('script'), function(script) { - // Only load this script if it not loaded already. - // Support both text/paperscript and text/x-paperscript: - if (/^text\/(?:x-|)paperscript$/.test(script.type) - && !script.getAttribute('data-paper-ignore')) { - // Produce a new PaperScope for this script now. Scopes are - // cheap so let's not worry about the initial one that was - // already created. - // Define an id for each PaperScript, so its scope can be - // 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 canvasId = PaperScope.getAttribute(script, 'canvas'), - canvas = document.getElementById(canvasId), - src = script.src, - scopeKey = 'data-paper-scope'; - if (!canvas) - throw new Error('Unable to find canvas with id "' - + canvasId + '"'); - // 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.getAttribute(scopeKey)) - || new PaperScope().setup(canvas); - // Link the element to this scope, so we can reuse the scope - // when compiling multiple scripts for the same element. - canvas.setAttribute(scopeKey, scope._id); - if (src) { - // If we're loading from a source, request that first and - // then run later. - Http.request('get', src, function(code) { - execute(code, scope, src); - }); - } else { - // We can simply get the code form the script tag. - execute(script.innerHTML, scope, script.baseURI); - } - // Mark script as loaded now. - script.setAttribute('data-paper-ignore', true); + function loadScript(script) { + debugger; + // Only load this script if it not loaded already. + // Support both text/paperscript and text/x-paperscript: + if (/^text\/(?:x-|)paperscript$/.test(script.type) + && !script.getAttribute('data-paper-ignore')) { + // Produce a new PaperScope for this script now. Scopes are cheap so + // let's not worry about the initial one that was already created. + // Define an id for each PaperScript, so its scope can be 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 canvasId = PaperScope.getAttribute(script, 'canvas'), + canvas = document.getElementById(canvasId), + src = script.src, + scopeKey = 'data-paper-scope'; + if (!canvas) + throw new Error('Unable to find canvas with id "' + + canvasId + '"'); + // 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.getAttribute(scopeKey)) + || new PaperScope().setup(canvas); + // Link the element to this scope, so we can reuse the scope when + // compiling multiple scripts for the same element. + canvas.setAttribute(scopeKey, scope._id); + if (src) { + // If we're loading from a source, request that first and then + // run later. + Http.request('get', src, function(code) { + execute(code, scope, src); + }); + } else { + // We can simply get the code form the script tag. + execute(script.innerHTML, scope, script.baseURI); } - }, this); + // Mark script as loaded now. + script.setAttribute('data-paper-ignore', true); + } + } + + function loadAll() { + Base.each(document.getElementsByTagName('script'), loadScript); + } + + /** + * Loads, compiles and executes PaperScript code in the HTML document. + * Note that this method is executed automatically for all scripts in the + * document through a window load event. You can optionally call it earlier + * (e.g. from a DOM ready event), or you can mark scripts to be ignored by + * setting their attribute {@code data-paper-ignore="true"}, and call the + * {@code PaperScript.load(script)} method for each script separately when + * needed. + * + * @name PaperScript.load + * @function + * @param {HTMLScriptElement} script the script to load. If none is + * provided, all scripts of the HTML document are iterated over and loaded. + */ + function load(script) { + if (script) { + loadScript(script); + } else { + loadAll(); + } } // Catch cases where paper.js is loaded after the browser event has already // occurred. if (document.readyState === 'complete') { // Handle it asynchronously - setTimeout(load); + setTimeout(loadAll); } else { - DomEvent.add(window, { load: load }); + DomEvent.add(window, { load: loadAll }); } return {