fix(activator): ensure links active during transition

This commit is contained in:
Adam Bradley
2015-09-23 20:32:46 -05:00
parent 3f7b3aadef
commit 1a48cbec96
7 changed files with 42 additions and 13 deletions

View File

@ -41,7 +41,8 @@ export class IonicApp {
*/
constructor() {
this.overlays = [];
this._disableTime = 0;
this._disTime = 0;
this._trnsTime = 0;
// Our component registry map
this.components = {};
@ -63,9 +64,9 @@ export class IonicApp {
*/
focusHolder(val) {
if (arguments.length) {
this._focusHolder = val;
this._fcsHldr = val;
}
return this._focusHolder;
return this._fcsHldr;
}
/**
@ -89,16 +90,29 @@ export class IonicApp {
* something goes wrong during a transition and the app wasn't re-enabled correctly.
*/
setEnabled(isEnabled, fallback=700) {
this._disableTime = (isEnabled ? 0 : Date.now() + fallback);
this._disTime = (isEnabled ? 0 : Date.now() + fallback);
ClickBlock(!isEnabled, fallback + 100);
}
/**
* Boolean if the app is actively enabled or not.
* @return {bool}
*/
isEnabled() {
return (this._disTime < Date.now());
}
setTransitioning(isTransitioning, fallback=700) {
this._trnsTime = (isTransitioning ? Date.now() + fallback : 0);
}
/**
* Boolean if the app is actively transitioning or not.
* @return {bool}
*/
isEnabled() {
return (this._disableTime < Date.now());
isTransitioning() {
console.debug('isTransitioning', (this._trnsTime > Date.now()), this._trnsTime, Date.now())
return (this._trnsTime > Date.now());
}
/**

View File

@ -136,12 +136,14 @@ export class Menu extends Ion {
setProgess(value) {
// user actively dragging the menu
this._disable();
this.app.setTransitioning(true);
this._type.setProgess(value);
}
setProgressEnd(shouldComplete) {
// user has finished dragging the menu
this._disable();
this.app.setTransitioning(true);
this._type.setProgressEnd(shouldComplete).then(isOpen => {
this._after(isOpen);
});
@ -154,11 +156,13 @@ export class Menu extends Ion {
this.getBackdropElement().classList.add('show-backdrop');
this._disable();
this.app.setTransitioning(true);
}
_after(isOpen) {
// keep opening/closing the menu disabled for a touch more yet
this._disable();
this.app.setTransitioning(false);
this.isOpen = isOpen;

View File

@ -280,6 +280,7 @@ export class NavController extends Ion {
// block any clicks during the transition and provide a
// fallback to remove the clickblock if something goes wrong
this.app.setEnabled(false, duration);
this.app.setTransitioning(true, duration);
}
// start the transition
@ -318,6 +319,7 @@ export class NavController extends Ion {
// disables the app during the transition
this.app.setEnabled(false);
this.app.setTransitioning(true);
// default the direction to "back"
let opts = {
@ -364,6 +366,7 @@ export class NavController extends Ion {
if (this._sbTrans) {
// continue to disable the app while actively dragging
this.app.setEnabled(false, 4000);
this.app.setTransitioning(true, 4000);
// set the transition animation's progress
this._sbTrans.progress(value);
@ -380,13 +383,14 @@ export class NavController extends Ion {
// disables the app during the transition
this.app.setEnabled(false);
this.app.setTransitioning(true);
this._sbTrans.progressEnd(completeSwipeBack, rate).then(() => {
this.zone.run(() => {
// find the views that were entering and leaving
let enteringView = this.getStagedenteringView();
let leavingView = this.getStagedleavingView();
let enteringView = this.getStagedEnteringView();
let leavingView = this.getStagedLeavingView();
if (enteringView && leavingView) {
// finish up the animation
@ -520,6 +524,7 @@ export class NavController extends Ion {
// allow clicks again, but still set an enable time
// meaning nothing with this view controller can happen for XXms
this.app.setEnabled(true);
this.app.setTransitioning(false);
if (this.views.length === 1) {
this.elementRef.nativeElement.classList.add('has-views');
@ -585,7 +590,7 @@ export class NavController extends Ion {
* TODO
* @returns {TODO} TODO
*/
getStagedenteringView() {
getStagedEnteringView() {
for (let i = 0, ii = this.views.length; i < ii; i++) {
if (this.views[i].state === STAGED_ENTERING_STATE) {
return this.views[i];
@ -598,7 +603,7 @@ export class NavController extends Ion {
* TODO
* @returns {TODO} TODO
*/
getStagedleavingView() {
getStagedLeavingView() {
for (let i = 0, ii = this.views.length; i < ii; i++) {
if (this.views[i].state === STAGED_LEAVING_STATE) {
return this.views[i];

View File

@ -127,6 +127,7 @@ export class OverlayRef {
animation.before.addClass('show-overlay');
this.app.setEnabled(false, animation.duration());
this.app.setTransitioning(true, animation.duration());
this.app.zoneRunOutside(() => {
@ -134,6 +135,7 @@ export class OverlayRef {
this.app.zoneRun(() => {
this.app.setEnabled(true);
this.app.setTransitioning(false);
animation.dispose();
instance.onViewDidEnter && instance.onViewDidEnter();
resolve();
@ -159,6 +161,7 @@ export class OverlayRef {
animation.after.removeClass('show-overlay');
this.app.setEnabled(false, animation.duration());
this.app.setTransitioning(true, animation.duration());
animation.play().then(() => {
instance.onViewDidLeave && instance.onViewDidLeave();
@ -167,6 +170,7 @@ export class OverlayRef {
this._dispose();
this.app.setEnabled(true);
this.app.setTransitioning(false);
animation.dispose();
resolve();

View File

@ -35,7 +35,7 @@ export class Activator {
clearState() {
// all states should return to normal
if (!this.app.isEnabled() && this.clearAttempt < 30) {
if ((!this.app.isEnabled() || this.app.isTransitioning()) && this.clearAttempt < 30) {
// the app is actively disabled, so don't bother deactivating anything.
// this makes it easier on the GPU so it doesn't have to redraw any
// buttons during a transition. This will retry in XX milliseconds.

View File

@ -233,6 +233,7 @@ export class TextInput extends Ion {
// manually scroll the text input to the top
// do not allow any clicks while it's scrolling
this.app.setEnabled(false, SCROLL_INTO_VIEW_DURATION);
this.app.setTransitioning(true, SCROLL_INTO_VIEW_DURATION);
// temporarily move the focus to the focus holder so the browser
// doesn't freak out while it's trying to get the input in place
@ -247,6 +248,7 @@ export class TextInput extends Ion {
// all good, allow clicks again
this.app.setEnabled(true);
this.app.setTransitioning(false);
});
} else {

View File

@ -14,8 +14,8 @@ export class Transition extends Animation {
super();
// get the entering and leaving items
let enteringView = this.entering = nav.getStagedenteringView();
let leavingView = this.leaving = nav.getStagedleavingView();
let enteringView = this.entering = nav.getStagedEnteringView();
let leavingView = this.leaving = nav.getStagedLeavingView();
// create animation for the entering item's "ion-view" element
this.enteringView = new Animation(enteringView.viewElementRef());