From ba557acb4fbad8040f7cd4e5f537901729197ca5 Mon Sep 17 00:00:00 2001 From: "Manu Mtz.-Almeida" Date: Sat, 15 Oct 2016 02:59:57 +0200 Subject: [PATCH] fix(nav): ion-nav inside ion-content work properly --- src/components/content/content.ts | 4 +-- src/components/nav/test/basic/app-module.ts | 6 +++- .../nav/test/child-navs/app-module.ts | 7 ++-- src/components/nav/test/child-navs/e2e.ts | 0 src/components/tabs/tabs.ts | 4 +-- src/navigation/nav-controller-base.ts | 17 +++++---- src/navigation/view-controller.ts | 35 ++++++++++++++++++- src/transitions/page-transition.ts | 8 ++--- 8 files changed, 60 insertions(+), 21 deletions(-) create mode 100644 src/components/nav/test/child-navs/e2e.ts diff --git a/src/components/content/content.ts b/src/components/content/content.ts index edb29624bc..72816d800c 100644 --- a/src/components/content/content.ts +++ b/src/components/content/content.ts @@ -173,8 +173,8 @@ export class Content extends Ion { this._sbPadding = config.getBoolean('statusbarPadding', false); if (viewCtrl) { - viewCtrl._setContent(this); - viewCtrl._setContentRef(elementRef); + viewCtrl._setIONContent(this); + viewCtrl._setIONContentRef(elementRef); } } diff --git a/src/components/nav/test/basic/app-module.ts b/src/components/nav/test/basic/app-module.ts index 0682c77d75..4d66652cfa 100644 --- a/src/components/nav/test/basic/app-module.ts +++ b/src/components/nav/test/basic/app-module.ts @@ -40,7 +40,7 @@ export class MyCmpTest {} - + Toggle Can Leave @@ -174,6 +174,10 @@ export class FirstPage { }, 250); } + pop() { + this.navCtrl.pop().catch(() => {}); + } + viewDismiss() { this.viewCtrl.dismiss(); } diff --git a/src/components/nav/test/child-navs/app-module.ts b/src/components/nav/test/child-navs/app-module.ts index 39589206f9..0442a211f2 100644 --- a/src/components/nav/test/child-navs/app-module.ts +++ b/src/components/nav/test/child-navs/app-module.ts @@ -27,12 +27,15 @@ export class E2EApp { }) export class LandingPage { - constructor(public navCtrl: NavController) { - } + constructor(public navCtrl: NavController) {} goToPage() { this.navCtrl.push(FirstPage); } + + ionViewDidLoad() { + this.goToPage(); + } } @Component({ diff --git a/src/components/nav/test/child-navs/e2e.ts b/src/components/nav/test/child-navs/e2e.ts new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/components/tabs/tabs.ts b/src/components/tabs/tabs.ts index cfa3543372..5e723a98f5 100644 --- a/src/components/tabs/tabs.ts +++ b/src/components/tabs/tabs.ts @@ -421,8 +421,8 @@ export class Tabs extends Ion implements AfterViewInit { // to refresh the tabbar and content dimensions to be sure // they're lined up correctly if (alreadyLoaded && selectedPage) { - let content = selectedPage.getContent(); - if (content && content instanceof Content) { + let content = selectedPage.getIONContent(); + if (content) { content.resize(); } } diff --git a/src/navigation/nav-controller-base.ts b/src/navigation/nav-controller-base.ts index 69c82903f4..1ba32a73d4 100644 --- a/src/navigation/nav-controller-base.ts +++ b/src/navigation/nav-controller-base.ts @@ -175,20 +175,17 @@ 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; @@ -209,6 +206,7 @@ export class NavControllerBase extends Ion implements NavController { reject && reject(false, false, rejectReason); + this.setTransitioning(false); this._nextTrns(); }; @@ -248,6 +246,8 @@ export class NavControllerBase extends Ion implements NavController { if (!ti) { return false; } + // set that this nav is actively transitioning + this.setTransitioning(true); // Get entering and leaving views const leavingView = this.getActive(); @@ -325,7 +325,6 @@ export class NavControllerBase extends Ion implements NavController { _postViewInit(enteringView: ViewController, leavingView: ViewController, ti: TransitionInstruction, resolve: TransitionResolveFn) { const opts = ti.opts || {}; - const insertViews = ti.insertViews; const removeStart = ti.removeStart; @@ -822,8 +821,8 @@ export class NavControllerBase extends Ion implements NavController { swipeBackProgress(stepValue: number) { if (this._sbTrns && this._sbGesture) { // continue to disable the app while actively dragging - this._app.setEnabled(false, ACTIVE_TRANSITION_MAX_TIME); - this.setTransitioning(true, ACTIVE_TRANSITION_MAX_TIME); + this._app.setEnabled(false, ACTIVE_TRANSITION_DEFAULT); + this.setTransitioning(true); // set the transition animation's progress this._sbTrns.progressStep(stepValue); @@ -890,7 +889,7 @@ export class NavControllerBase extends Ion implements NavController { return (this._trnsTm > Date.now()); } - setTransitioning(isTransitioning: boolean, durationPadding: number = 2000) { + setTransitioning(isTransitioning: boolean, durationPadding: number = ACTIVE_TRANSITION_DEFAULT) { this._trnsTm = (isTransitioning ? (Date.now() + durationPadding + ACTIVE_TRANSITION_OFFSET) : 0); } @@ -962,5 +961,5 @@ export class NavControllerBase extends Ion implements NavController { let ctrlIds = -1; const DISABLE_APP_MINIMUM_DURATION = 64; -const ACTIVE_TRANSITION_MAX_TIME = 5000; +const ACTIVE_TRANSITION_DEFAULT = 5000; const ACTIVE_TRANSITION_OFFSET = 2000; diff --git a/src/navigation/view-controller.ts b/src/navigation/view-controller.ts index ae7cd0f0f7..32e245cc3a 100644 --- a/src/navigation/view-controller.ts +++ b/src/navigation/view-controller.ts @@ -6,6 +6,7 @@ import { Navbar } from '../components/navbar/navbar'; import { NavControllerBase } from './nav-controller-base'; import { NavOptions, ViewState } from './nav-util'; import { NavParams } from './nav-params'; +import { Content } from '../components/content/content'; /** @@ -28,6 +29,8 @@ import { NavParams } from './nav-params'; export class ViewController { private _cntDir: any; private _cntRef: ElementRef; + private _ionCntDir: Content; + private _ionCntRef: ElementRef; private _hdrDir: Header; private _ftrDir: Footer; private _isHidden: boolean = false; @@ -308,7 +311,7 @@ export class ViewController { /** * @returns {component} Returns the Page's Content component reference. */ - getContent() { + getContent(): any { return this._cntDir; } @@ -326,6 +329,36 @@ export class ViewController { return this._cntRef; } + /** + * @private + */ + _setIONContent(content: Content) { + this._setContent(content); + this._ionCntDir = content; + } + + /** + * @private + */ + getIONContent(): Content { + return this._ionCntDir; + } + + /** + * @private + */ + _setIONContentRef(elementRef: ElementRef) { + this._setContentRef(elementRef); + this._ionCntRef = elementRef; + } + + /** + * @private + */ + getIONContentRef(): ElementRef { + return this._ionCntRef; + } + /** * @private */ diff --git a/src/transitions/page-transition.ts b/src/transitions/page-transition.ts index 943d27190c..ef4f7b0da4 100644 --- a/src/transitions/page-transition.ts +++ b/src/transitions/page-transition.ts @@ -24,8 +24,8 @@ export class PageTransition extends Transition { * DOM READ */ readDimensions() { - const content = this.enteringView.getContent(); - if (content && content instanceof Content) { + const content = this.enteringView.getIONContent(); + if (content) { content.readDimensions(); } } @@ -34,8 +34,8 @@ export class PageTransition extends Transition { * DOM WRITE */ writeDimensions() { - const content = this.enteringView.getContent(); - if (content && content instanceof Content) { + const content = this.enteringView.getIONContent(); + if (content) { content.writeDimensions(); } }