diff --git a/ionic/components/nav/nav-item.js b/ionic/components/nav/nav-item.js index 7789bac680..908d25ec14 100644 --- a/ionic/components/nav/nav-item.js +++ b/ionic/components/nav/nav-item.js @@ -12,6 +12,7 @@ export class NavItem { this.Class = ComponentClass; this.params = params; this.id = util.nextUid(); + this.headers = []; this.created = false; } @@ -53,10 +54,17 @@ export class NavItem { return promise; } + addToolbar(position, toolbar) { + headers.push(toolbar); + } + destroy() { this.component && this.component._dispose && this.component._dispose(); - this.domElement = this.component = this.params = this.nav = null; + // just to help prevent possible large memory leaks + for (let prop in this) { + this[prop] = null; + } } } diff --git a/ionic/components/nav/nav.js b/ionic/components/nav/nav.js index 31ab33b9b1..634fd8da73 100644 --- a/ionic/components/nav/nav.js +++ b/ionic/components/nav/nav.js @@ -24,11 +24,8 @@ import {ToolbarContainer} from 'ionic/components/toolbar/toolbar'; - `, - directives: [HeaderContainer, ContentContainer, FooterContainer] + directives: [HeaderContainer, ContentContainer] }) export class Nav extends NavBase { @@ -69,15 +66,3 @@ class ContentContainer { }; } } - - -@Component({ - selector: 'footer-container' -}) -class FooterContainer { - constructor(@Ancestor() nav: Nav, elementRef: ElementRef) { - nav.footerContainer = { - elementRef: elementRef - }; - } -} diff --git a/ionic/components/nav/test/basic/pages/first-page.js b/ionic/components/nav/test/basic/pages/first-page.js index 6205f0d0b3..963c8818e1 100644 --- a/ionic/components/nav/test/basic/pages/first-page.js +++ b/ionic/components/nav/test/basic/pages/first-page.js @@ -1,13 +1,14 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {View} from 'angular2/src/core/annotations_impl/view'; -import {NavController} from 'ionic/ionic'; +import {NavController, Toolbar} from 'ionic/ionic'; import {SecondPage} from './second-page'; @Component({selector: 'ion-view'}) @View({ - templateUrl: 'pages/first-page.html' + templateUrl: 'pages/first-page.html', + directives: [Toolbar] }) export class FirstPage { constructor( diff --git a/ionic/components/nav/test/basic/pages/second-page.js b/ionic/components/nav/test/basic/pages/second-page.js index 0f3099da4d..9d9102ce11 100644 --- a/ionic/components/nav/test/basic/pages/second-page.js +++ b/ionic/components/nav/test/basic/pages/second-page.js @@ -1,14 +1,14 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {View} from 'angular2/src/core/annotations_impl/view'; -import {NavController, NavParams} from 'ionic/ionic'; +import {NavController, NavParams, Toolbar} from 'ionic/ionic'; import {ThirdPage} from './third-page'; @Component() @View({ templateUrl: 'pages/second-page.html', - directives: [] + directives: [Toolbar] }) export class SecondPage { constructor( diff --git a/ionic/components/nav/test/basic/pages/third-page.js b/ionic/components/nav/test/basic/pages/third-page.js index a4337ed5b2..5e4c0738e9 100644 --- a/ionic/components/nav/test/basic/pages/third-page.js +++ b/ionic/components/nav/test/basic/pages/third-page.js @@ -1,13 +1,13 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {View} from 'angular2/src/core/annotations_impl/view'; -import {NavController} from 'ionic/ionic'; +import {NavController, Toolbar} from 'ionic/ionic'; @Component() @View({ templateUrl: 'pages/third-page.html', - directives: [] + directives: [Toolbar] }) export class ThirdPage { constructor( diff --git a/ionic/components/toolbar/toolbar.js b/ionic/components/toolbar/toolbar.js index d3a6fe8dbb..caac6f0119 100644 --- a/ionic/components/toolbar/toolbar.js +++ b/ionic/components/toolbar/toolbar.js @@ -1,28 +1,14 @@ -import { - NgElement, - Component, - Decorator, - Viewport, - View, - ViewContainerRef, - //ProtoViewRef, - onDestroy, - Ancestor, - ElementRef, - onChange, -} from 'angular2/angular2'; -import {BackButton} from 'ionic/components/toolbar/back-button'; -import {IonicComponent} from 'ionic/config/component'; -import {NavController} from 'ionic/components/nav/nav-item'; +import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; +import {ElementRef} from 'angular2/src/core/compiler/element_ref'; +import {ViewContainerRef} from 'angular2/angular2'; + import * as dom from 'ionic/util/dom' +import {IonicComponent} from 'ionic/config/component'; +import {NavItem} from 'ionic/ionic'; import {Platform} from 'ionic/platform/platform'; -// FYI for later: -// https://github.com/angular/angular/commit/3aac2fefd7f93c74abfa5ee58aa0ea8d4840b519 - - -@Viewport({ +@Directive({ selector: '[ion-toolbar]', properties: { placement: 'placement' @@ -32,39 +18,35 @@ export class Toolbar { constructor( viewContainer: ViewContainerRef, - //protoViewRef: ProtoViewRef, elementRef: ElementRef, - @Ancestor() navCtrl: NavController, - element: NgElement - // context: Object TODO wait for angular to implement this + navItem: NavItem ) { this.viewContainer = viewContainer; this.elementRef = elementRef; - this.navCtrl = navCtrl; + this.navItem = navItem; console.log('Toolbar!'); // TODO use config to add these classes - dom.addClass(this.viewContainer.domElement, 'toolbar', `toolbar-${Platform.getMode()}`); + this.elementRef.domElement.classList.add('toolbar'); + this.elementRef.domElement.classList.add(`toolbar-${Platform.getMode()}`); // TODO Make a better way than this - if (/header/i.test(this.viewContainer.domElement.tagName)) { - this.placement = 'top'; - } else { + if (/footer/i.test(this.elementRef.domElement.tagName)) { this.placement = 'bottom'; + } else { + this.placement = 'top'; } } set placement(pos) { - this.viewContainer.domElement.classList.add(`toolbar-${pos}`); + this.elementRef.domElement.classList.add(`toolbar-${pos}`); + this.elementRef.domElement.setAttribute('placement', pos); + this._placement = pos; - this.navCtrl.addToolbar(this._placement, this); - this.viewContainer.domElement.setAttribute('placement', pos); + this.navItem.addToolbar(this._placement, this); } - onDestroy() { - this.navCtrl.removeToolbar(this); - } }