fix(gesture): fix double event issue

ionic/components/aside/extensions/gestures.ts

@@ -29,7 +29,7 @@ class AsideTargetGesture extends SlideEdgeGesture {
   }
   onSlideEnd(slide, ev) {
     this.aside.setSliding(false);
-    if (Math.abs(ev.gesture.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5) {
+    if (Math.abs(ev.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5) {
 
       this.aside.setOpen(!this.aside.isOpen);
       this.aside.setDoneTransforming(!this.aside.isOpen);
@@ -86,7 +86,7 @@ class AsideGesture extends SlideEdgeGesture {
   }
   onSlideEnd(slide, ev) {
     this.aside.setSliding(false);
-    if (Math.abs(ev.gesture.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5) {
+    if (Math.abs(ev.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5) {
       this.aside.setOpen(!this.aside.isOpen);
       this.aside.setDoneTransforming(!this.aside.isOpen);
     } else {

ionic/components/scroll/scroll.scss

@@ -21,4 +21,7 @@ ion-scroll {
 
   }
 
+  .ion-scroll-zoom {
+  }
+
 }

ionic/components/scroll/scroll.ts

@@ -1,8 +1,9 @@
-import {View, ElementRef} from 'angular2/angular2';
+import {View, ElementRef, onInit} from 'angular2/angular2';
 
 import {Ion} from '../ion';
 import {IonicConfig} from '../../config/config';
 import {IonicComponent} from '../../config/annotations';
+import {Gesture} from '../../gestures/gesture';
 
 
 /**
@@ -12,12 +13,12 @@ import {IonicComponent} from '../../config/annotations';
 @IonicComponent({
   selector: 'ion-scroll',
   properties: [
-    'scrollX', 'scrollY'
+    'scrollX', 'scrollY', 'zoom'
   ],
   host: {
     '[class.scroll-x]': 'scrollX',
     '[class.scroll-y]': 'scrollY'
-  }
+  },
 })
 @View({
   template: '<scroll-content><ng-content></ng-content></scroll-content>'
@@ -29,10 +30,29 @@ export class Scroll extends Ion {
    * @param {IonicConfig} config  TODO
    */
   constructor(elementRef: ElementRef, config: IonicConfig) {
-    super(elementRef, config);
+    super(elementRef, ionicConfig);
+  }
 
-    setTimeout(() => {
+  onInit() {
-      this.scrollElement = this.getNativeElement().children[0];
+    this.scrollElement = this.getNativeElement().children[0];
+
+    if(this.zoom === "") {
+      this.initZoomScrolling();
+    }
+  }
+
+  initZoomScrolling() {
+    this.scrollElement.children[0] && this.scrollElement.children[0].classList.add('ion-scroll-zoom');
+
+    this.scrollElement.addEventListener('scroll', (e) => {
+      console.log("Scrolling", e);
+    });
+
+    this.zoomGesture = new Gesture(this.scrollElement);
+    this.zoomGesture.listen();
+
+    this.zoomGesture.on('doubletap', (e) => {
+      console.log('Double tap', e);
     });
   }
 

ionic/components/slides/slides.ts

@@ -134,7 +134,10 @@ export class Slides {
    * @param {Slide} slide  The slide to add.
    */
   add(slide) {
+    console.log('Added slide');
     this._append(slide);
+
+    this.resize();
   }
 
   /**
@@ -282,8 +285,8 @@ export class Slides {
    * @param {Event} event  TODO
    */
   _dragPre(event) {
-    let dx = event.gesture.deltaX;
+    let dx = event.deltaX;
-    let dy = event.gesture.deltaY;
+    let dy = event.deltaY;
 
     if(this.disableScroll) {
       event.preventDefault();
@@ -306,7 +309,7 @@ export class Slides {
    * @param {Event} event  TODO
    */
   _drag(event) {
-    let dx = event.gesture.deltaX;
+    let dx = event.deltaX;
     let width = this.containerWidth;
     let index = this.currentIndex;
 
@@ -391,8 +394,8 @@ export class Slides {
   _finish(event, drag) {
 
     let delta = {
-      x: event.gesture.deltaX,
+      x: event.deltaX,
-      y: event.gesture.deltaY
+      y: event.deltaY
     }
 
     let width = this.containerWidth;
@@ -632,7 +635,7 @@ export class SlidePager {
    * @returns {Array<Slide>} An array of slides in the slidebox.
    */
   getSlides() {
-    return this.slides.slides;
+    return this.slides.slides.slice(0, 10);
   }
 }
 
@@ -649,8 +652,8 @@ export class SlidesGesture extends DragGesture {
     this.slides = slides;
   }
   onDrag(event) {
-    let x = event.gesture.center.x;
+    let x = event.center.x;
-    let y = event.gesture.center.y;
+    let y = event.center.y;
 
     this._drag.x = x;
     this._drag.y = y;
@@ -660,8 +663,8 @@ export class SlidesGesture extends DragGesture {
   onDragStart(event) {
 
     this._drag = {
-      startX: event.gesture.center.x,
+      startX: event.center.x,
-      startY: event.gesture.center.y,
+      startY: event.center.y,
       time: +new Date
     }
 

ionic/gestures/gesture.ts

@@ -1,6 +1,11 @@
 import * as util from 'ionic/util';
 import {Hammer} from 'ionic/gestures/hammer';
 
+/**
+ * A gesture recognizer class.
+ *
+ * TODO(mlynch): Re-enable the DOM event simulation that was causing issues (or verify hammer does this already, it might);
+ */
 
 export class Gesture {
   constructor(element, opts = {}) {
@@ -25,9 +30,9 @@ export class Gesture {
   }
 
   on(type, cb) {
-    this.hammertime.on(type, util.noop);
+    this.hammertime.on(type, cb);
     (this._callbacks[type] || (this._callbacks[type] = [])).push(cb);
-    this.element.addEventListener(type, cb);
+    //this.element.addEventListener(type, cb);
   }
 
   listen() {
@@ -39,7 +44,8 @@ export class Gesture {
     this.hammertime = null;
     for (let type in this._callbacks) {
       for (let i = 0; i < this._callbacks[type].length; i++) {
-        this.element.removeEventListener(type, this._callbacks[type][i]);
+        //this.element.removeEventListener(type, this._callbacks[type][i]);
+        this.hammertime.off(type, this._callbacks[type]);
       }
     }
     this._callbacks = {}

ionic/gestures/slide-edge-gesture.ts

@@ -15,7 +15,7 @@ export class SlideEdgeGesture extends SlideGesture {
 
   canStart(ev) {
     this._containerRect = this.getContainerDimensions();
-    return this.edges.every(edge => this._checkEdge(edge, ev.gesture.center));
+    return this.edges.every(edge => this._checkEdge(edge, ev.center));
   }
 
   getContainerDimensions() {

ionic/gestures/slide-gesture.ts

@@ -40,7 +40,7 @@ export class SlideGesture extends DragGesture {
       this.slide.min = min;
       this.slide.max = max;
       this.slide.elementStartPos = this.getElementStartPos(this.slide, ev);
-      this.slide.pointerStartPos = ev.gesture.center[this.direction];
+      this.slide.pointerStartPos = ev.center[this.direction];
       this.slide.started = true;
       this.onSlideStart(this.slide, ev);
     }).catch(() => {
@@ -49,7 +49,7 @@ export class SlideGesture extends DragGesture {
   }
   onDrag(ev) {
     if (!this.slide || !this.slide.started) return;
-    this.slide.pos = ev.gesture.center[this.direction];
+    this.slide.pos = ev.center[this.direction];
     this.slide.distance = util.clamp(
       this.slide.min,
       this.slide.pos - this.slide.pointerStartPos + this.slide.elementStartPos,