mirror of
https://github.com/Hopiu/fabric.js.git
synced 2026-04-10 09:20:58 +00:00
fabric.util.animate is now defined in util/misc.js rather than util/dom_misc.js as it has nothing to do with DOM.
This commit is contained in:
kangax
parent
e48e341105
commit
2b3a166d2f
4 changed files with 2535 additions and 90 deletions
90
dist/all.js
vendored
90
dist/all.js
vendored
|
|
@ -1,6 +1,6 @@
|
|||
/*! Fabric.js Copyright 2008-2011, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
|
||||
|
||||
var fabric = fabric || { version: "0.3.2" };
|
||||
var fabric = fabric || { version: "0.3.3" };
|
||||
|
||||
/**
|
||||
* Wrapper around `console.log` (when available)
|
||||
|
|
@ -1627,11 +1627,55 @@ fabric.Observable = {
|
|||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Changes value from one to another within certain period of time, invoking callbacks as value is being changed.
|
||||
* @method animate
|
||||
* @memberOf fabric.util
|
||||
* @param {Object} [options] Animation options
|
||||
* @param {Function} [options.onChange] Callback; invoked on every value change
|
||||
* @param {Function} [options.onComplete] Callback; invoked when value change is completed
|
||||
* @param {Number} [options.startValue=0] Starting value
|
||||
* @param {Number} [options.endValue=100] Ending value
|
||||
* @param {Function} [options.easing] Easing function
|
||||
* @param {Number} [options.duration=500] Duration of change
|
||||
*/
|
||||
function animate(options) {
|
||||
|
||||
options || (options = { });
|
||||
|
||||
var start = +new Date(),
|
||||
duration = options.duration || 500,
|
||||
finish = start + duration, time, pos,
|
||||
onChange = options.onChange || function() { },
|
||||
abort = options.abort || function() { return false; },
|
||||
easing = options.easing || function(pos) { return (-Math.cos(pos * Math.PI) / 2) + 0.5; },
|
||||
startValue = 'startValue' in options ? options.startValue : 0,
|
||||
endValue = 'endValue' in options ? options.endValue : 100,
|
||||
isReversed = startValue > endValue;
|
||||
|
||||
options.onStart && options.onStart();
|
||||
|
||||
var interval = setInterval(function() {
|
||||
time = +new Date();
|
||||
pos = time > finish ? 1 : (time - start) / duration;
|
||||
onChange(isReversed
|
||||
? (startValue - (startValue - endValue) * easing(pos))
|
||||
: (startValue + (endValue - startValue) * easing(pos)));
|
||||
if (time > finish || abort()) {
|
||||
clearInterval(interval);
|
||||
options.onComplete && options.onComplete();
|
||||
}
|
||||
}, 10);
|
||||
|
||||
return interval;
|
||||
}
|
||||
|
||||
fabric.util.removeFromArray = removeFromArray;
|
||||
fabric.util.degreesToRadians = degreesToRadians;
|
||||
fabric.util.toFixed = toFixed;
|
||||
fabric.util.getRandomInt = getRandomInt;
|
||||
fabric.util.falseFunction = falseFunction;
|
||||
fabric.util.animate = animate;
|
||||
})();
|
||||
|
||||
if (!Array.prototype.indexOf) {
|
||||
|
|
@ -2445,56 +2489,12 @@ function getElementOffset(element) {
|
|||
}
|
||||
})();
|
||||
|
||||
/**
|
||||
* Changes value from one to another within certain period of time, invoking callbacks as value is being changed.
|
||||
* @method animate
|
||||
* @memberOf fabric.util
|
||||
* @param {Object} [options] Animation options
|
||||
* @param {Function} [options.onChange] Callback; invoked on every value change
|
||||
* @param {Function} [options.onComplete] Callback; invoked when value change is completed
|
||||
* @param {Number} [options.startValue=0] Starting value
|
||||
* @param {Number} [options.endValue=100] Ending value
|
||||
* @param {Function} [options.easing] Easing function
|
||||
* @param {Number} [options.duration=500] Duration of change
|
||||
*/
|
||||
function animate(options) {
|
||||
|
||||
options || (options = { });
|
||||
|
||||
var start = +new Date(),
|
||||
duration = options.duration || 500,
|
||||
finish = start + duration, time, pos,
|
||||
onChange = options.onChange || function() { },
|
||||
abort = options.abort || function() { return false; },
|
||||
easing = options.easing || function(pos) { return (-Math.cos(pos * Math.PI) / 2) + 0.5; },
|
||||
startValue = 'startValue' in options ? options.startValue : 0,
|
||||
endValue = 'endValue' in options ? options.endValue : 100,
|
||||
isReversed = startValue > endValue;
|
||||
|
||||
options.onStart && options.onStart();
|
||||
|
||||
var interval = setInterval(function() {
|
||||
time = +new Date();
|
||||
pos = time > finish ? 1 : (time - start) / duration;
|
||||
onChange(isReversed
|
||||
? (startValue - (startValue - endValue) * easing(pos))
|
||||
: (startValue + (endValue - startValue) * easing(pos)));
|
||||
if (time > finish || abort()) {
|
||||
clearInterval(interval);
|
||||
options.onComplete && options.onComplete();
|
||||
}
|
||||
}, 10);
|
||||
|
||||
return interval;
|
||||
}
|
||||
|
||||
fabric.util.getById = getById;
|
||||
fabric.util.toArray = toArray;
|
||||
fabric.util.makeElement = makeElement;
|
||||
fabric.util.addClass = addClass;
|
||||
fabric.util.wrapElement = wrapElement;
|
||||
fabric.util.getElementOffset = getElementOffset;
|
||||
fabric.util.animate = animate;
|
||||
|
||||
(function(){
|
||||
|
||||
|
|
|
|||
2445
docs/symbols/src/src_canvas.class.js.html
Normal file
2445
docs/symbols/src/src_canvas.class.js.html
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -197,53 +197,9 @@ function getElementOffset(element) {
|
|||
}
|
||||
})();
|
||||
|
||||
/**
|
||||
* Changes value from one to another within certain period of time, invoking callbacks as value is being changed.
|
||||
* @method animate
|
||||
* @memberOf fabric.util
|
||||
* @param {Object} [options] Animation options
|
||||
* @param {Function} [options.onChange] Callback; invoked on every value change
|
||||
* @param {Function} [options.onComplete] Callback; invoked when value change is completed
|
||||
* @param {Number} [options.startValue=0] Starting value
|
||||
* @param {Number} [options.endValue=100] Ending value
|
||||
* @param {Function} [options.easing] Easing function
|
||||
* @param {Number} [options.duration=500] Duration of change
|
||||
*/
|
||||
function animate(options) {
|
||||
|
||||
options || (options = { });
|
||||
|
||||
var start = +new Date(),
|
||||
duration = options.duration || 500,
|
||||
finish = start + duration, time, pos,
|
||||
onChange = options.onChange || function() { },
|
||||
abort = options.abort || function() { return false; },
|
||||
easing = options.easing || function(pos) { return (-Math.cos(pos * Math.PI) / 2) + 0.5; },
|
||||
startValue = 'startValue' in options ? options.startValue : 0,
|
||||
endValue = 'endValue' in options ? options.endValue : 100,
|
||||
isReversed = startValue > endValue;
|
||||
|
||||
options.onStart && options.onStart();
|
||||
|
||||
var interval = setInterval(function() {
|
||||
time = +new Date();
|
||||
pos = time > finish ? 1 : (time - start) / duration;
|
||||
onChange(isReversed
|
||||
? (startValue - (startValue - endValue) * easing(pos))
|
||||
: (startValue + (endValue - startValue) * easing(pos)));
|
||||
if (time > finish || abort()) {
|
||||
clearInterval(interval);
|
||||
options.onComplete && options.onComplete();
|
||||
}
|
||||
}, 10);
|
||||
|
||||
return interval;
|
||||
}
|
||||
|
||||
fabric.util.getById = getById;
|
||||
fabric.util.toArray = toArray;
|
||||
fabric.util.makeElement = makeElement;
|
||||
fabric.util.addClass = addClass;
|
||||
fabric.util.wrapElement = wrapElement;
|
||||
fabric.util.getElementOffset = getElementOffset;
|
||||
fabric.util.animate = animate;
|
||||
fabric.util.getElementOffset = getElementOffset;
|
||||
|
|
@ -68,10 +68,54 @@
|
|||
function falseFunction() {
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Changes value from one to another within certain period of time, invoking callbacks as value is being changed.
|
||||
* @method animate
|
||||
* @memberOf fabric.util
|
||||
* @param {Object} [options] Animation options
|
||||
* @param {Function} [options.onChange] Callback; invoked on every value change
|
||||
* @param {Function} [options.onComplete] Callback; invoked when value change is completed
|
||||
* @param {Number} [options.startValue=0] Starting value
|
||||
* @param {Number} [options.endValue=100] Ending value
|
||||
* @param {Function} [options.easing] Easing function
|
||||
* @param {Number} [options.duration=500] Duration of change
|
||||
*/
|
||||
function animate(options) {
|
||||
|
||||
options || (options = { });
|
||||
|
||||
var start = +new Date(),
|
||||
duration = options.duration || 500,
|
||||
finish = start + duration, time, pos,
|
||||
onChange = options.onChange || function() { },
|
||||
abort = options.abort || function() { return false; },
|
||||
easing = options.easing || function(pos) { return (-Math.cos(pos * Math.PI) / 2) + 0.5; },
|
||||
startValue = 'startValue' in options ? options.startValue : 0,
|
||||
endValue = 'endValue' in options ? options.endValue : 100,
|
||||
isReversed = startValue > endValue;
|
||||
|
||||
options.onStart && options.onStart();
|
||||
|
||||
var interval = setInterval(function() {
|
||||
time = +new Date();
|
||||
pos = time > finish ? 1 : (time - start) / duration;
|
||||
onChange(isReversed
|
||||
? (startValue - (startValue - endValue) * easing(pos))
|
||||
: (startValue + (endValue - startValue) * easing(pos)));
|
||||
if (time > finish || abort()) {
|
||||
clearInterval(interval);
|
||||
options.onComplete && options.onComplete();
|
||||
}
|
||||
}, 10);
|
||||
|
||||
return interval;
|
||||
}
|
||||
|
||||
fabric.util.removeFromArray = removeFromArray;
|
||||
fabric.util.degreesToRadians = degreesToRadians;
|
||||
fabric.util.toFixed = toFixed;
|
||||
fabric.util.getRandomInt = getRandomInt;
|
||||
fabric.util.falseFunction = falseFunction;
|
||||
fabric.util.animate = animate;
|
||||
})();
|
||||
Loading…
Reference in a new issue