fix(toggle): uses PanGesture abstraction

fixes #9428

src/gestures/drag-gesture.ts

@@ -23,6 +23,7 @@ export interface PanGestureConfig {
  * @private
  */
 export class PanGesture {
+
   private debouncer: Debouncer;
   private events: UIEventManager = new UIEventManager(false);
   private pointerEvents: PointerEvents;
@@ -58,7 +59,9 @@ export class PanGesture {
       capture: opts.capture,
       passive: opts.passive
     };
-    this.detector = new PanRecognizer(opts.direction, opts.threshold, opts.maxAngle);
+    if (opts.threshold > 0) {
+      this.detector = new PanRecognizer(opts.direction, opts.threshold, opts.maxAngle);
+    }
   }
 
   listen() {
@@ -100,40 +103,42 @@ export class PanGesture {
         return false;
       }
     }
-
-    let coord = pointerCoord(ev);
-    this.detector.start(coord);
     this.started = true;
     this.captured = false;
+
+    const coord = pointerCoord(ev);
+    if (this.detector) {
+      this.detector.start(coord);
+
+    } else {
+      if (!this.tryToCapture(ev)) {
+        this.started = false;
+        this.captured = false;
+        this.gestute.release();
+        return false;
+      }
+    }
     return true;
   }
 
   pointerMove(ev: any) {
-    if (!this.started) {
+    assert(this.started === true, 'started must be true');
+    if (this.captured) {
+      this.debouncer.debounce(() => {
+        this.onDragMove(ev);
+      });
       return;
     }
-    this.debouncer.debounce(() => {
-      if (this.captured) {
-        this.onDragMove(ev);
-        return;
-      }
-      let coord = pointerCoord(ev);
-      if (this.detector.detect(coord)) {
 
-        if (this.detector.pan() !== 0 &&
-          (!this.gestute || this.gestute.capture())) {
-          this.onDragStart(ev);
-          this.captured = true;
-          return;
+    assert(this.detector, 'detector has to be valid');
+    const coord = pointerCoord(ev);
+    if (this.detector.detect(coord)) {
+      if (this.detector.pan() !== 0) {
+        if (!this.tryToCapture(ev)) {
+          this.abort(ev);
         }
-
-        // Detection/capturing was not successful, aborting!
-        this.started = false;
-        this.captured = false;
-        this.pointerEvents.stop();
-        this.notCaptured(ev);
       }
-    });
+    }
   }
 
   pointerUp(ev: any) {
@@ -151,6 +156,26 @@ export class PanGesture {
     this.started = false;
   }
 
+  tryToCapture(ev: any): boolean {
+    assert(this.started === true, 'started has be true');
+    assert(this.captured === false, 'captured has be false');
+
+    if (this.gestute && !this.gestute.capture()) {
+      return false;
+    }
+    this.onDragStart(ev);
+    this.captured = true;
+    return true;
+  }
+
+  abort(ev: any) {
+    this.started = false;
+    this.captured = false;
+    this.gestute.release();
+    this.pointerEvents.stop();
+    this.notCaptured(ev);
+  }
+
   getNativeElement(): HTMLElement {
     return this.element;
   }

src/gestures/gesture-controller.ts

@@ -14,6 +14,9 @@ export const GESTURE_ITEM_SWIPE = 'item-swipe';
 /** @private */
 export const GESTURE_REFRESHER = 'refresher';
 
+/** @private */
+export const GESTURE_TOGGLE = 'toggle';
+
 /**
 * @private
 */
@@ -24,11 +27,13 @@ export const enum GesturePriority {
   Normal = 0,
   High = 10,
   VeryHigh = 20,
+  VeryVeryHigh = 30,
 
   SlidingItem = Low,
   MenuSwipe = High,
   GoBackSwipe = VeryHigh,
   Refresher = Normal,
+  Toggle = VeryVeryHigh
 }
 
 /**

src/gestures/recognizers.ts

@@ -2,15 +2,17 @@ import { PointerCoordinates } from '../util/dom';
 
 
 export class PanRecognizer {
+
   private startCoord: PointerCoordinates;
   private dirty: boolean = false;
   private threshold: number;
   private maxCosine: number;
+
   private _angle: any = 0;
   private _isPan: number = 0;
 
   constructor(private direction: string, threshold: number, maxAngle: number) {
-    let radians = maxAngle * (Math.PI / 180);
+    const radians = maxAngle * (Math.PI / 180);
     this.maxCosine = Math.cos(radians);
     this.threshold = threshold * threshold;
   }
@@ -26,12 +28,13 @@ export class PanRecognizer {
     if (!this.dirty) {
       return false;
     }
-    let deltaX = (coord.x - this.startCoord.x);
-    let deltaY = (coord.y - this.startCoord.y);
-    let distance = deltaX * deltaX + deltaY * deltaY;
+    const deltaX = (coord.x - this.startCoord.x);
+    const deltaY = (coord.y - this.startCoord.y);
+    const distance = deltaX * deltaX + deltaY * deltaY;
+
     if (distance >= this.threshold) {
-      let angle = Math.atan2(deltaY, deltaX);
-      let cosine = (this.direction === 'y')
+      var angle = Math.atan2(deltaY, deltaX);
+      var cosine = (this.direction === 'y')
         ? Math.sin(angle)
         : Math.cos(angle);