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

Allow PaperScript.load(script) to only load specific scripts, and define / improve documentation.

Browse source
This commit is contained in:
Jürg Lehni 2014-08-25 12:21:27 +02:00
parent 992366246d
commit c03e9961d2
1 changed files with 72 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

121
src/core/PaperScript.js
View file

@ -125,9 +125,9 @@ Base.exports.PaperScript = (function() {
* *
* @name PaperScript.compile * @name PaperScript.compile
* @function * @function
* @param {String} code The PaperScript code. * @param {String} code the PaperScript code.
* @param {String} url The url of the source, for source-map debugging. * @param {String} url the url of the source, for source-map debugging.
* @return {String} The compiled PaperScript as JavaScript code. * @return {String} the compiled PaperScript as JavaScript code.
*/ */
function compile(code, url, options) { function compile(code, url, options) {
if (!code) if (!code)
@ -335,9 +335,9 @@ Base.exports.PaperScript = (function() {
* *
* @name PaperScript.execute * @name PaperScript.execute
* @function * @function
* @param {String} code The PaperScript code. * @param {String} code the PaperScript code.
* @param {PaperScript} scope The scope for which the code is executed. * @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} url the url of the source, for source-map debugging.
*/ */
function execute(code, scope, url, options) { function execute(code, scope, url, options) {
// Set currently active scope. // Set currently active scope.
@ -446,57 +446,80 @@ Base.exports.PaperScript = (function() {
/*#*/ if (__options.environment == 'browser') { /*#*/ if (__options.environment == 'browser') {
function load() { function loadScript(script) {
Base.each(document.getElementsByTagName('script'), function(script) { debugger;
// Only load this script if it not loaded already. // Only load this script if it not loaded already.
// Support both text/paperscript and text/x-paperscript: // Support both text/paperscript and text/x-paperscript:
if (/^text\/(?:x-|)paperscript$/.test(script.type) if (/^text\/(?:x-|)paperscript$/.test(script.type)
&& !script.getAttribute('data-paper-ignore')) { && !script.getAttribute('data-paper-ignore')) {
// Produce a new PaperScope for this script now. Scopes are // Produce a new PaperScope for this script now. Scopes are cheap so
// cheap so let's not worry about the initial one that was // let's not worry about the initial one that was already created.
// already created. // Define an id for each PaperScript, so its scope can be retrieved
// Define an id for each PaperScript, so its scope can be // through PaperScope.get().
// retrieved through PaperScope.get(). // If a canvas id is provided, pass it on to the PaperScope so a
// If a canvas id is provided, pass it on to the PaperScope // project is created for it now.
// so a project is created for it now. var canvasId = PaperScope.getAttribute(script, 'canvas'),
var canvasId = PaperScope.getAttribute(script, 'canvas'), canvas = document.getElementById(canvasId),
canvas = document.getElementById(canvasId), src = script.src,
src = script.src, scopeKey = 'data-paper-scope';
scopeKey = 'data-paper-scope'; if (!canvas)
if (!canvas) throw new Error('Unable to find canvas with id "'
throw new Error('Unable to find canvas with id "' + canvasId + '"');
+ canvasId + '"'); // See if there already is a scope for this canvas and reuse it, to
// See if there already is a scope for this canvas and reuse // support multiple scripts per canvas. Otherwise create a new one.
// it, to support multiple scripts per canvas. Otherwise var scope = PaperScope.get(canvas.getAttribute(scopeKey))
// create a new one. || new PaperScope().setup(canvas);
var scope = PaperScope.get(canvas.getAttribute(scopeKey)) // Link the element to this scope, so we can reuse the scope when
|| new PaperScope().setup(canvas); // compiling multiple scripts for the same element.
// Link the element to this scope, so we can reuse the scope canvas.setAttribute(scopeKey, scope._id);
// when compiling multiple scripts for the same element. if (src) {
canvas.setAttribute(scopeKey, scope._id); // If we're loading from a source, request that first and then
if (src) { // run later.
// If we're loading from a source, request that first and Http.request('get', src, function(code) {
// then run later. execute(code, scope, src);
Http.request('get', src, function(code) { });
execute(code, scope, src); } else {
}); // We can simply get the code form the script tag.
} else { execute(script.innerHTML, scope, script.baseURI);
// 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);
} }
}, 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 // Catch cases where paper.js is loaded after the browser event has already
// occurred. // occurred.
if (document.readyState === 'complete') { if (document.readyState === 'complete') {
// Handle it asynchronously // Handle it asynchronously
setTimeout(load); setTimeout(loadAll);
} else { } else {
DomEvent.add(window, { load: load }); DomEvent.add(window, { load: loadAll });
} }
return { return {