diff --git a/src/components/loading/loading-component.ts b/src/components/loading/loading-component.ts index 3ba4a3d1dc..347c767b31 100644 --- a/src/components/loading/loading-component.ts +++ b/src/components/loading/loading-component.ts @@ -4,7 +4,7 @@ import { Config } from '../../config/config'; import { isDefined, isUndefined } from '../../util/util'; import { NavParams } from '../../navigation/nav-params'; import { ViewController } from '../../navigation/view-controller'; - +import { LoadingOptions } from './loading-options'; /** * @private @@ -25,15 +25,7 @@ import { ViewController } from '../../navigation/view-controller'; encapsulation: ViewEncapsulation.None, }) export class LoadingCmp { - d: { - spinner?: string; - content?: string; - cssClass?: string; - showBackdrop?: boolean; - dismissOnPageChange?: boolean; - delay?: number; - duration?: number; - }; + d: LoadingOptions; id: number; showSpinner: boolean; durationTimeout: number; diff --git a/src/components/modal/modal-component.ts b/src/components/modal/modal-component.ts index bf4baf4038..5df724f0e3 100644 --- a/src/components/modal/modal-component.ts +++ b/src/components/modal/modal-component.ts @@ -30,7 +30,7 @@ export class ModalCmp { this._bdDismiss = _navParams.data.opts.enableBackdropDismiss; } - ngAfterViewInit() { + ionViewWillLoad() { this._load(this._navParams.data.component); } diff --git a/src/components/modal/test/basic/app-module.ts b/src/components/modal/test/basic/app-module.ts index 2e07515db2..557a0e80a6 100644 --- a/src/components/modal/test/basic/app-module.ts +++ b/src/components/modal/test/basic/app-module.ts @@ -130,12 +130,18 @@ export class E2EPage { +

ionViewDidLoad ({{called.ionViewDidLoad}})

+

ionViewWillEnter ({{called.ionViewWillEnter}})

+

ionViewDidEnter ({{called.ionViewDidEnter}})

+

ionViewWillLeave ({{called.ionViewWillLeave}})

+

ionViewDidLeave ({{called.ionViewDidLeave}})

`, providers: [SomeComponentProvider] }) export class ModalPassData { data: any; + called: any; constructor( public viewCtrl: ViewController, @@ -148,6 +154,14 @@ export class ModalPassData { name: someComponentProvider.getName() }; console.log('SomeAppProvider Data', someAppProvider.getData()); + + this.called = { + ionViewDidLoad: 0, + ionViewWillEnter: 0, + ionViewDidEnter: 0, + ionViewWillLeave: 0, + ionViewDidLeave: 0 + }; } submit() { @@ -157,10 +171,12 @@ export class ModalPassData { ionViewDidLoad() { console.log('ModalPassData ionViewDidLoad fired'); + this.called.ionViewDidLoad++; } ionViewWillEnter() { console.log('ModalPassData ionViewWillEnter fired'); + this.called.ionViewWillEnter++; } ionViewDidEnter() { @@ -169,14 +185,17 @@ export class ModalPassData { message: 'test toast', duration: 1000 }).present(); + this.called.ionViewDidEnter++; } ionViewWillLeave() { console.log('ModalPassData ionViewWillLeave fired'); + this.called.ionViewWillLeave++; } ionViewDidLeave() { console.log('ModalPassData ionViewDidLeave fired'); + this.called.ionViewDidLeave++; } } @@ -341,6 +360,11 @@ export class ContactUs {

+

ionViewDidLoad ({{called.ionViewDidLoad}})

+

ionViewWillEnter ({{called.ionViewWillEnter}})

+

ionViewDidEnter ({{called.ionViewDidEnter}})

+

ionViewWillLeave ({{called.ionViewWillLeave}})

+

ionViewDidLeave ({{called.ionViewDidLeave}})

@@ -353,6 +377,7 @@ export class ContactUs { }) export class ModalFirstPage { items: any[] = []; + called: any; constructor( public navCtrl: NavController, @@ -364,6 +389,14 @@ export class ModalFirstPage { value: (i + 1) }); } + + this.called = { + ionViewDidLoad: 0, + ionViewWillEnter: 0, + ionViewDidEnter: 0, + ionViewWillLeave: 0, + ionViewDidLeave: 0 + }; } push() { @@ -379,10 +412,12 @@ export class ModalFirstPage { ionViewDidLoad() { console.log('ModalFirstPage ionViewDidLoad fired'); + this.called.ionViewDidLoad++; } ionViewWillEnter() { console.log('ModalFirstPage ionViewWillEnter fired'); + this.called.ionViewWillEnter++; } ionViewDidEnter() { @@ -397,6 +432,15 @@ export class ModalFirstPage { ] }); alert.present(); + this.called.ionViewDidEnter++; + } + + ionViewWillLeave() { + this.called.ionViewWillLeave++; + } + + ionViewDidLeave() { + this.called.ionViewDidLeave++; } openActionSheet() { diff --git a/src/components/popover/popover-component.ts b/src/components/popover/popover-component.ts index 9efed77335..22118ed2cf 100644 --- a/src/components/popover/popover-component.ts +++ b/src/components/popover/popover-component.ts @@ -60,7 +60,7 @@ export class PopoverCmp { this.id = (++popoverIds); } - ngAfterViewInit() { + ionViewWillLoad() { let activeElement: any = document.activeElement; if (document.activeElement) { activeElement.blur(); diff --git a/src/navigation/nav-controller-base.ts b/src/navigation/nav-controller-base.ts index 946a074975..7adeaf9e15 100644 --- a/src/navigation/nav-controller-base.ts +++ b/src/navigation/nav-controller-base.ts @@ -187,17 +187,20 @@ export class NavControllerBase extends Ion implements NavController { } ti.resolve = (hasCompleted: boolean, isAsync: boolean, enteringName: string, leavingName: string, direction: string) => { + this.setTransitioning(false); + // transition has successfully resolved this._trnsId = null; resolve && resolve(hasCompleted, isAsync, enteringName, leavingName, direction); this._sbCheck(); // let's see if there's another to kick off - this.setTransitioning(false); this._nextTrns(); }; ti.reject = (rejectReason: any, trns: Transition) => { + this.setTransitioning(false); + // rut row raggy, something rejected this transition this._trnsId = null; this._queue.length = 0; @@ -218,7 +221,6 @@ export class NavControllerBase extends Ion implements NavController { reject && reject(false, false, rejectReason); - this.setTransitioning(false); this._nextTrns(); }; @@ -390,17 +392,9 @@ export class NavControllerBase extends Ion implements NavController { // batch all of lifecycles together var view = destroyQueue[i]; if (view && view !== enteringView && view !== leavingView) { - view._willLeave(); - this.viewWillLeave.emit(view); - this._app.viewWillLeave.emit(view); - - view._didLeave(); - this.viewDidLeave.emit(view); - this._app.viewDidLeave.emit(view); - - view._willUnload(); - this.viewWillUnload.emit(view); - this._app.viewWillUnload.emit(view); + this._willLeave(view); + this._didLeave(view); + this._willUnload(view); } } for (var i = 0; i < destroyQueue.length; i++) { @@ -571,20 +565,19 @@ export class NavControllerBase extends Ion implements NavController { _viewInsert(view: ViewController, componentRef: ComponentRef, viewport: ViewContainerRef) { // successfully finished loading the entering view - // fire off the "loaded" lifecycle events - view._didLoad(); - this.viewDidLoad.emit(view); - this._app.viewDidLoad.emit(view); + // fire off the "didLoad" lifecycle events + this._willLoad(view); + this._didLoad(view); // render the component ref instance to the DOM // ******** DOM WRITE **************** viewport.insert(componentRef.hostView, viewport.length); view._state = ViewState.PRE_RENDERED; - // the ElementRef of the actual ion-page created - const pageElement = componentRef.location.nativeElement; - if (view._cssClass) { + // the ElementRef of the actual ion-page created + var pageElement = componentRef.location.nativeElement; + // ******** DOM WRITE **************** this._renderer.setElementClass(pageElement, view._cssClass, true); } @@ -666,17 +659,8 @@ export class NavControllerBase extends Ion implements NavController { _viewsWillLifecycles(enteringView: ViewController, leavingView: ViewController) { // call each view's lifecycle events - if (enteringView) { - enteringView._willEnter(); - this.viewWillEnter.emit(enteringView); - this._app.viewWillEnter.emit(enteringView); - } - - if (leavingView) { - leavingView._willLeave(); - this.viewWillLeave.emit(leavingView); - this._app.viewWillLeave.emit(leavingView); - } + enteringView && this._willEnter(enteringView); + leavingView && this._willLeave(leavingView); } _trnsFinish(trns: Transition, opts: NavOptions, resolve: TransitionResolveFn) { @@ -690,16 +674,12 @@ export class NavControllerBase extends Ion implements NavController { // transition has completed (went from 0 to 1) if (trns.enteringView) { enteringName = trns.enteringView.name; - trns.enteringView._didEnter(); - this.viewDidEnter.emit(trns.enteringView); - this._app.viewDidEnter.emit(trns.enteringView); + this._didEnter(trns.enteringView); } if (trns.leavingView) { leavingName = trns.leavingView.name; - trns.leavingView._didLeave(); - this.viewDidLeave.emit(trns.leavingView); - this._app.viewDidLeave.emit(trns.leavingView); + this._didLeave(trns.leavingView); } this._cleanup(trns.enteringView); @@ -744,9 +724,7 @@ export class NavControllerBase extends Ion implements NavController { if (i > activeViewIndex) { // this view comes after the active view // let's unload it - view._willUnload(); - this.viewWillUnload.emit(view); - this._app.viewWillUnload.emit(view); + this._willUnload(view); view._destroy(this._renderer); } else if (i < activeViewIndex && !this._isPortal) { @@ -769,6 +747,47 @@ export class NavControllerBase extends Ion implements NavController { } } + _willLoad(view: ViewController) { + view._willLoad(); + } + + _didLoad(view: ViewController) { + view._didLoad(); + this.viewDidLoad.emit(view); + this._app.viewDidLoad.emit(view); + } + + _willEnter(view: ViewController) { + view._willEnter(); + this.viewWillEnter.emit(view); + this._app.viewWillEnter.emit(view); + } + + _didEnter(view: ViewController) { + view._didEnter(); + this.viewDidEnter.emit(view); + this._app.viewDidEnter.emit(view); + } + + _willLeave(view: ViewController) { + view._willLeave(); + this.viewWillLeave.emit(view); + this._app.viewWillLeave.emit(view); + } + + _didLeave(view: ViewController) { + view._didLeave(); + this.viewDidLeave.emit(view); + this._app.viewDidLeave.emit(view); + } + + _willUnload(view: ViewController) { + view._willUnload(); + this.viewWillUnload.emit(view); + this._app.viewWillUnload.emit(view); + } + + getActiveChildNav(): any { return this._children[this._children.length - 1]; } @@ -980,4 +999,4 @@ let ctrlIds = -1; const DISABLE_APP_MINIMUM_DURATION = 64; const ACTIVE_TRANSITION_MAX_TIME = 5000; -const ACTIVE_TRANSITION_OFFSET = 400; +const ACTIVE_TRANSITION_OFFSET = 2000; diff --git a/src/navigation/view-controller.ts b/src/navigation/view-controller.ts index 1e0ec901e8..eb2b142772 100644 --- a/src/navigation/view-controller.ts +++ b/src/navigation/view-controller.ts @@ -408,6 +408,13 @@ export class ViewController { } } + /** + * @private + */ + _willLoad() { + ctrlFn(this, 'WillLoad'); + } + /** * @private * The view has loaded. This event only happens once per view being