working modals

demos/modal/index.ts

@@ -24,8 +24,6 @@ class MyAppCmp {
     console.log('android', platform.is('android'))
     console.log('windows phone', platform.is('windowsphone'))
 
-    console.log('isRTL', app.isRTL())
-
     platform.ready().then(() => {
       console.log('platform.ready')
     });

ionic/components/modal/modal.ts

@@ -3,6 +3,7 @@ import {Injectable} from 'angular2/angular2';
 import {OverlayController} from '../overlay/overlay-controller';
 import {IonicConfig} from '../../config/config';
 import {Animation} from '../../animations/animation';
+import {makeComponent} from '../../config/decorators';
 import * as util from 'ionic/util';
 
 /**
@@ -46,9 +47,11 @@ export class Modal {
    * @returns {TODO} TODO
    */
   open(componentType: Type, opts={}) {
+    let modalComponent = makeComponent(componentType, {
+      selector: 'ion-modal'
+    });
 
-
-    return this.ctrl.open(OVERLAY_TYPE, componentType, util.extend(this._defaults, opts));
+    return this.ctrl.open(OVERLAY_TYPE, modalComponent, util.extend(this._defaults, opts));
   }
 
   /**

ionic/components/modal/test/basic/index.ts

@@ -24,8 +24,6 @@ class MyAppCmp {
     console.log('android', platform.is('android'))
     console.log('windows phone', platform.is('windowsphone'))
 
-    console.log('isRTL', app.isRTL())
-
     platform.ready().then(() => {
       console.log('platform.ready')
     });
@@ -33,14 +31,15 @@ class MyAppCmp {
   }
 
   openModal() {
-    this.modal.open(ContactModal);
+    this.modal.open(ContactModal, {
+      handle: 'my-awesome-modal'
+    });
   }
 
   openModalCustomAnimation() {
     this.modal.open(ContactModal, {
       enterAnimation: 'my-fade-in',
-      leaveAnimation: 'my-fade-out',
-      handle: 'my-awesome-modal'
+      leaveAnimation: 'my-fade-out'
     });
   }
 }

ionic/components/nav/nav-controller.ts

@@ -1,6 +1,7 @@
-import {Component, ComponentRef, Compiler, ElementRef, Injector, bind, NgZone, DynamicComponentLoader, DirectiveBinding, AppViewManager} from 'angular2/angular2';
+import {ComponentRef, Compiler, ElementRef, Injector, bind, NgZone, DynamicComponentLoader, AppViewManager} from 'angular2/angular2';
 
 import {Ion} from '../ion';
+import {makeComponent} from '../../config/decorators';
 import {IonicConfig} from '../../config/config';
 import {IonicApp} from '../app/app';
 import {ViewController} from './view-controller';
@@ -483,20 +484,15 @@ export class NavController extends Ion {
    */
   compileView(componentType) {
     // create a new ion-view annotation
-    let annotation = new Component({
+    let viewComponentType = makeComponent(componentType, {
       selector: 'ion-view',
       host: {
         '[class.pane-view]': '_paneView'
       }
     });
 
-    let ionViewComponentType = DirectiveBinding.createFromType(componentType, annotation);
-
-    // create a unique token that works as a cache key
-    ionViewComponentType.token = 'ionView' + componentType.name;
-
     // compile the Component
-    return this.compiler.compileInHost(ionViewComponentType);
+    return this.compiler.compileInHost(viewComponentType);
   }
 
   /**
@@ -504,7 +500,7 @@ export class NavController extends Ion {
    * TODO
    */
   createViewComponetRef(hostProtoViewRef, contentContainerRef, viewCtrlBindings) {
-    let bindings = this.bindings.concat(Injector.resolve(viewCtrlBindings));
+    let bindings = this.bindings.concat(viewCtrlBindings);
 
     // the same guts as DynamicComponentLoader.loadNextToLocation
     var hostViewRef =

ionic/components/nav/nav.ts

@@ -309,22 +309,22 @@ export class Nav extends NavController {
     let tabs = false;
     //let key = '_';
 
-    componentProtoViewRef._protoView.elementBinders.forEach(rootElementBinder => {
-      if (!rootElementBinder.componentDirective || !rootElementBinder.nestedProtoView) return;
+    // componentProtoViewRef._protoView.elementBinders.forEach(rootElementBinder => {
+    //   if (!rootElementBinder.componentDirective || !rootElementBinder.nestedProtoView) return;
 
-      rootElementBinder.nestedProtoView.elementBinders.forEach(nestedElementBinder => {
-        if ( isComponent(nestedElementBinder, 'Tabs') ) {
-          tabs = true;
-        }
-        if (!nestedElementBinder.componentDirective && nestedElementBinder.nestedProtoView) {
-          nestedElementBinder.nestedProtoView.elementBinders.forEach(templatedElementBinder => {
-            if ( isComponent(templatedElementBinder, 'Navbar') ) {
-              navbar = true;
-            }
-          });
-        }
-      });
-    });
+    //   rootElementBinder.nestedProtoView.elementBinders.forEach(nestedElementBinder => {
+    //     if ( isComponent(nestedElementBinder, 'Tabs') ) {
+    //       tabs = true;
+    //     }
+    //     if (!nestedElementBinder.componentDirective && nestedElementBinder.nestedProtoView) {
+    //       nestedElementBinder.nestedProtoView.elementBinders.forEach(templatedElementBinder => {
+    //         if ( isComponent(templatedElementBinder, 'Navbar') ) {
+    //           navbar = true;
+    //         }
+    //       });
+    //     }
+    //   });
+    // });
 
     return {
       navbar,

ionic/components/overlay/overlay-controller.ts

@@ -16,17 +16,20 @@ export class OverlayController {
   }
 
   open(overlayType, componentType: Type, opts={}) {
-    let resolve;
-    let promise = new Promise(res => { resolve = res; });
-
     if (!this.anchor) {
       console.error('<ion-overlay></ion-overlay> required in root component template to use: ' + overlayType);
       return Promise.reject();
     }
 
+    let resolve, reject;
+    let promise = new Promise((res, rej) => { resolve = res; reject = rej; });
+
     try {
       this.anchor.append(componentType).then(ref => {
-        let instance = ref.instance;
+        let instance = ref && ref.instance;
+        if (!instance) {
+          return reject();
+        }
 
         ref._z = ROOT_Z_INDEX;
         for (let i = 0; i < this.refs.length; i++) {
@@ -39,13 +42,12 @@ export class OverlayController {
         util.extend(instance, opts);
 
         ref._type = overlayType;
-        ref._opts = opts;
-        ref._handle = opts.handle || (overlayType + instance.zIndex);
+        ref._handle = opts.handle || (overlayType + ref._z);
 
         this.add(ref);
 
-        instance.close = (opts={}) => {
-          this.close(ref, opts);
+        instance.close = (closeOpts={}) => {
+          this.close(ref, util.extend(opts, closeOpts));
         };
 
         instance.onViewLoaded && instance.onViewLoaded();
@@ -92,7 +94,6 @@ export class OverlayController {
     instance.onViewWillLeave && instance.onViewWillLeave();
     instance.onViewWillUnload && instance.onViewWillUnload();
 
-    opts = util.extend(ref._opts, opts);
     let animation = Animation.create(ref.location.nativeElement, opts.leaveAnimation);
     animation.after.removeClass('show-overlay');
 
@@ -133,18 +134,18 @@ export class OverlayController {
   }
 
   getByType(overlayType) {
-    for (let i = this.overlays.length - 1; i >= 0; i--) {
-      if (overlayType === this.overlays[i]._type) {
-        return this.overlays[i];
+    for (let i = this.refs.length - 1; i >= 0; i--) {
+      if (overlayType === this.refs[i]._type) {
+        return this.refs[i].instance;
       }
     }
     return null;
   }
 
   getByHandle(handle, overlayType) {
-    for (let i = this.overlays.length - 1; i >= 0; i--) {
-      if (handle === this.overlays[i]._handle && overlayType === this.overlays[i]._type) {
-        return this.overlays[i];
+    for (let i = this.refs.length - 1; i >= 0; i--) {
+      if (handle === this.refs[i]._handle && overlayType === this.refs[i]._type) {
+        return this.refs[i].instance;
       }
     }
     return null;

ionic/config/bootstrap.ts

@@ -1,5 +1,5 @@
 import {bootstrap, bind} from 'angular2/angular2';
-import {ROUTER_BINDINGS, HashLocationStrategy, LocationStrategy} from 'angular2/router';
+import {routerBindings, HashLocationStrategy, LocationStrategy} from 'angular2/router';
 
 import {IonicApp} from '../components/app/app';
 import {IonicConfig} from './config';
@@ -16,7 +16,7 @@ import {TapClick} from '../components/tap-click/tap-click';
 import * as dom from '../util/dom';
 
 
-export function ionicBindings(configSettings) {
+export function ionicBindings(rootCmp, configSettings) {
   let app = new IonicApp();
   let platform = new IonicPlatform();
   let config = new IonicConfig(configSettings);
@@ -46,7 +46,7 @@ export function ionicBindings(configSettings) {
     Modal,
     Popup,
     Translate,
-    ROUTER_BINDINGS,
+    routerBindings(rootCmp),
     bind(LocationStrategy).toClass(HashLocationStrategy),
   ];
 }

ionic/config/decorators.ts

@@ -107,7 +107,7 @@ export function App(args={}) {
     // redefine with added annotations
     Reflect.defineMetadata('annotations', annotations, cls);
 
-    bootstrap(cls, ionicBindings(args.config));
+    bootstrap(cls, ionicBindings(cls, args.config));
 
     return cls;
   }