javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(animation): ensure final inline styles applied when fallback runs

Browse Source 
Closes #5484
This commit is contained in:
Adam Bradley
2016-02-22 21:05:56 -06:00
parent c883a2ae91
commit 4524e5ad7d
1 changed files with 17 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
ionic/animations/animation.ts
View File

@ -257,7 +257,7 @@ export class Animation {
for (i = 0; i < self._pFns.length; i++) { for (i = 0; i < self._pFns.length; i++) {
self._pFns[i](); self._pFns[i]();
} }
this.isPlaying = true; self.isPlaying = true;
// this is the top level animation and is in full control // this is the top level animation and is in full control
// of when the async play() should actually kick off // of when the async play() should actually kick off
@ -271,7 +271,7 @@ export class Animation {
self._before(); self._before();
// ensure all past transition end events have been cleared // ensure all past transition end events have been cleared
this._clearAsync(); self._clearAsync();
if (duration > 30) { if (duration > 30) {
// this animation has a duration, so it should animate // this animation has a duration, so it should animate
@ -280,7 +280,7 @@ export class Animation {
// set the FROM properties // set the FROM properties
self._progress(0); self._progress(0);
self._willChange(true); self._willChg(true);
// set the async TRANSITION END event // set the async TRANSITION END event
// and run onFinishes when the transition ends // and run onFinishes when the transition ends
@ -364,7 +364,7 @@ export class Animation {
// set the after styles // set the after styles
self._after(); self._after();
self._willChange(false); self._willChg(false);
self._onFinish(shouldComplete); self._onFinish(shouldComplete);
} }
@ -372,12 +372,20 @@ export class Animation {
self._unregTrans = transitionEnd(self._transEl(), onTransitionEnd); self._unregTrans = transitionEnd(self._transEl(), onTransitionEnd);
// set a fallback timeout if the transition end event never fires // set a fallback timeout if the transition end event never fires
self._tmr = setTimeout(onTransitionEnd, duration + 300); self._tmr = setTimeout(function() {
// oh noz! the transition end event didn't fire in time!
// instead the fallback timer when first
// ensure the ending progress step gets rendered
self._progress(1);
// manually run transition end event
onTransitionEnd(null);
}, duration + 350);
} }
_clearAsync() { _clearAsync() {
this._unregTrans && this._unregTrans();
if (this._tmr) { if (this._tmr) {
this._unregTrans && this._unregTrans();
clearTimeout(this._tmr); clearTimeout(this._tmr);
this._tmr = 0; this._tmr = 0;
} }
@ -483,13 +491,13 @@ export class Animation {
} }
} }
_willChange(addWillChange: boolean) { _willChg(addWillChange: boolean) {
var i: number; var i: number;
var wc: string[]; var wc: string[];
var prop: string; var prop: string;
for (i = 0; i < this._c.length; i++) { for (i = 0; i < this._c.length; i++) {
this._c[i]._willChange(addWillChange); this._c[i]._willChg(addWillChange);
} }
if (this._wChg) { if (this._wChg) {
@ -652,7 +660,7 @@ export class Animation {
// the progress was already left off at the point that is finished // the progress was already left off at the point that is finished
// for example, the left menu was dragged all the way open already // for example, the left menu was dragged all the way open already
this._after(); this._after();
this._willChange(false); this._willChg(false);
this._onFinish(shouldComplete); this._onFinish(shouldComplete);
} else { } else {