diff --git a/ionic/components/content/content.scss b/ionic/components/content/content.scss index 8f31081dd3..cec8ae1b55 100644 --- a/ionic/components/content/content.scss +++ b/ionic/components/content/content.scss @@ -2,14 +2,9 @@ // Content // -------------------------------------------------- -$content-container-background-color: $background-color !default; $content-background-color: $background-color !default; -.content-container { - background-color: $content-container-background-color; -} - ion-content { position: relative; display: block; diff --git a/ionic/components/content/modes/ios.scss b/ionic/components/content/modes/ios.scss deleted file mode 100644 index 97b67f74f7..0000000000 --- a/ionic/components/content/modes/ios.scss +++ /dev/null @@ -1,20 +0,0 @@ - -// iOS Content -// -------------------------------------------------- - -/*$content-container-ios-background-color: #000 !default; -$content-ios-background-color: #efeff4 !default; - - -.nav[mode=ios].show-pane { - - .content-container { - background-color: $content-container-ios-background-color; - } - - ion-content { - background-color: $content-ios-background-color; - } - -} -*/ diff --git a/ionic/components/nav/pane.ts b/ionic/components/nav/pane.ts index dea4cdf88b..63378de167 100644 --- a/ionic/components/nav/pane.ts +++ b/ionic/components/nav/pane.ts @@ -10,7 +10,7 @@ import {PaneAnchor, PaneContentAnchor, NavBarContainer} from './anchors'; export class PaneController { constructor(viewCtrl: ViewController) { - this.panes = {}; + this.panes = []; this.viewCtrl = viewCtrl; this.bindings = Injector.resolve([ @@ -25,26 +25,33 @@ export class PaneController { let key = itemStructure.key; let viewCtrl = this.viewCtrl; - let pane = this.panes[key]; + let pane = this.panes[this.panes.length - 1]; - if (pane) { - // nav pane which the entering component already exists + if (pane && pane.key === key) { + // the last pane's structure is the same as the one the item needs to go in callback(pane); } else { // create a new nav pane - this.panes[key] = null; + viewCtrl.loader.loadNextToLocation(Pane, viewCtrl.anchorElementRef(), this.bindings).then((componentRef) => { + // get the pane reference + pane = this.newPane; + this.newPane = null; - viewCtrl.loader.loadNextToLocation(Pane, viewCtrl.anchorElementRef(), this.bindings).then(() => { - - // get the pane reference by name - pane = this.panes[key]; let sectionAnchorElementRef = pane && pane.sectionAnchorElementRef; if (!sectionAnchorElementRef) { return callback(); } + pane.key = key; + pane.dispose = () => { + componentRef.dispose(); + this.panes.splice(this.panes.indexOf(pane), 1); + }; + + this.panes.push(pane); + let promises = []; let sectionsToAdd = []; @@ -81,12 +88,7 @@ export class PaneController { } add(pane) { - for (let np in this.panes) { - if (this.panes[np] === null) { - this.panes[np] = pane; - return; - } - } + this.newPane = pane; } } @@ -95,7 +97,7 @@ export class PaneController { selector: 'ion-pane', classId: 'nav', host: { - ['[class.show-pane]']: 'showPane' + '[style.z-index]': 'zIndex', } }) @View({ @@ -115,15 +117,9 @@ export class Pane extends Ion { ionicConfig: IonicConfig ) { super(elementRef, ionicConfig); - viewCtrl.panes.add(this); + this.totalItems = 0; + this.zIndex = ++viewCtrl.zIndexes; } - set showPane(val) { - this._showPane = val; - } - - get showPane() { - return this._showPane; - } } diff --git a/ionic/components/nav/test/basic/pages/second-page.ts b/ionic/components/nav/test/basic/pages/second-page.ts index b005a3e7c7..d342e20f85 100644 --- a/ionic/components/nav/test/basic/pages/second-page.ts +++ b/ionic/components/nav/test/basic/pages/second-page.ts @@ -5,8 +5,9 @@ import {FirstPage} from './first-page'; @IonicView({ template: ` - Second Page Header +

Second page

+

This page does not have a nav bar!

diff --git a/ionic/components/view/view-controller.ts b/ionic/components/view/view-controller.ts index fc282b19bf..af22013f9e 100644 --- a/ionic/components/view/view-controller.ts +++ b/ionic/components/view/view-controller.ts @@ -42,6 +42,7 @@ export class ViewController extends Ion { this.id = ++ctrlIds; this._ids = -1; + this.zIndexes = -1; // build a new injector for child ViewItems to use this.bindings = Injector.resolve([ diff --git a/ionic/components/view/view-item.ts b/ionic/components/view/view-item.ts index cc6e33d448..5984369054 100644 --- a/ionic/components/view/view-item.ts +++ b/ionic/components/view/view-item.ts @@ -74,11 +74,18 @@ export class ViewItem { contentContainer.createHostView(hostProtoViewRef, -1, bindings); var newLocation = viewCtrl.viewMngr.getHostElement(hostViewRef); var newComponent = viewCtrl.viewMngr.getComponent(newLocation); + pane.totalItems++; var dispose = () => { var index = contentContainer.indexOf(hostViewRef); if (index !== -1) { contentContainer.remove(index); + + // remove the pane if there are no view items left + pane.totalItems--; + if (pane.totalItems === 0) { + pane.dispose(); + } } }; this.disposals.push(dispose); @@ -100,7 +107,10 @@ export class ViewItem { let navbarView = navbarViewContainer.createEmbeddedView(navbarTemplateRef, -1); this.disposals.push(() => { - navbarViewContainer.remove( navbarViewContainer.indexOf(navbarView) ); + let index = navbarViewContainer.indexOf(navbarView); + if (index > -1) { + navbarViewContainer.remove(index); + } }); } @@ -280,9 +290,6 @@ export class ViewItem { will fire, whether it was the first load or loaded from the cache. */ didEnter() { - if (this.pane) { - this.pane.showPane = true; - } let navbarView = this.navbarView(); if (navbarView) { navbarView.didEnter(); diff --git a/ionic/ionic.ios.scss b/ionic/ionic.ios.scss index 5a4a869dd8..138b026348 100644 --- a/ionic/ionic.ios.scss +++ b/ionic/ionic.ios.scss @@ -6,7 +6,6 @@ "components/action-menu/modes/ios", "components/card/modes/ios", "components/checkbox/modes/ios", - "components/content/modes/ios", "components/list/modes/ios", "components/text-input/modes/ios", "components/nav-bar/modes/ios",