I have no idea

ionic/components/app/test/barkpark/main.js

@@ -1,8 +1,8 @@
-import {Router} from 'ionic/routing/router'
+//import {Router} from 'ionic/routing/router'
 import {For, Component, View as NgView, Parent, bootstrap} from 'angular2/angular2'
 import {FormBuilder, Validators, FormDirectives, ControlGroup} from 'angular2/forms';
 import {Log} from 'ionic/util'
-import {List, Item, Nav, View, Button, Input, Tabs, Tab, Content, NavPane, Aside} from 'ionic/ionic'
+import {Router, List, Item, Nav, View, Button, Input, Tabs, Tab, Content, Aside} from 'ionic/ionic'
 
 @Component({
   selector: 'login-page'
@@ -94,8 +94,9 @@ export class AppPage {
   directives: [For, View, Content, List, Item]
 })
 class StreamTab {
-  constructor(navPane: NavPane) {
-    this.navPane = navPane;
+  constructor(@Parent() viewport: Nav) {
+    //this.navPane = navPane;
+    this.navPane = viewport;
     this.posts = [
       {'title': 'Just barked my first bark'},
       {'title': 'Went poopy' }
@@ -117,8 +118,8 @@ class StreamTab {
   directives: [View, Content]
 })
 class PostDetail {
-  constructor(navPane: NavPane) {
-    this.navPane = navPane
+  constructor(@Parent() viewport: Nav) {
+    this.navPane = viewport;
     this.title = 'Hello'
   }
   selectItem() {
@@ -132,8 +133,9 @@ class PostDetail {
   directives: [View, Content]
 })
 class SplashPage {
-  constructor(navPane: NavPane) {
-    window.navPane = navPane;
+  constructor(@Parent() viewport: Nav) {
+    this.navPane = viewport;
+    window.navPane = viewport;
   }
 }
 
@@ -151,29 +153,22 @@ class IonicApp {
     this.firstPage = SplashPage//AppPage//LoginPage
 
     setTimeout(function() {
-      // TODO: HACK
       var nav = window.navPane;
 
       var route = new Router()
 
-      route.on('/login', (e) => {
-        console.log('ROUTE: Login page')
-        nav.push(LoginPage, {
-          sync: true
+      route.on('/login', (data) => {
+        nav.push(LoginPage, null, {
+          animate: false
         })
       })
-      route.on('/post/:id', (match) => {
-        console.log('ROUTE: Post page', match)
-        nav.push(PostDetail);
+
+      route.on('/post/:id', (data) => {
+        console.log('ROUTE: Post page', data)
+        nav.push(PostDetail, data);
       })
 
-      /*
-      route.on('/signup', (e) => {
-        console.log('ROUTE: Signup page')
-        nav.push(SignupPage)
-      })
-      */
-    }, 2000);
+    }, 200);
   }
 }
 

ionic/components/app/test/hn/hn.js

@@ -1,13 +1,33 @@
-export class HackerNews {
+import {Promise} from 'angular2/src/facade/async';
+console.log(Promise);
+
+var APIUrl = 'https://hacker-news.firebaseio.com/v0';
+export class HackerNewsClient {
   constructor() {
-    this.fb = new Firebase('https://hacker-news.firebaseio.com/v0');
-    this.getPosts();
+    this.fb = new Firebase(APIUrl);
   }
 
-  getPosts() {
-    console.log('GETTING POSTS');
-    this.fb.child('topstories').on('value', function(snapshot) {
-      console.log(snapshot.val());
+  getTopStories(cb) {
+    console.log('GETTING TOP STORIES');
+
+    this.fb.child('topstories').on('value', (snapshot) => {
+
+      let items = snapshot.val();
+
+      console.log('Fetched', items.length, 'items');
+
+      for(var itemID of items) {
+
+        this.fb.child("item").child(itemID).on('value', (data) => {
+
+          cb(data.val());
+
+          //console.log(data.val());
+        });
+      }
     });
   }
 }
+
+var HackerNews = new HackerNewsClient();
+export { HackerNews };

ionic/components/app/test/hn/main.js

@@ -1,28 +1,24 @@
 import {Descendent, NgElement, Component, View as NgView, bootstrap} from 'angular2/angular2';
+import {bind} from 'angular2/di';
 import {View, Content, Nav, NavPane} from 'ionic/ionic';
 
 import {HackerNews} from 'hn';
-import {HNSplashPage} from 'pages/splash';
+import {HNTopStories} from 'pages/top';
 
 @Component({ selector: '[ion-app]' })
 @NgView({
   templateUrl: 'main.html',
   directives: [View, Content, Nav, NavPane]
 })
-class IonicApp {
+export class HNApp {
   constructor(
     @NgElement() element:NgElement
   ) {
-    console.log('IonicApp start: HackerNews')
+    console.log('IonicApp start: HackerNews', HackerNews)
 
-    this.splashPage = HNSplashPage
-
-    // Timeout so Firebase can be resolved
-    setTimeout(() => {
-      this.hn = new HackerNews();
-    });
+    this.splashPage = HNTopStories
   }
 }
 
-bootstrap(IonicApp)
+bootstrap(HNApp);
 

ionic/components/app/test/hn/pages/splash.html

@@ -1,3 +0,0 @@
-<div>
-  <h1>That's so <i>HACKER NEWS</i></h1>
-</div>

ionic/components/app/test/hn/pages/splash.js

@@ -1,13 +0,0 @@
-import {Descendent, Parent, NgElement, Component, View as NgView, bootstrap} from 'angular2/angular2';
-import {View, Content, Nav, NavPane} from 'ionic/ionic';
-
-@Component({ selector: 'splash-page' })
-@NgView({
-  templateUrl: 'pages/splash.html',
-  directives: [View, Content]
-})
-export class HNSplashPage {
-  constructor(@Parent() viewport: Nav) {
-    //window.navPane = navPane;
-  }
-}

ionic/components/app/test/hn/pages/top.html

@@ -0,0 +1,10 @@
+<ion-view view-title="Top">
+  <ion-content>
+  <!--<h1>That's so <i>HACKER NEWS</i></h1>-->
+    <ion-list>
+      <ion-item *for="#story of stories">
+        {{story.title}}
+      </ion-item>
+    </ion-list>
+  </ion-content>
+</ion-view>

ionic/components/app/test/hn/pages/top.js

@@ -0,0 +1,49 @@
+import {For, Ancestor, Descendent, Parent, NgElement, Component, View as NgView, bootstrap} from 'angular2/angular2';
+import {View, Content, Nav, NavPane, List, Item} from 'ionic/ionic';
+
+import {HackerNews} from 'hn'
+
+@Component({ selector: 'top-stories' })
+@NgView({
+  templateUrl: 'pages/top.html',
+  directives: [View, Content, For, List, Item]
+})
+export class HNTopStories {
+  constructor(@Parent() viewport: Nav) {//, @Ancestor() app: HNApp) {
+    console.log('TOP STORIES');
+
+    this.stories = [];
+
+    var APIUrl = 'https://hacker-news.firebaseio.com/v0';
+    this.fb = new Firebase(APIUrl);
+    this.fb.child('topstories').limitToFirst(20).once('value', (snapshot) => {
+
+      let items = snapshot.val();
+
+      console.log('Fetched', items.length, 'items');
+
+      for(var itemID of items) {
+
+        this.fb.child("item").child(itemID).on('value', (data) => {
+          setTimeout(() => {
+            console.log(itemID, data.val());
+            this.stories.push(data.val());
+          });
+
+          //console.log(data.val());
+        });
+      }
+    });
+    
+
+    /*
+    HackerNews.getTopStories((val) => {
+      new Promise((resolve, reject) => {
+        console.log('PROMISES!', val);
+        this.stories.push(val);
+        resolve();
+      });
+    });
+    */
+  }
+}

ionic/ionic.js

@@ -9,6 +9,7 @@ Object.defineProperties(NgElement.prototype, {
 
 export * from 'ionic/components'
 export * from 'ionic/platform/platform'
+export * from 'ionic/routing/router'
 export * from 'ionic/webview/webview'
 export * from 'ionic/webview/cordova/cordova'
 export * from 'ionic/webview/node-webkit/node-webkit'

scripts/build/config.js

@@ -34,6 +34,7 @@ module.exports = {
     'angular2.js',
     'angular2-di.js',
     'ionic2.js',
+    'https://cdn.firebase.com/js/client/2.2.4/firebase.js'
   ],
 
   traceurOptions: {

scripts/e2e/index.template.html

@@ -7,7 +7,13 @@
 
     <link rel="stylesheet" href="<%= PREFIX %>/css/ionic.css" />
     <% buildConfig.scripts.forEach(function(script) {
-      var src = script.to || script; %><script src="<%= PREFIX %>/lib/<%= src %>"></script>
+      var src = script.to || script; 
+      if (!/http/.test(src)) {
+      %>
+        <script src="<%= PREFIX %>/lib/<%= src %>"></script>
+      <% } else { %>
+        <script src="<%= src %>"></script>
+      <% } %>
     <% }); %>
 </head>
 <body ion-app>