refactor(all): consistent gesture events

core/src/components/item-sliding/item-sliding.tsx

@@ -76,9 +76,9 @@ export class ItemSliding {
       gesturePriority: 20,
       threshold: 5,
       canStart: this.canStart.bind(this),
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.disabledChanged();
   }
@@ -166,7 +166,7 @@ export class ItemSliding {
     return !!(this.rightOptions || this.leftOptions);
   }
 
-  private onDragStart() {
+  private onStart() {
     if (this.list) {
       this.list.setOpenItem(this.el);
     }
@@ -185,7 +185,7 @@ export class ItemSliding {
     }
   }
 
-  private onDragMove(gesture: GestureDetail) {
+  private onMove(gesture: GestureDetail) {
     if (this.optsDirty) {
       this.calculateOptsWidth();
     }
@@ -212,7 +212,7 @@ export class ItemSliding {
     this.setOpenAmount(openAmount, false);
   }
 
-  private onDragEnd(gesture: GestureDetail) {
+  private onEnd(gesture: GestureDetail) {
     const velocity = gesture.velocityX;
 
     let restingPoint = (this.openAmount > 0)

core/src/components/menu/menu.tsx

@@ -183,9 +183,9 @@ export class Menu implements MenuI {
       threshold: 10,
       canStart: this.canStart.bind(this),
       onWillStart: this.onWillStart.bind(this),
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
 
     // mask it as enabled / disabled
@@ -329,7 +329,7 @@ export class Menu implements MenuI {
     return this.loadAnimation();
   }
 
-  private onDragStart() {
+  private onStart() {
     if (!this.isAnimating || !this.animation) {
       assert(false, 'isAnimating has to be true');
       return;
@@ -339,7 +339,7 @@ export class Menu implements MenuI {
     this.animation.reverse(this._isOpen).progressStart();
   }
 
-  private onDragMove(detail: GestureDetail) {
+  private onMove(detail: GestureDetail) {
     if (!this.isAnimating || !this.animation) {
       assert(false, 'isAnimating has to be true');
       return;
@@ -350,7 +350,7 @@ export class Menu implements MenuI {
     this.animation.progressStep(stepValue);
   }
 
-  private onDragEnd(detail: GestureDetail) {
+  private onEnd(detail: GestureDetail) {
     if (!this.isAnimating || !this.animation) {
       assert(false, 'isAnimating has to be true');
       return;

core/src/components/nav/nav.tsx

@@ -116,10 +116,10 @@ export class Nav implements NavOutlet {
       gestureName: 'goback-swipe',
       gesturePriority: 30,
       threshold: 10,
-      canStart: this.canSwipeBack.bind(this),
-      onStart: this.swipeBackStart.bind(this),
-      onMove: this.swipeBackProgress.bind(this),
-      onEnd: this.swipeBackEnd.bind(this),
+      canStart: this.canStart.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.swipeGestureChanged();
   }
@@ -888,7 +888,13 @@ export class Nav implements NavOutlet {
     }
   }
 
-  private swipeBackStart() {
+  private canStart(): boolean {
+    return !!this.swipeGesture &&
+      !this.isTransitioning &&
+      this.canGoBack();
+  }
+
+  private onStart() {
     if (this.isTransitioning || this.transInstr.length > 0) {
       return;
     }
@@ -909,7 +915,7 @@ export class Nav implements NavOutlet {
     );
   }
 
-  private swipeBackProgress(detail: GestureDetail) {
+  private onMove(detail: GestureDetail) {
     if (this.sbTrns) {
       // continue to disable the app while actively dragging
       this.isTransitioning = true;
@@ -922,7 +928,7 @@ export class Nav implements NavOutlet {
     }
   }
 
-  private swipeBackEnd(detail: GestureDetail) {
+  private onEnd(detail: GestureDetail) {
     if (this.sbTrns) {
       // the swipe back gesture has ended
       const delta = detail.deltaX;
@@ -945,10 +951,6 @@ export class Nav implements NavOutlet {
     }
   }
 
-  private canSwipeBack(): boolean {
-    return !!this.swipeGesture && !this.isTransitioning && this.canGoBack();
-  }
-
   render() {
     return [
       this.mode === 'ios' && <div class="nav-decor" />,

core/src/components/picker-column/picker-column.tsx

@@ -58,9 +58,9 @@ export class PickerColumnCmp {
       gestureName: 'picker-swipe',
       gesturePriority: 100,
       threshold: 0,
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.gesture.setDisabled(false);
   }
@@ -200,7 +200,7 @@ export class PickerColumnCmp {
 
   // TODO should this check disabled?
 
-  private onDragStart(detail: GestureDetail) {
+  private onStart(detail: GestureDetail) {
     // We have to prevent default in order to block scrolling under the picker
     // but we DO NOT have to stop propagation, since we still want
     // some "click" events to capture
@@ -225,7 +225,7 @@ export class PickerColumnCmp {
     this.maxY = -(maxY * this.optHeight);
   }
 
-  private onDragMove(detail: GestureDetail) {
+  private onMove(detail: GestureDetail) {
     if (detail.event) {
       detail.event.preventDefault();
       detail.event.stopPropagation();
@@ -251,7 +251,7 @@ export class PickerColumnCmp {
     this.update(y, 0, false);
   }
 
-  private onDragEnd(detail: GestureDetail) {
+  private onEnd(detail: GestureDetail) {
     if (this.bounceFrom > 0) {
       // bounce back up
       this.update(this.minY, 100, true);

core/src/components/range/range.tsx

@@ -150,9 +150,9 @@ export class Range {
       gestureName: 'range',
       gesturePriority: 100,
       threshold: 0,
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.gesture.setDisabled(this.disabled);
   }
@@ -229,7 +229,7 @@ export class Range {
     }
   }
 
-  private onDragStart(detail: GestureDetail) {
+  private onStart(detail: GestureDetail) {
     this.fireFocus();
 
     const rect = this.rect = this.rangeSlider!.getBoundingClientRect() as any;
@@ -247,11 +247,11 @@ export class Range {
     this.update(currentX);
   }
 
-  private onDragMove(detail: GestureDetail) {
+  private onMove(detail: GestureDetail) {
     this.update(detail.currentX);
   }
 
-  private onDragEnd(detail: GestureDetail) {
+  private onEnd(detail: GestureDetail) {
     this.update(detail.currentX);
     this.pressedKnob = undefined;
     this.fireBlur();

core/src/components/reorder-group/reorder-group.tsx

@@ -58,15 +58,15 @@ export class ReorderGroup {
       direction: 'y',
       passive: false,
       canStart: this.canStart.bind(this),
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.disabledChanged();
   }
 
   componentDidUnload() {
-    this.onDragEnd();
+    this.onEnd();
   }
 
   private canStart(ev: GestureDetail): boolean {
@@ -87,7 +87,7 @@ export class ReorderGroup {
     return true;
   }
 
-  private onDragStart(ev: GestureDetail) {
+  private onStart(ev: GestureDetail) {
     ev.event.preventDefault();
 
     const item = this.selectedItemEl = ev.data;
@@ -131,7 +131,7 @@ export class ReorderGroup {
     hapticSelectionStart();
   }
 
-  private onDragMove(ev: GestureDetail) {
+  private onMove(ev: GestureDetail) {
     const selectedItem = this.selectedItemEl;
     if (!selectedItem) {
       return;
@@ -158,7 +158,7 @@ export class ReorderGroup {
     selectedItem.style.transform = `translateY(${deltaY}px)`;
   }
 
-  private onDragEnd() {
+  private onEnd() {
     this.activated = false;
     const selectedItem = this.selectedItemEl;
     if (!selectedItem) {

core/src/components/toggle/toggle.tsx

@@ -118,14 +118,14 @@ export class Toggle {
       gestureName: 'toggle',
       gesturePriority: 100,
       threshold: 0,
-      onStart: this.onDragStart.bind(this),
-      onMove: this.onDragMove.bind(this),
-      onEnd: this.onDragEnd.bind(this),
+      onStart: this.onStart.bind(this),
+      onMove: this.onMove.bind(this),
+      onEnd: this.onEnd.bind(this),
     });
     this.disabledChanged();
   }
 
-  private onDragStart(detail: GestureDetail) {
+  private onStart(detail: GestureDetail) {
     this.pivotX = detail.currentX;
     this.activated = true;
 
@@ -134,7 +134,7 @@ export class Toggle {
     return true;
   }
 
-  private onDragMove(detail: GestureDetail) {
+  private onMove(detail: GestureDetail) {
     const currentX = detail.currentX;
     if (shouldToggle(this.checked, currentX - this.pivotX, -15)) {
       this.checked = !this.checked;
@@ -143,7 +143,7 @@ export class Toggle {
     }
   }
 
-  private onDragEnd(detail: GestureDetail) {
+  private onEnd(detail: GestureDetail) {
     const delta = detail.currentX - this.pivotX;
     if (shouldToggle(this.checked, delta, 4)) {
       this.checked = !this.checked;