make js work on snapshot

scripts/e2e/index.template.html

@@ -14,7 +14,7 @@
         baseURL: '<%= PREFIX %>/lib',
         traceurOptions: <%= JSON.stringify(buildConfig.traceurOptions) %>,
         map: {
-          'app': location.pathname.replace(/\/$/,''),
+          'app': location.pathname.replace(/\/(index.html)?$/,''),
           'rx/dist/rx.all': 'rx.all',
         }
       })

src/components/aside/aside.js

@@ -1,7 +1,7 @@
 import {Component, Template, Inject, Parent, NgElement} from 'angular2/angular2'
 import {ComponentConfig} from 'ionic2/config/component-config'
-import * as types from 'ionic2/components/aside/types/types'
-import * as gestures from  'ionic2/components/aside/gestures/gestures';
+import * as types from 'ionic2/components/aside/extensions/types'
+import * as gestures from  'ionic2/components/aside/extensions/gestures';
 
 @Component({
   selector: 'ion-aside',

src/components/aside/config.js

@@ -18,3 +18,9 @@ AsideConfig.delegate('type')
   .when({type: 'push'}, types.AsideTypePush)
   .when({type: 'reveal'}, types.AsideTypeReveal)
 
+
+AsideConfig.platform('android')
+  .defaults({ type: 'overlay' })
+
+AsideConfig.platform('ios')
+  .defaults({ type: 'reveal' })

src/components/aside/extensions/gestures.js

@@ -0,0 +1,92 @@
+import {Aside} from 'ionic2/components/aside/aside';
+//TODO: figure out way to get rid of all the ../../../../
+import {SlideEdgeGesture} from 'ionic2/gestures/slide-edge-gesture';
+
+class AsideGesture extends SlideEdgeGesture {
+  constructor(aside: Aside) {
+    // TODO figure out the sliding element, dont just use the parent
+    let slideElement = aside.domElement.parentNode;
+    super(slideElement, {
+      direction: (aside.side === 'left' || aside.side === 'right') ? 'x' : 'y',
+      edge: aside.side,
+      threshold: 75
+    });
+    this.aside = aside;
+    this.slideElement = slideElement;
+    this.listen();
+  }
+  
+  canStart(ev) {
+    // Only restrict edges if the aside is closed
+    return this.aside.isOpen ? true : super.canStart(ev);
+  }
+
+  // Set CSS, then wait one frame for it to apply before sliding starts
+  onSlideBeforeStart(slide, ev) {
+    this.aside.setSliding(true);
+    this.aside.setChanging(true);
+    return new Promise(resolve => {
+      requestAnimationFrame(resolve);
+    });
+  }
+  onSlide(slide, ev) {
+    this.aside.setTransform('translate3d(' + slide.distance + 'px,0,0)');
+  }
+  onSlideEnd(slide, ev) {
+    this.aside.setTransform('');
+    this.aside.setSliding(false);
+    if (Math.abs(ev.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5) {
+      this.aside.setOpen(!this.aside.isOpen);
+    }
+  }
+
+  getElementStartPos(slide, ev) {
+    return this.aside.isOpen ? slide.max : slide.min;
+  }
+  getSlideBoundaries() {
+    return {
+      min: 0,
+      max: this.aside.domElement.offsetWidth
+    };
+  }
+}
+
+export class LeftAsideGesture extends AsideGesture {}
+
+export class RightAsideGesture extends LeftAsideGesture {
+  getElementStartPos(slide, ev) {
+    return this.aside.isOpen ? slide.min : slide.max;
+  }
+  getSlideBoundaries() {
+    return {
+      min: -this.aside.domElement.offsetWidth,
+      max: 0
+    };
+  }
+
+}
+
+export class TopAsideGesture extends AsideGesture {
+  onSlide(slide, ev) {
+    this.aside.setTransform('translate3d(0,' + slide.distance + 'px,0)');
+  }
+  getSlideBoundaries() {
+    return {
+      min: 0,
+      max: this.aside.domElement.offsetHeight
+    };
+  }
+}
+
+export class BottomAsideGesture extends TopAsideGesture {
+  getElementStartPos(slide, ev) {
+    return this.aside.isOpen ? slide.min : slide.max;
+  }
+  getSlideBoundaries() {
+    return {
+      min: -this.aside.domElement.offsetHeight,
+      max: 0
+    };
+  }
+}
+

src/components/aside/extensions/types.js

@@ -0,0 +1,80 @@
+import {Aside} from 'ionic2/components/aside/aside';
+
+// TODO use setters instead of direct dom manipulation
+const asideManipulator = {
+  setSliding(sliding) {
+    this.aside.domElement.classList[sliding ? 'add' : 'remove']('no-transition');
+  },
+  setOpen(open) {
+    this.aside.domElement.classList[open ? 'add' : 'remove']('open');
+  },
+  setTransform(t) {
+    this.aside.domElement.style.transform = t;
+  }
+}
+const contentManipulator = {
+  setSliding(sliding) {
+    this.aside.content.domElement.classList[sliding ? 'add' : 'remove']('no-transition');
+  },
+  setOpen(open) {
+    this.aside.content.domElement.classList[open ? 'add' : 'remove'](
+      `aside-open-${this.aside.side}`
+    )
+  },
+  setTransform(t) {
+    this.aside.content.domElement.style.transform = t;
+  }
+}
+
+export class AsideType {
+  constructor(aside) {
+    this.aside = aside;
+
+    aside.domElement.classList.add(`type-${aside.type}`);
+
+    //FIXME(ajoslin): have to wait for for bindings to apply in a component
+    setTimeout(() => {
+      this.aside.content.domElement.classList.add('aside-content')
+    })
+  }
+}
+
+export class AsideTypeOverlay extends AsideType {
+  setSliding(sliding) {
+    asideManipulator.setSliding.call(this, sliding);
+  }
+  setOpen(open) {
+    asideManipulator.setOpen.call(this, open);
+  }
+  setTransform(t) {
+    asideManipulator.setTransform.call(this, t);
+  }
+}
+
+export class AsideTypePush extends AsideType {
+  setSliding(sliding) {
+    asideManipulator.setSliding.call(this, sliding);
+    contentManipulator.setSliding.call(this, sliding);
+  }
+  setOpen(open) {
+    asideManipulator.setOpen.call(this, open);
+    contentManipulator.setOpen.call(this, open);
+  }
+  setTransform(t) {
+    asideManipulator.setTransform.call(this, t);
+    contentManipulator.setTransform.call(this, t);
+  }
+}
+
+export class AsideTypeReveal extends AsideType {
+  setSliding(sliding) {
+    contentManipulator.setSliding.call(this, sliding);
+  }
+  setOpen(sliding) {
+    asideManipulator.setOpen.call(this, sliding);
+    contentManipulator.setOpen.call(this, sliding);
+  }
+  setTransform(t) {
+    contentManipulator.setTransform.call(this, t);
+  }
+}