fix(transition): update disabling transitions

This commit is contained in:
Adam Bradley
2015-11-24 14:02:36 -06:00
parent b58d2e8dab
commit 424800a3c9
6 changed files with 45 additions and 42 deletions

View File

@ -16,7 +16,6 @@ export class IonicApp {
this._titleSrv = new Title();
this._title = '';
this._disTime = 0;
this._trnsTime = 0;
// Our component registry map
this.components = {};
@ -63,18 +62,6 @@ export class IonicApp {
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}
*/
isTransitioning() {
return (this._trnsTime > Date.now());
}
/**
* Register a known component with a key, for easy lookups later.
* @param {TODO} id The id to use to register the component

View File

@ -200,7 +200,6 @@ export class Menu extends Ion {
// user actively dragging the menu
if (this.isEnabled) {
this._prevent();
this.app.setTransitioning(true);
this._getType().setProgess(value);
this.opening.next(value);
}
@ -213,7 +212,6 @@ export class Menu extends Ion {
// user has finished dragging the menu
if (this.isEnabled) {
this._prevent();
this.app.setTransitioning(true);
this._getType().setProgressEnd(shouldComplete).then(isOpen => {
this._after(isOpen);
});
@ -231,7 +229,6 @@ export class Menu extends Ion {
this.getBackdropElement().classList.add('show-backdrop');
this._prevent();
this.app.setTransitioning(true);
this.keyboard.close();
}
}
@ -243,7 +240,6 @@ export class Menu extends Ion {
// keep opening/closing the menu disabled for a touch more yet
if (this.isEnabled) {
this._prevent();
this.app.setTransitioning(false);
this.isOpen = isOpen;

View File

@ -128,6 +128,7 @@ export class NavController extends Ion {
this.renderer = renderer;
this._views = [];
this._trnsTime = 0;
this._sbTrans = null;
this._sbEnabled = config.get('swipeBackEnabled') || false;
@ -142,6 +143,18 @@ export class NavController extends Ion {
]);
}
/**
* Boolean if the nav controller is actively transitioning or not.
* @return {bool}
*/
isTransitioning() {
return (this._trnsTime > Date.now());
}
setTransitioning(isTransitioning, fallback=700) {
this._trnsTime = (isTransitioning ? Date.now() + fallback : 0);
}
/**
* TODO
* @name NavController#push
@ -155,19 +168,18 @@ export class NavController extends Ion {
console.debug('invalid componentType to push');
return Promise.reject();
}
if (typeof componentType !== 'function') {
throw 'Loading component must be a component class, not "' + componentType.toString() + '"';
}
let now = Date.now();
let last = this.last();
if (last && last.componentType === componentType && now + 500 > this._lastPush) {
console.debug('same componentType pushed as active');
if (this.isTransitioning()) {
console.debug('nav controller actively transitioning');
return Promise.reject();
}
this._lastPush = now;
let resolve;
this.setTransitioning(true, 500);
let promise = null;
if (!callback) {
promise = new Promise(res => { callback = res; });
@ -225,6 +237,13 @@ export class NavController extends Ion {
return Promise.reject();
}
if (this.isTransitioning()) {
console.debug('nav controller actively transitioning');
return Promise.reject();
}
this.setTransitioning(true, 500);
let resolve;
let promise = new Promise(res => { resolve = res; });
@ -498,12 +517,11 @@ export class NavController extends Ion {
}
let duration = transAnimation.duration();
if (duration > 64) {
let enableApp = (duration < 64);
// block any clicks during the transition and provide a
// fallback to remove the clickblock if something goes wrong
self.app.setEnabled(false, duration);
self.app.setTransitioning(true, duration);
}
self.app.setEnabled(enableApp, duration);
self.setTransitioning(!enableApp, duration);
if (opts.pageType) {
transAnimation.before.addClass(opts.pageType);
@ -647,7 +665,7 @@ export class NavController extends Ion {
// disables the app during the transition
this.app.setEnabled(false);
this.app.setTransitioning(true);
this.setTransitioning(true);
// default the direction to "back"
let opts = {
@ -696,7 +714,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);
this.setTransitioning(true, 4000);
// set the transition animation's progress
this._sbTrans.progress(value);
@ -714,7 +732,7 @@ export class NavController extends Ion {
// disables the app during the transition
this.app.setEnabled(false);
this.app.setTransitioning(true);
this.setTransitioning(true);
this._sbTrans.progressEnd(completeSwipeBack, rate).then(() => {
@ -853,7 +871,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);
this.setTransitioning(false);
this._sbComplete();

View File

@ -117,6 +117,7 @@ export class Tabs extends Ion {
this._tabs = [];
this._id = ++tabIds;
this._ids = -1;
// Tabs may also be an actual ViewController which was navigated to
// if Tabs is static and not navigated to within a NavController
@ -151,7 +152,7 @@ export class Tabs extends Ion {
* @private
*/
add(tab) {
tab.id = this._id + '-' + (++_tabIds);
tab.id = this._id + '-' + (++this._ids);
this._tabs.push(tab);
return (this._tabs.length === 1);
@ -268,7 +269,7 @@ export class Tabs extends Ion {
}
let _tabIds = -1;
let tabIds = -1;
/**
@ -309,8 +310,6 @@ class TabButton extends Ion {
}
}
let tabIds = -1;
/**
* @private

View File

@ -56,7 +56,7 @@ export class Activator {
clearState() {
// all states should return to normal
if ((!this.app.isEnabled() || this.app.isTransitioning())) {
if (!this.app.isEnabled()) {
// 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

@ -1,5 +1,6 @@
import {Component, Directive, NgIf, forwardRef, Host, Optional, ElementRef, Renderer, Attribute} from 'angular2/angular2';
import {NavController} from '../nav/nav-controller';
import {Config} from '../../config/config';
import {Form} from '../../util/form';
import {Label} from './label';
@ -36,7 +37,8 @@ export class TextInput {
renderer: Renderer,
app: IonicApp,
platform: Platform,
@Optional() @Host() scrollView: Content
@Optional() @Host() scrollView: Content,
@Optional() navCtrl: NavController
) {
this.renderer = renderer;
@ -49,6 +51,7 @@ export class TextInput {
this.app = app;
this.elementRef = elementRef;
this.platform = platform;
this.navCtrl = navCtrl;
this.scrollView = scrollView;
this.scrollAssist = config.get('scrollAssist');
@ -83,7 +86,7 @@ export class TextInput {
let self = this;
self.scrollMove = (ev) => {
if (!self.app.isTransitioning()) {
if (!(this.navCtrl && this.navCtrl.isTransitioning())) {
self.deregMove();
if (self.hasFocus) {
@ -173,7 +176,7 @@ export class TextInput {
// do not allow any clicks while it's scrolling
let scrollDuration = getScrollAssistDuration(scrollData.scrollAmount);
this.app.setEnabled(false, scrollDuration);
this.app.setTransitioning(true, scrollDuration);
this.navCtrl && this.navCtrl.setTransitioning(true, scrollDuration);
// 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
@ -188,7 +191,7 @@ export class TextInput {
// all good, allow clicks again
this.app.setEnabled(true);
this.app.setTransitioning(false);
this.navCtrl && this.navCtrl.setTransitioning(false);
this.regMove();
});