diff --git a/js/animation/animation.js b/js/animation/animation.js
index 712521b486..a95612b192 100644
--- a/js/animation/animation.js
+++ b/js/animation/animation.js
@@ -85,6 +85,8 @@
duration: 500,
delay: 0,
repeat: -1,
+ reverse: false,
+ autoReverse: false,
step: function(percent) {},
@@ -116,7 +118,7 @@
return true;
}, function(droppedFrames, finishedAnimation) {
console.log('Finished anim:', droppedFrames, finishedAnimation);
- }, this.duration, tf, this.delay);
+ }, this.duration, tf, this.delay, this.reverse, this.repeat);
},
/**
@@ -133,12 +135,14 @@
* Signature of the method should be `function(percent) { return modifiedValue; }`
* @return {Integer} Identifier of animation. Can be used to stop it any time.
*/
- _run: function(stepCallback, verifyCallback, completedCallback, duration, easingMethod, delay) {
+ _run: function(stepCallback, verifyCallback, completedCallback, duration, easingMethod, delay, isReverse, repeat) {
var start = time();
var lastFrame = start;
var startTime = start + delay;
- var percent = 0;
+ var startPercent = isReverse === true ? 1 : 0;
+ var endPercent = isReverse === true ? 0 : 1;
+ var percent = startPercent;
var dropCounter = 0;
var id = counter++;
@@ -186,16 +190,23 @@
// Compute percent value
if (diff > delay && duration) {
percent = (diff - delay) / duration;
- if (percent > 1) {
- percent = 1;
+ if(isReverse === true) {
+ percent = 1 - percent;
+ if (percent < 0) {
+ percent = 0;
+ }
+ } else {
+ if (percent > 1) {
+ percent = 1;
+ }
}
}
// Execute step callback, then...
var value = easingMethod ? easingMethod(percent) : percent;
- if ((stepCallback(value, now, render) === false || percent === 1) && render) {
+ if ((stepCallback(value, now, render) === false || percent === endPercent) && render) {
running[id] = null;
- completedCallback && completedCallback(desiredFrames - (dropCounter / ((now - start) / millisecondsPerSecond)), id, percent === 1 || duration == null);
+ completedCallback && completedCallback(desiredFrames - (dropCounter / ((now - start) / millisecondsPerSecond)), id, percent === endPercent || duration == null);
} else if (render) {
lastFrame = now;
ionic.requestAnimationFrame(step);
diff --git a/test/html/animation.html b/test/html/animation.html
index 20e622ac5f..03926114d0 100644
--- a/test/html/animation.html
+++ b/test/html/animation.html
@@ -36,14 +36,22 @@
Repeat
+
+
+
+
+
@@ -63,8 +71,9 @@
];
$scope.anim = {
duration: 500,
- delay: 500,
+ delay: 0,
repeat: -1,
+ reverse: true,
autoReverse: false
}
var el = angular.element(document.querySelector('.box'));