i'm all about that base

ionic/components/nav/nav-base.js

@@ -12,19 +12,20 @@ import {bind} from 'angular2/di';
 import {NavController} from './nav-controller';
 import {NavItem, NavParams} from './nav-item';
 import {Pane, NavBarSection} from './pane';
-import {Transition, ClickBlock} from 'ionic/ionic';
+import {Transition} from '../../transitions/transition';
+import {ClickBlock} from '../../util/click-block';
 import * as util from 'ionic/util';
 
 
 export class NavBase {
 
   constructor(
-      parent: NavBase,
-      compiler: Compiler,
-      elementRef: ElementRef,
-      loader: DynamicComponentLoader,
-      injector: Injector
-    ) {
+    parent: NavBase,
+    compiler: Compiler,
+    elementRef: ElementRef,
+    loader: DynamicComponentLoader,
+    injector: Injector
+  ) {
 
     this.parent = parent;
     this.compiler = compiler;
@@ -43,10 +44,6 @@ export class NavBase {
     this.childIds = -1;
   }
 
-  initial(ComponentClass) {
-    this.push(ComponentClass);
-  }
-
   setPaneAnchor(elementRef) {
     this.anchorElementRef = elementRef;
   }

ionic/components/nav/nav.js

@@ -1,12 +1,11 @@
-import {Parent} from 'angular2/src/core/annotations_impl/visibility';
 import {Component, Directive, onInit} from 'angular2/src/core/annotations_impl/annotations';
-import {Optional} from 'angular2/src/di/annotations_impl';
 import {View} from 'angular2/src/core/annotations_impl/view';
+import {Optional} from 'angular2/src/di/annotations_impl';
+import {Parent} from 'angular2/src/core/annotations_impl/visibility';
+import {Compiler} from 'angular2/angular2';
 import {ElementRef} from 'angular2/src/core/compiler/element_ref';
 import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
 import {Injector} from 'angular2/di';
-import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
-import {Compiler} from 'angular2/angular2';
 
 import {NavBase} from './nav-base';
 import {IonicComponent} from '../../config/component';
@@ -25,31 +24,23 @@ import {IonicComponent} from '../../config/component';
   `,
   directives: [NavPaneAnchor]
 })
-export class Nav {
+export class Nav extends NavBase {
 
   constructor(
-      @Optional() parentNavBase: NavBase,
-      compiler:Compiler,
-      elementRef: ElementRef,
-      loader: DynamicComponentLoader,
-      injector: Injector
-    ) {
-    this.navBase = new NavBase(parentNavBase, compiler, elementRef, loader, injector);
+    @Optional() parentNavBase: NavBase,
+    compiler: Compiler,
+    elementRef: ElementRef,
+    loader: DynamicComponentLoader,
+    injector: Injector
+  ) {
+    super(parentNavBase, compiler, elementRef, loader, injector);
 
     this.domElement = elementRef.domElement;
     this.config = Nav.config.invoke(this);
   }
 
   onInit() {
-    this.navBase.initial(this.initial);
-  }
-
-  setPaneAnchor(elementRef) {
-    this.navBase.setPaneAnchor(elementRef);
-  }
-
-  addPane(pane) {
-    this.navBase.addPane(pane);
+    this.push(this.initial);
   }
 
 }
@@ -61,6 +52,6 @@ new IonicComponent(Nav, {});
 })
 class NavPaneAnchor {
   constructor(@Parent() nav: Nav, elementRef: ElementRef) {
-    nav.navBase.setPaneAnchor(elementRef);
+    nav.setPaneAnchor(elementRef);
   }
 }

ionic/components/tabs/tab-button.js

@@ -1,6 +1,5 @@
 import {Parent} from 'angular2/src/core/annotations_impl/visibility';
 import {Directive, onInit} from 'angular2/src/core/annotations_impl/annotations';
-import {View} from 'angular2/src/core/annotations_impl/view';
 
 import {Tabs} from './tabs';
 
@@ -32,6 +31,6 @@ export class TabButton {
   onClick(ev) {
     ev.stopPropagation();
     ev.preventDefault();
-    this.tabs.select(this.tab);
+    this.tabs.selectTab(this.tab);
   }
 }

ionic/components/tabs/tab.js

@@ -8,12 +8,11 @@ import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_compone
 import {Injector} from 'angular2/di';
 import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
 
-import {Nav} from '../nav/nav';
+import {Tabs} from './tabs';
 import {NavBase} from '../nav/nav-base';
 import {NavItem} from '../nav/nav-item';
-import {Tabs} from './tabs';
 import {Content} from '../content/content';
-import {IonicComponent} from 'ionic/config/component';
+import {IonicComponent} from '../../config/component';
 
 
 @Component({
@@ -40,25 +39,26 @@ import {IonicComponent} from 'ionic/config/component';
   `,
   directives: [TabContentAnchor]
 })
-export class Tab {
-  constructor(
-      @Parent() tabs: Tabs,
-      compiler: Compiler,
-      elementRef: ElementRef,
-      loader: DynamicComponentLoader,
-      injector: Injector,
-      viewContainerRef: ViewContainerRef
-    ) {
+export class Tab extends NavBase {
 
-    this.navBase = new NavBase(tabs.navBase, compiler, elementRef, loader, injector);
-    if (tabs.navBase.parent) {
-      this.sections = tabs.navBase.parent.panes['_n'].sections;
+  constructor(
+    @Parent() tabs: Tabs,
+    compiler: Compiler,
+    elementRef: ElementRef,
+    loader: DynamicComponentLoader,
+    injector: Injector,
+    viewContainerRef: ViewContainerRef
+  ) {
+
+    super(tabs, compiler, elementRef, loader, injector);
+    if (tabs.parent) {
+      this.sections = tabs.parent.panes['_n'].sections;
     }
 
-    this.item = new NavItem(this.navBase);
+    this.item = new NavItem(this);
     this.item.setInstance(this);
     this.item.setViewElement(elementRef.domElement);
-    tabs.add(this.item);
+    tabs.addTab(this.item);
     this.tabs = tabs;
 
     this.panelId = 'tab-panel-' + this.item.id;
@@ -68,27 +68,26 @@ export class Tab {
 
     this.viewContainerRef = viewContainerRef;
 
-    this.navBase.panes['_n'] = this;
+    this.panes['_n'] = this;
 
     this.domElement = elementRef.domElement;
-    this.config = Nav.config.invoke(this);
   }
 
   onInit() {
-    if ( this.tabs.navBase.isActive(this.item) || this.tabs.navBase.isStagedEntering(this.item) ) {
+    if ( this.tabs.isActive(this.item) || this.tabs.isStagedEntering(this.item) ) {
       this.loadInitial();
     }
   }
 
   loadInitial() {
     if (this.initial && !this._loaded) {
-      this.navBase.initial(this.initial);
+      this.push(this.initial);
       this._loaded = true;
     }
   }
 
   get isSelected() {
-    return this.tabs.navBase.isActive(this.item);
+    return this.tabs.isActive(this.item);
   }
 
 }

ionic/components/tabs/tabs.js

@@ -9,12 +9,11 @@ import {Injector} from 'angular2/di';
 import {NgFor} from 'angular2/angular2';
 import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
 
-import {IonicComponent} from '../../config/component';
-import {Tab} from './tab';
 import {TabButton} from './tab-button';
+import {NavBase} from '../nav/nav-base';
 import {Icon} from '../icon/icon';
 import {NavItem} from '../nav/nav-item';
-import {NavBase} from '../nav/nav-base';
+import {IonicComponent} from '../../config/component';
 
 
 @Component({
@@ -40,40 +39,41 @@ import {NavBase} from '../nav/nav-base';
   `,
   directives: [NgFor, TabButton, Icon]
 })
-export class Tabs {
+export class Tabs extends NavBase {
+
   constructor(
     @Optional() parentNavBase: NavBase,
-      compiler: Compiler,
-      elementRef: ElementRef,
-      loader: DynamicComponentLoader,
-      injector: Injector
+    compiler: Compiler,
+    elementRef: ElementRef,
+    loader: DynamicComponentLoader,
+    injector: Injector
   ) {
-    this.navBase = new NavBase(parentNavBase, compiler, elementRef, loader, injector);
+    super(parentNavBase, compiler, elementRef, loader, injector);
 
     this.domElement = elementRef.domElement;
     this.config = Tabs.config.invoke(this);
   }
 
-  add(tabItem) {
-    this.navBase.add(tabItem);
+  addTab(tabItem) {
+    this.add(tabItem);
 
-    if (this.navBase.length() === 1) {
-      this.select(0);
+    if (this.length() === 1) {
+      this.selectTab(0);
     }
   }
 
+  selectTab(tab) {
+    let item = null;
+    if (typeof tab === 'number') {
+      item = this.getByIndex(tab);
+    } else {
+      item = this.getByInstance(tab)
+    }
+    this.select(item);
+  }
+
   get tabs() {
-    return this.navBase.instances();
-  }
-
-  select(tab) {
-    let item = null;
-    if (typeof tab === 'number') {
-      item = this.navBase.getByIndex(tab);
-    } else {
-      item = this.navBase.getByInstance(tab)
-    }
-    this.navBase.select(item);
+    return this.instances();
   }
 
 }

ionic/components/view/view.scss.orig

@@ -1,30 +0,0 @@
-
-ion-view {
-  display: flex;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-
-  background-color: white;
-<<<<<<< HEAD
-=======
-
-  // by default this is display: none;
-  // and the transition animation will display it
-  //display: none;
-  flex-direction: column;
-
-  display: flex;
-
-  /*
-  TODO: This is probably not the most common case,
-        should be display flex first, then remove for special cases.
-  &.show-view {
-    display: flex;
-  }
-  */
-
->>>>>>> origin/master
-}