diff --git a/ionic/collide/animation-percent.js b/ionic/collide/animation-percent.js
deleted file mode 100644
index c91822c33d..0000000000
--- a/ionic/collide/animation-percent.js
+++ /dev/null
@@ -1,58 +0,0 @@
-/* Forked from Collide.js, MIT License. Julian Shapiro http://twitter.com/shapiro */
-
-import {Collide} from './collide'
-
-
-export function animationPercent(percent, elements, options, propertiesMap) {
-
- if (!elements || !elements.length) {
- return;
- }
-
- /* The length of the element set (in the form of a nodeList or an array of elements) is defaulted to 1 in case a
- single raw DOM element is passed in (which doesn't contain a length property). */
- var elementsLength = elements.length;
- var elementsIndex = 0;
- var eleData;
-
-
- /**********************************
- Animation Call-Wide Variables
- **********************************/
-
- /* A container for CSS unit conversion ratios (e.g. %, rem, and em ==> px) that is used to cache ratios across all elements
- being animated in a single Collide call. Calculating unit ratios necessitates DOM querying and updating, and is therefore
- avoided (via caching) wherever possible. This container is call-wide instead of page-wide to avoid the risk of using stale
- conversion metrics across Collide animations that are not immediately consecutively chained. */
- var callUnitConversionData = {
- lastParent: null,
- lastPosition: null,
- lastFontSize: null,
- lastPercentToPxWidth: null,
- lastPercentToPxHeight: null,
- lastEmToPx: null,
- remToPx: null,
- vwToPx: null,
- vhToPx: null
- };
-
- /* A container for all the ensuing tween data and metadata associated with this call. This container gets pushed to the page-wide
- Collide.State.calls array that is processed during animation ticking. */
- var call = [];
-
-
- /**************************
- Element Set Iteration
- **************************/
-
- if (elements && elements.length) {
- for (var i = 0, l = elements.length; i < l; i++) {
- if (elements[i] && elements[i].parentElement) {
-
- //animationProcess('percent', elements, i, options, propertiesMap, callUnitConversionData, call)
-
- }
- }
- }
-
-};
diff --git a/ionic/collide/animation-stop.js b/ionic/collide/animation-stop.js
index ec6321d94b..c3d1315401 100644
--- a/ionic/collide/animation-stop.js
+++ b/ionic/collide/animation-stop.js
@@ -5,10 +5,6 @@ import {Collide} from './collide'
export function animationStop(elements, options, propertiesMap) {
- if (!elements || !elements.length) {
- return Promise.resolve();
- }
-
var eleData;
@@ -120,6 +116,5 @@ export function animationStop(elements, options, propertiesMap) {
completeCall(j, true);
});
- return Promise.reject();
}
};
diff --git a/ionic/collide/animation.js b/ionic/collide/animation.js
index f91f2b450e..4d63b9decc 100644
--- a/ionic/collide/animation.js
+++ b/ionic/collide/animation.js
@@ -1,14 +1,12 @@
import {Collide} from './collide'
import {animationStart} from './animation-start'
import {animationStop} from './animation-stop'
-import {animationPercent} from './animation-percent'
import {startTick} from './tick'
export class Animation {
constructor() {
this._elements = null;
-
this._options = {};
this._properties = {};
}
@@ -35,13 +33,12 @@ export class Animation {
}
stop() {
- let promise = animationStop(this._elements, this._options, this._properties);
-
- return promise;
+ animationStop(this._elements, this._options, this._properties);
}
percent(ratio) {
- animationPercent(ratio, this._elements, this._options, this._properties);
+ this._options.percentComplete = parseFloat(ratio);
+ animationStart(this._elements, this._options, this._properties);
}
diff --git a/ionic/collide/collide.js b/ionic/collide/collide.js
index c81386a386..b9799252f1 100644
--- a/ionic/collide/collide.js
+++ b/ionic/collide/collide.js
@@ -37,7 +37,8 @@ export let Collide = {
easing: 'swing',
begin: undefined,
complete: undefined,
- progress: undefined,
+ percentComplete: undefined,
+ percent: undefined,
display: undefined,
visibility: undefined,
loop: false,
diff --git a/ionic/collide/tick.js b/ionic/collide/tick.js
index f943940af0..0c01343c3e 100644
--- a/ionic/collide/tick.js
+++ b/ionic/collide/tick.js
@@ -25,6 +25,9 @@ function tick(timestamp) {
calls being animated out of sync with any elements animated immediately thereafter. In short, we ignore
the first RAF tick pass so that elements being immediately consecutively animated -- instead of simultaneously animated
by the same Collide call -- are properly batched into the same initial RAF tick and consequently remain in sync thereafter. */
+
+ var percentCompleteStop = false;
+
if (timestamp) {
/* We ignore RAF's high resolution timestamp since it can be significantly offset when the browser is
under high stress; we opt for choppiness over allowing the browser to drop huge chunks of frames. */
@@ -79,8 +82,16 @@ function tick(timestamp) {
/* The tween's completion percentage is relative to the tween's start time, not the tween's start value
(which would result in unpredictable tween durations since JavaScript's timers are not particularly accurate).
Accordingly, we ensure that percentComplete does not exceed 1. */
- var percentComplete = Math.min((timeCurrent - timeStart) / opts.duration, 1);
+ debugger
+ var percentComplete;
+ if (opts.percentComplete !== undefined) {
+ percentCompleteStop = true;
+ percentComplete = opts.percentComplete;
+ opts.percentComplete = undefined;
+ } else {
+ percentComplete = Math.min((timeCurrent - timeStart) / opts.duration, 1);
+ }
/**********************
Element Iteration
@@ -265,7 +276,7 @@ function tick(timestamp) {
} // END: if (timestamp)
/* Note: completeCall() sets the isTicking flag to false when the last call on Collide.State.calls has completed. */
- if (Collide.State.isTicking) {
+ if (Collide.State.isTicking || percentCompleteStop) {
dom.raf(tick);
}
diff --git a/ionic/components/app/test/animations/main.html b/ionic/components/app/test/animations/main.html
index ad7fc14c72..c01749a204 100644
--- a/ionic/components/app/test/animations/main.html
+++ b/ionic/components/app/test/animations/main.html
@@ -13,7 +13,7 @@