wip

ionic/components/app/app.js

@@ -5,6 +5,7 @@ import {ElementRef} from 'angular2/src/core/compiler/element_ref';
 import {bind} from 'angular2/di';
 import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
 
+import {IonicRouter} from '../../routing/router';
 import {IonicConfig} from '../../config/config';
 import {Platform} from '../../platform/platform';
 import {Registry} from '../../registry';
@@ -131,7 +132,7 @@ function initApp(window, document, config) {
   return app;
 }
 
-export function ionicBootstrap(ComponentType, config) {
+export function ionicBootstrap(ComponentType, config, router) {
   return new Promise((resolve, reject) => {
     try {
       // get the user config, or create one if wasn't passed in
@@ -154,15 +155,21 @@ export function ionicBootstrap(ComponentType, config) {
       // prepare the ready promise to fire....when ready
       Platform.prepareReady(config);
 
+      // setup router
+      router = router || new IonicRouter();
+
       // add injectables that will be available to all child components
       let injectableBindings = [
         bind(IonicApp).toValue(app),
-        bind(IonicConfig).toValue(config)
+        bind(IonicConfig).toValue(config),
+        bind(IonicRouter).toValue(router)
       ];
 
       bootstrap(ComponentType, injectableBindings).then(appRef => {
         app.ref(appRef);
 
+        router.init();
+
         // resolve that the app has loaded
         resolve(app);
 

ionic/components/nav/test/basic/index.js

@@ -1,6 +1,6 @@
 import {Component, onInit} from 'angular2/src/core/annotations_impl/annotations';
 
-import {IonicView, IonicConfig} from 'ionic/ionic';
+import {IonicView, IonicConfig, IonicRouter} from 'ionic/ionic';
 import {FirstPage} from './pages/first-page'
 
 
@@ -8,34 +8,31 @@ import {FirstPage} from './pages/first-page'
   selector: 'ion-app'
 })
 @IonicView({
-  template: '<ion-nav [root]="rootView"></ion-nav>'
+  template: '<ion-nav></ion-nav>'
 })
-class MyApp {
+class MyApp {}
-  constructor() {
+
-    this.rootView = FirstPage;
-  }
-}
 
 export function main(ionicBootstrap) {
 
-  var routes = {
+  var myRouter = new IonicRouter({
-    FirstPage: {
+    'FirstPage': {
-      url: 'firstpage',
+      'path': '/firstpage',
-      module: './first-page',
+      'module': 'dist/examples/nav/basic/pages/first-page',
     },
-    SecondPage: {
+    'SecondPage': {
-      url: 'secondpage',
+      'path': '/secondpage',
-      module: './second-page'
+      'module': './second-page'
     },
-    ThirdPage: {
+    'ThirdPage': {
-      url: 'thirdpage',
+      'path': '/thirdpage',
-      module: './third-page'
+      'module': './third-page'
     },
-  };
+  });
+
+  myRouter.otherwise('FirstPage');
 
   let myConfig = new IonicConfig();
 
-  //myConfig.routes(routes);
+  ionicBootstrap(MyApp, myConfig, myRouter);
-
-  ionicBootstrap(MyApp, myConfig, routes);
 }

ionic/components/nav/test/basic/pages/first-page.js

@@ -35,12 +35,7 @@ export class FirstPage {
     app: IonicApp,
     config: IonicConfig
   ) {
-
+    console.log('FirstPage constructor');
-    console.log('app', app)
-    console.log('config', config)
-
-    // TODO: Shouldn't have to do this
-    Router_OLD.setNavController(nav);
 
     this.nav = nav;
     this.val = Math.round(Math.random() * 8999) + 1000;
@@ -52,7 +47,7 @@ export class FirstPage {
   }
 
   viewLoaded() {
-    this.router = FirstPage.router.invoke(this);
+    //this.router = FirstPage.router.invoke(this);
     console.log('viewLoaded first page');
   }
 
@@ -93,6 +88,6 @@ export class FirstPage {
   }
 }
 
-new Routable(FirstPage, {
+// new Routable(FirstPage, {
-  url: '/first-page'
+//   url: '/first-page'
-})
+// })

ionic/components/view/view-controller.js

@@ -5,6 +5,7 @@ import {AppViewManager} from 'angular2/src/core/compiler/view_manager';
 import {Injector, bind} from 'angular2/di';
 
 import {IonicApp} from '../app/app';
+import {IonicRouter} from '../../routing/router';
 import {ViewItem} from './view-item';
 import {NavController} from '../nav/nav-controller';
 import {PaneController} from '../nav/pane';
@@ -25,8 +26,9 @@ export class ViewController {
     this.compiler = injector.get(Compiler);
     this.loader = injector.get(DynamicComponentLoader);
     this.viewMngr = injector.get(AppViewManager);
+    this.router = injector.get(IonicRouter);
 
-    let ionicApp = injector.get(IonicApp);
+    this.router.addViewController(this);
 
     this.items = [];
     this.panes = new PaneController(this);

ionic/components/view/view-item.js

@@ -89,7 +89,11 @@ export class ViewItem {
         }
 
         // this item has finished loading
+        try {
           this.loaded();
+        } catch (e) {
+          console.error(e);
+        }
 
         // fire callback when all child promises have been resolved
         Promise.all(this._promises).then(() => {

ionic/routing/router.js

@@ -1,3 +1,130 @@
+import * as util from '../util/util';
+
+
+export class IonicRouter {
+  constructor(config) {
+    this._routes = [];
+    this._viewCtrls = [];
+    this.config(config);
+  }
+
+  config(config) {
+    for (let routeName in config) {
+      this.addRoute(routeName, config[routeName]);
+    }
+  }
+
+  addRoute(name, routeConfig) {
+    let route = new IonicRoute(name, routeConfig);
+    this._routes.push(route);
+  }
+
+  init() {
+    let rootViewCtrl = this.activeViewController();
+    if (rootViewCtrl) {
+      let matchedRoute = this.match() || this.otherwise();
+      this.push(rootViewCtrl, matchedRoute);
+    }
+  }
+
+  match() {
+    let path = this.getCurrentPath();
+    let route = null;
+
+    for (let i = 0, ii = this._routes.length; i < ii; i++) {
+      route = this._routes[i];
+      if (route.match(path)) {
+        return route;
+      }
+    }
+  }
+
+  otherwise(val) {
+    if (arguments.length) {
+      this._otherwise = val;
+    } else {
+      let route = null;
+      for (let i = 0, ii = this._routes.length; i < ii; i++) {
+        route = this._routes[i];
+        if (route.name === this._otherwise) {
+          return route;
+        }
+      }
+    }
+  }
+
+  push(viewCtrl, route) {
+    if (viewCtrl && route) {
+      if (route.cls) {
+        viewCtrl.push(route.cls).then(() => {
+          this.pushCompleted(route);
+        });
+
+      } else if (route.module) {
+        System.import(route.module).then((m) => {
+          if (m) {
+            route.cls = m[route.name];
+            viewCtrl.push(route.cls).then(() => {
+              this.pushCompleted(route);
+            });
+          }
+        });
+      }
+    }
+  }
+
+  pushCompleted(route) {
+    console.log('pushCompleted', route);
+  }
+
+  updateState(route) {
+
+  }
+
+  addViewController(viewCtrl) {
+    this._viewCtrls.push(viewCtrl);
+  }
+
+  activeViewController() {
+    if (this._viewCtrls.length) {
+      return this._viewCtrls[ this._viewCtrls.length - 1 ];
+    }
+    return null;
+  }
+
+  getCurrentPath() {
+    let hash = window.location.hash;
+
+    // Grab the path without the leading hash
+    let path = hash.slice(1);
+    return path;
+  }
+
+}
+
+
+export class IonicRoute {
+  constructor(name, routeConfig) {
+    this.name = name;
+    this.cls = null;
+    util.extend(this, routeConfig);
+  }
+
+  match(path) {
+    if (this.path) {
+      if (this.path == path) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+}
+
+
+
+
+
 /**
  * The RouterController handles checking for matches of
  * each registered route, and triggering callbacks, gathering
@@ -6,7 +133,6 @@
 export class RouterController {
   constructor() {
     this.routes = []
-    console.log('Router controller built');
   }
 
   // Build route params to send to the matching route.
@@ -38,14 +164,14 @@ export class RouterController {
   }
 
   push(componentClass, params) {
-    if(!this.rootNavController) {
+    // if(!this.rootNavController) {
-      console.error('Router: No root nav controller to push matching route.');
+    //   console.error('Router: No root nav controller to push matching route.');
-      return;
+    //   return;
-    }
+    // }
-    console.log('Router pushing', componentClass, params);
+    // console.log('Router pushing', componentClass, params);
-    setTimeout(() => {
+    // setTimeout(() => {
-      this.rootNavController.push(componentClass, params);
+    //   this.rootNavController.push(componentClass, params);
-    });
+    // });
   }
 
   run() {
@@ -232,6 +358,6 @@ export class Routable {
 
 }
 
-var Router_OLD = new RouterController();
+export var Router_OLD = new RouterController();
 
-export { Router_OLD, Route, Routable };
+//export { IonicRouter, Router_OLD, Route, Routable };