tabs fixes

playground/tabs/main.js

@@ -1,7 +1,9 @@
 import {bootstrap} from 'angular2/core';
 import {Component, Template} from 'angular2/angular2';
-import {View, Content} from 'ionic/components/view/view';
+import {View} from 'ionic/components/view/view';
-import {Tabs, Tab} from 'ionic/components/tabs/tabs';
+import {Content} from 'ionic/components/view/content';
+import {Tabs} from 'ionic/components/tabs/tabs';
+import {Tab} from 'ionic/components/tabs/tab';
 
 @Component({ selector: '[ion-app]' })
 @Template({
@@ -10,7 +12,7 @@ import {Tabs, Tab} from 'ionic/components/tabs/tabs';
 })
 class IonicApp {
   constructor() {
-    console.log('IonicApp Start');
+    console.log('IonicApp Start')
   }
 }
 

src/components/nav-view/nav-view.js

@@ -0,0 +1,23 @@
+import {Ion} from '../ion'
+
+export class NavView extends Ion {
+
+  // viewControllers: Stack<ViewController>;
+  //   visibleViewController: ViewController;
+
+  //   push(viewController) {
+  //     stack.push(viewController)
+  //   }
+  //   pop(viewController) {
+  //     stack.pop(viewController)
+  //   }
+  //   set viewControllers(v) {
+  //     this.viewControllers = v
+  //   }
+
+  constructor() {
+    console.log('construct nav-view')
+    this.history = [] // <---- would be fancy pants
+  }
+
+}

src/components/tabs/tab.js

@@ -0,0 +1,44 @@
+import {NgElement, Component, Template, Parent} from 'angular2/angular2';
+import {Ion} from '../ion';
+import {Tabs} from './tabs';
+import {NavView} from '../nav-view/nav-view';
+
+@Component({
+  selector: 'ion-tab',
+  bind: {
+    tabTitle: 'tab-title'
+  }
+})
+@Template({
+  inline: `
+    <div class="container">
+      <div class="content">
+        <div class="scroll-content">
+          <content></content>
+        </div>
+      </div>
+    </div>
+    `
+})
+export class Tab extends NavView {
+
+  constructor(@NgElement() ele:NgElement, @Parent() tabs: Tabs) {
+    super();
+    this.ele = ele;
+
+    ele.domElement.classList.add('view');
+    ele.domElement.classList.add('tab-view');
+
+    tabs.add(this);
+
+    setTimeout(() => {
+      // HACK!!!!! "this" doesn't have tabTitle when not in setTimeout
+      console.log(this.tabTitle)
+    })
+
+  }
+
+  show(shouldShow) {
+    this.ele.domElement.classList[shouldShow ? 'remove' : 'add']('hide');
+  }
+}

src/components/tabs/tabs.js

@@ -1,6 +1,7 @@
 import {NgElement, Component, Template, Parent} from 'angular2/angular2';
 import {History} from '../../history';
 import {Ion} from '../ion';
+import {View} from 'ionic/components/view/view';
 
 
 @Component({
@@ -25,7 +26,7 @@ import {Ion} from '../ion';
     </div>
     `
 })
-export class Tabs extends View {
+export class Tabs extends Ion {
 
   constructor(@NgElement() ele:NgElement) {
     ele.domElement.classList.add('view');
@@ -45,44 +46,3 @@ export class Tabs extends View {
   }
 
 }
-
-
-@Component({
-  selector: 'ion-tab',
-  bind: {
-    tabTitle: 'tab-title'
-  }
-})
-@Template({
-  inline: `
-    <div class="container">
-      <div class="content">
-        <div class="scroll-content">
-          <content></content>
-        </div>
-      </div>
-    </div>
-    `
-})
-export class Tab extends View {
-
-  constructor(@NgElement() ele:NgElement, @Parent() tabs: Tabs) {
-    this.ele = ele;
-    this.history = new History();
-
-    ele.domElement.classList.add('view');
-    ele.domElement.classList.add('tab-view');
-
-    tabs.add(this);
-
-    setTimeout(() => {
-      // HACK!!!!! "this" doesn't have tabTitle when not in setTimeout
-      console.log(this.tabTitle)
-    })
-
-  }
-
-  show(shouldShow) {
-    this.ele.domElement.classList[shouldShow ? 'remove' : 'add']('hide');
-  }
-}

src/components/view-group/view-group.js

@@ -1,5 +0,0 @@
-import {Ion} from '../ion';
-
-export class ViewGroup extends Ion {
-
-}