diff --git a/src/browser/DomEvent.js b/src/browser/DomEvent.js index 941a4a02..0db05d93 100644 --- a/src/browser/DomEvent.js +++ b/src/browser/DomEvent.js @@ -122,24 +122,25 @@ DomEvent.requestAnimationFrame = new function() { return request(callback, element); // If not, do the callback handling ourself: callbacks.push([callback, element]); - if (!timer) { - // Installs interval timer that checks all callbacks. This results - // in faster animations than repeatedly installing timout timers. - timer = window.setInterval(function() { - // Checks all installed callbacks for element visibility and - // execute if needed. - for (var i = callbacks.length - 1; i >= 0; i--) { - var entry = callbacks[i], - func = entry[0], - element = entry[1]; - if (!element || (element.getAttribute('keepalive') == 'true' - || focused) && DomElement.isVisible(element)) { - // Handle callback and remove it from callbacks list. - callbacks.splice(i, 1); - func(Date.now()); - } + // We're done if there's already a timer installed + if (timer) + return; + // Installs interval timer that checks all callbacks. This results + // in faster animations than repeatedly installing timout timers. + timer = window.setInterval(function() { + // Checks all installed callbacks for element visibility and + // execute if needed. + for (var i = callbacks.length - 1; i >= 0; i--) { + var entry = callbacks[i], + func = entry[0], + el = entry[1]; + if (!el || (PaperScript.getAttribute(el, 'keepalive') == 'true' + || focused) && DomElement.isVisible(el)) { + // Handle callback and remove it from callbacks list. + callbacks.splice(i, 1); + func(Date.now()); } - }, 1000 / 60); - } + } + }, 1000 / 60); }; }; diff --git a/src/core/PaperScript.js b/src/core/PaperScript.js index 9d4e8efb..c9032d44 100644 --- a/src/core/PaperScript.js +++ b/src/core/PaperScript.js @@ -134,7 +134,7 @@ var PaperScript = this.PaperScript = new function() { if (typeof code !== 'string') { // If a canvas id is provided, create a project for it now, // so the active project is defined. - var canvas = code.getAttribute('canvas'); + var canvas = PaperScript.getAttribute(code, 'canvas'); if (canvas = canvas && document.getElementById(canvas)) { // Create an empty Project for this scope, and a view for the // canvas, both using the right paper scope @@ -230,7 +230,7 @@ var PaperScript = this.PaperScript = new function() { // Only load this script if it not loaded already. // TODO: support 'text/x-paperscript': if (script.type === 'text/paperscript' - && !script.getAttribute('loaded')) { + && !script.getAttribute('data-paper-loaded')) { // Produce a new PaperScope for this script now. Scopes are // cheap so let's not worry about the initial one that was // already created. @@ -244,17 +244,28 @@ var PaperScript = this.PaperScript = new function() { script.setAttribute('id', scope.id); evaluate(script, scope); // Mark script as loaded now. - script.setAttribute('loaded', true); + script.setAttribute('data-paper-loaded', true); } } } DomEvent.add(window, { load: load }); + // Produces helpers to e.g. check for both 'canvas' and 'data-paper-canvas' + // attributes: + function handleAttribute(name) { + name += 'Attribute'; + return function(el, attr) { + return el[name](attr) || el[name]('data-paper-' + attr); + } + } + return { compile: compile, evaluate: evaluate, - load: load + load: load, + getAttribute: handleAttribute('get'), + hasAttribute: handleAttribute('has') }; //#else // !BROWSER diff --git a/src/ui/View.js b/src/ui/View.js index 87dcdc7f..dd7b9165 100644 --- a/src/ui/View.js +++ b/src/ui/View.js @@ -39,7 +39,7 @@ var View = this.View = Base.extend(/** @lends View# */{ this._canvas = canvas; // If the canvas has the resize attribute, resize the it to fill the // window and resize it again whenever the user resizes the window. - if (canvas.attributes.resize) { + if (PaperScript.hasAttribute(canvas, 'resize')) { // Subtract canvas' viewport offset from the total size, to // stretch it in var offset = DomElement.getOffset(canvas, false, true), @@ -66,7 +66,7 @@ var View = this.View = Base.extend(/** @lends View# */{ : DomElement.getSize(canvas); } // TODO: Test this on IE: - if (canvas.attributes.stats) { + if (PaperScript.hasAttribute(canvas, 'stats')) { this._stats = new Stats(); // Align top-left to the canvas var element = this._stats.domElement,