Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-16 17:51:07 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Use requestAnimFrame polyfill instead of setInterval in fabric.util.animate. Add fabric.util.requestAnimFrame.

Browse source
This commit is contained in:
kangax 2011-12-08 09:15:37 -05:00
parent f3283cbb93
commit a8758ffbe1
6 changed files with 63 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
HEADER.js
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2011, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.7.1" };
var fabric = fabric || { version: "0.7.2" };
if (typeof exports != 'undefined') {
exports.fabric = fabric;

42
dist/all.js vendored
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2011, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.7.1" };
var fabric = fabric || { version: "0.7.2" };
if (typeof exports != 'undefined') {
exports.fabric = fabric;
@ -1849,19 +1849,36 @@ fabric.Observable = {
endValue = 'endValue' in options ? options.endValue : 100;
options.onStart && options.onStart();
var interval = setInterval(function() {
(function tick() {
time = +new Date();
pos = time > finish ? 1 : (time - start) / duration;
onChange(startValue + (endValue - startValue) * easing(pos));
if (time > finish || abort()) {
clearInterval(interval);
options.onComplete && options.onComplete();
}
}, 10);
return interval;
return;
}
requestAnimFrame(tick);
})();
}
/**
* requestAnimationFrame polyfill from http://paulirish.com/2011/requestanimationframe-for-smart-animating/
* @method requestAnimFrame
* @memberOf fabric.util
* @param {Function} callback Callback to invoke
* @param {DOMElement} element optional Element to associate with animation
*/
var requestAnimFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback, element) {
window.setTimeout(callback, 1000 / 60);
};
})();
/**
* Loads image element from given url and passes it to a callback
@ -1889,6 +1906,7 @@ fabric.Observable = {
fabric.util.getRandomInt = getRandomInt;
fabric.util.falseFunction = falseFunction;
fabric.util.animate = animate;
fabric.util.requestAnimFrame = requestAnimFrame;
fabric.util.loadImage = loadImage;
})();
(function() {
@ -4393,6 +4411,14 @@ fabric.util.string = {
*/
renderOnAddition: true,
/**
* Function that determines clipping of entire canvas area
* Being passed context as first argument. See clipping canvas area in https://github.com/kangax/fabric.js/wiki/FAQ
* @property
* @type Function
*/
clipTo: null,
/**
* @constant
* @type Number

4
dist/all.min.js vendored
View file

File diff suppressed because one or more lines are too long

BIN
dist/all.min.js.gz vendored
View file

Binary file not shown.

2
package.json
View file

@ -1,7 +1,7 @@
{
"name": "fabric",
"description": "Object model for HTML5 canvas, and SVG-to-canvas parser. Backed by jsdom and node-canvas.",
"version": "0.7.1",
"version": "0.7.2",
"author": "Juriy Zaytsev <kangax@gmail.com>",
"keywords": ["canvas", "graphic", "graphics", "SVG", "node-canvas", "parser", "HTML5", "object model"],
"repository": "git://github.com/kangax/fabric.js",

32
src/util/misc.js
View file

@ -100,19 +100,36 @@
endValue = 'endValue' in options ? options.endValue : 100;
options.onStart && options.onStart();
var interval = setInterval(function() {
(function tick() {
time = +new Date();
pos = time > finish ? 1 : (time - start) / duration;
onChange(startValue + (endValue - startValue) * easing(pos));
if (time > finish || abort()) {
clearInterval(interval);
options.onComplete && options.onComplete();
}
}, 10);
return interval;
return;
}
requestAnimFrame(tick);
})();
}
/**
* requestAnimationFrame polyfill from http://paulirish.com/2011/requestanimationframe-for-smart-animating/
* @method requestAnimFrame
* @memberOf fabric.util
* @param {Function} callback Callback to invoke
* @param {DOMElement} element optional Element to associate with animation
*/
var requestAnimFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback, element) {
window.setTimeout(callback, 1000 / 60);
};
})();
/**
* Loads image element from given url and passes it to a callback
@ -140,5 +157,6 @@
fabric.util.getRandomInt = getRandomInt;
fabric.util.falseFunction = falseFunction;
fabric.util.animate = animate;
fabric.util.requestAnimFrame = requestAnimFrame;
fabric.util.loadImage = loadImage;
})();