@react-native-oh-tpl/react-native-gesture-handler 2.12.9 → 2.14.1-2.14.13

package/harmony/gesture_handler/src/main/ets/gesture-handlers/PinchGestureHandler.ts

@@ -0,0 +1,159 @@
+import { GestureHandler, DEFAULT_TOUCH_SLOP, IncomingEvent, GestureConfig, State, GestureHandlerDependencies } from "../core"
+import ScaleGestureDetector, { ScaleGestureListener } from "../detectors/ScaleGestureDetector";
+
+
+
+export class PinchGestureHandler extends GestureHandler {
+    private scale = 1;
+    private velocity = 0;
+
+    private startingSpan = 0;
+    private spanSlop = DEFAULT_TOUCH_SLOP;
+
+    private scaleDetectorListener: ScaleGestureListener = {
+      onScaleBegin: (detector: ScaleGestureDetector): boolean => {
+        this.startingSpan = detector.getCurrentSpan();
+        return true;
+      },
+      onScale: (detector: ScaleGestureDetector): boolean => {
+        const prevScaleFactor: number = this.scale;
+        this.scale *= detector.getScaleFactor(
+          this.tracker.getTrackedPointersCount()
+        );
+
+        const delta = detector.getTimeDelta();
+        if (delta > 0) {
+          this.velocity = (this.scale - prevScaleFactor) / delta;
+        }
+
+        if (
+          Math.abs(this.startingSpan - detector.getCurrentSpan()) >=
+            this.spanSlop &&
+          this.currentState === State.BEGAN
+        ) {
+          this.activate();
+        }
+        return true;
+      },
+      onScaleEnd: (
+        _detector: ScaleGestureDetector
+        // eslint-disable-next-line @typescript-eslint/no-empty-function
+      ): void => {},
+    };
+
+    private scaleGestureDetector: ScaleGestureDetector = new ScaleGestureDetector(
+      this.scaleDetectorListener
+    );
+
+
+    public constructor(deps: GestureHandlerDependencies) {
+        super({ ...deps, logger: deps.logger.cloneWithPrefix("PinchGestureHandler") })
+        this.setShouldCancelWhenOutside(false);
+    }
+
+    public getDefaultConfig() {
+      return {}
+    }
+
+    public updateGestureConfig({ enabled = true, ...props }: GestureConfig): void {
+      super.updateGestureConfig({ enabled: enabled, ...props });
+    }
+
+    protected transformNativeEvent() {
+      return {
+        focalX: this.scaleGestureDetector.getFocusX(),
+        focalY: this.scaleGestureDetector.getFocusY(),
+        velocity: this.velocity,
+        scale: this.scale,
+      };
+    }
+
+    public onPointerDown(event: IncomingEvent): void {
+      this.tracker.addToTracker(event);
+      super.onPointerDown(event);
+    }
+
+    public onAdditionalPointerAdd(event: IncomingEvent): void {
+      this.tracker.addToTracker(event);
+      super.onAdditionalPointerAdd(event);
+      this.tryBegin();
+      this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+    }
+
+    public onPointerUp(event: IncomingEvent): void {
+      super.onPointerUp(event);
+      this.tracker.removeFromTracker(event.pointerId);
+      if (this.currentState !== State.ACTIVE) {
+        return;
+      }
+      this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+
+      if (this.currentState === State.ACTIVE) {
+        this.end();
+      } else {
+        this.fail();
+      }
+    }
+
+    public onAdditionalPointerRemove(event: IncomingEvent): void {
+      super.onAdditionalPointerRemove(event);
+      this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+      this.tracker.removeFromTracker(event.pointerId);
+
+      if (
+        this.currentState === State.ACTIVE &&
+        this.tracker.getTrackedPointersCount() < 2
+      ) {
+        this.end();
+      }
+    }
+
+    public onPointerMove(event: IncomingEvent): void {
+        if (this.tracker.getTrackedPointersCount() < 2) {
+        return;
+      }
+      this.tracker.track(event);
+
+      this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+      super.onPointerMove(event);
+    }
+
+    public onPointerOutOfBounds(event: IncomingEvent): void {
+      if (this.tracker.getTrackedPointersCount() < 2) {
+        return;
+      }
+      this.tracker.track(event);
+
+      this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+      super.onPointerOutOfBounds(event);
+    }
+
+    private tryBegin(): void {
+        if (this.currentState !== State.UNDETERMINED) {
+        return;
+      }
+
+      this.resetProgress();
+      this.begin();
+    }
+
+    public activate(force?: boolean): void {
+        if (this.currentState !== State.ACTIVE) {
+        this.resetProgress();
+      }
+
+      super.activate();
+    }
+
+    protected onReset(): void {
+      this.resetProgress();
+    }
+
+    protected resetProgress(): void {
+      if (this.currentState === State.ACTIVE) {
+        return;
+      }
+      this.velocity = 0;
+      this.scale = 1;
+    }
+}

package/harmony/gesture_handler/src/main/ets/gesture-handlers/RotationGestureHandler.ts

@@ -0,0 +1,164 @@
+import { GestureHandler, State, IncomingEvent, GestureConfig, GestureHandlerDependencies } from '../core';
+import RotationGestureDetector, { RotationGestureListener, } from './detectors/RotationGestureDetector';
+
+const ROTATION_RECOGNITION_THRESHOLD = Math.PI / 36;
+
+export class RotationGestureHandler extends GestureHandler {
+  private rotation = 0;
+  private velocity = 0;
+
+  private cachedAnchorX = 0;
+  private cachedAnchorY = 0;
+  private unlockScrolls: (() => void) | undefined
+
+  constructor(deps: GestureHandlerDependencies) {
+    super({ ...deps, logger: deps.logger.cloneWithPrefix("RotationGestureHandler") })
+  }
+
+  private rotationGestureListener: RotationGestureListener = {
+    onRotationBegin: (_detector: RotationGestureDetector): boolean => true,
+    onRotation: (detector: RotationGestureDetector): boolean => {
+      const previousRotation: number = this.rotation;
+      this.rotation += detector.getRotation();
+
+      const delta = detector.getTimeDelta();
+
+      if (delta > 0) {
+        this.velocity = (this.rotation - previousRotation) / delta;
+      }
+
+      if (
+        Math.abs(this.rotation) >= ROTATION_RECOGNITION_THRESHOLD &&
+          this.currentState === State.BEGAN
+      ) {
+        this.activate();
+      }
+
+      return true;
+    },
+    onRotationEnd: (_detector: RotationGestureDetector): void => {
+      this.end();
+    },
+  };
+
+  private rotationGestureDetector: RotationGestureDetector =
+    new RotationGestureDetector(this.rotationGestureListener);
+
+  getDefaultConfig(): GestureConfig {
+    return { shouldCancelWhenOutside: false }
+  }
+
+  protected transformNativeEvent() {
+    return {
+      rotation: this.rotation ? this.rotation : 0,
+      anchorX: this.getAnchorX(),
+      anchorY: this.getAnchorY(),
+      velocity: this.velocity ? this.velocity : 0,
+    };
+  }
+
+  public getAnchorX(): number {
+    const anchorX = this.rotationGestureDetector.getAnchorX();
+
+    return anchorX ? anchorX : this.cachedAnchorX;
+  }
+
+  public getAnchorY(): number {
+    const anchorY = this.rotationGestureDetector.getAnchorY();
+
+    return anchorY ? anchorY : this.cachedAnchorY;
+  }
+
+  public onPointerDown(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onPointerDown(event);
+  }
+
+  public onAdditionalPointerAdd(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onAdditionalPointerAdd(event);
+    this.tryBegin();
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+  }
+
+  public onPointerMove(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    if (this.getAnchorX()) {
+      this.cachedAnchorX = this.getAnchorX();
+    }
+    if (this.getAnchorY()) {
+      this.cachedAnchorY = this.getAnchorY();
+    }
+    this.tracker.track(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerMove(event);
+  }
+
+  public onPointerOutOfBounds(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    if (this.getAnchorX()) {
+      this.cachedAnchorX = this.getAnchorX();
+    }
+    if (this.getAnchorY()) {
+      this.cachedAnchorY = this.getAnchorY();
+    }
+    this.tracker.track(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerOutOfBounds(event);
+  }
+
+  public onPointerUp(event: IncomingEvent): void {
+    super.onPointerUp(event);
+    this.tracker.removeFromTracker(event.pointerId);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    if (this.currentState !== State.ACTIVE) {
+      return;
+    }
+    if (this.currentState === State.ACTIVE) {
+      this.end();
+    } else {
+      this.fail();
+    }
+  }
+
+  public onAdditionalPointerRemove(event: IncomingEvent): void {
+    super.onAdditionalPointerRemove(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    this.tracker.removeFromTracker(event.pointerId);
+  }
+
+  protected tryBegin(): void {
+    if (this.currentState !== State.UNDETERMINED) {
+      return;
+    }
+
+    this.begin();
+  }
+
+  public activate(): void {
+    super.activate();
+  }
+
+  protected onReset(): void {
+    if (this.currentState === State.ACTIVE) {
+      return;
+    }
+
+    this.rotation = 0;
+    this.velocity = 0;
+    this.rotationGestureDetector.reset();
+  }
+
+  protected onStateChange(newState: State, oldState: State) {
+    super.onStateChange(newState, oldState)
+    if (newState === State.BEGAN) {
+      this.unlockScrolls = this.scrollLocker.lockScrollContainingViewTag(this.view?.getTag())
+    } else if (newState !== State.ACTIVE) {
+      this.unlockScrolls?.()
+    }
+  }
+}

package/harmony/gesture_handler/src/main/ets/{TapGestureHandler.ts → gesture-handlers/TapGestureHandler.ts}

@@ -1,6 +1,4 @@
-import { GestureHandler, GestureHandlerDependencies } from "./GestureHandler"
-import { AdaptedEvent, EventType } from "./Event"
-import { State, getStateName } from "./State"
+import { GestureHandler, GestureHandlerDependencies, IncomingEvent, EventType, State, getStateName } from "../core"
 
 const DEFAULT_MAX_DURATION_MS = 500;
 const DEFAULT_NUMBER_OF_TAPS = 1;
@@ -19,7 +17,7 @@ export class TapGestureHandler extends GestureHandler {
   private delayTimeout: number | undefined;
 
   constructor(deps: GestureHandlerDependencies) {
-    super({...deps, logger: deps.logger.cloneWithPrefix("TapGestureHandler")})
+    super({...deps, logger: deps.logger.cloneWithPrefix(`TapGestureHandler${deps.handlerTag}`)})
   }
 
   onPointerDown(event) {
@@ -31,7 +29,7 @@ export class TapGestureHandler extends GestureHandler {
     this.updateState(event);
   }
 
-  onAdditionalPointerAdd(event: AdaptedEvent): void {
+  onAdditionalPointerAdd(event: IncomingEvent): void {
     super.onAdditionalPointerAdd(event);
     this.tracker.addToTracker(event);
     this.trySettingPosition(event);
@@ -48,7 +46,7 @@ export class TapGestureHandler extends GestureHandler {
     this.updateState(event);
   }
 
-  onPointerUp(event: AdaptedEvent): void {
+  onPointerUp(event: IncomingEvent): void {
     super.onPointerUp(event);
     this.lastX = this.tracker.getLastAvgX();
     this.lastY = this.tracker.getLastAvgY();
@@ -58,7 +56,7 @@ export class TapGestureHandler extends GestureHandler {
     this.updateState(event);
   }
 
-  onAdditionalPointerRemove(event: AdaptedEvent): void {
+  onAdditionalPointerRemove(event: IncomingEvent): void {
     super.onAdditionalPointerRemove(event);
     this.tracker.removeFromTracker(event.pointerId);
 
@@ -74,7 +72,7 @@ export class TapGestureHandler extends GestureHandler {
     this.updateState(event);
   }
 
-  onPointerMove(event: AdaptedEvent): void {
+  onPointerMove(event: IncomingEvent): void {
     this.trySettingPosition(event);
     this.tracker.track(event);
 
@@ -86,7 +84,7 @@ export class TapGestureHandler extends GestureHandler {
     super.onPointerMove(event);
   }
 
-  onPointerOutOfBounds(event: AdaptedEvent): void {
+  onPointerOutOfBounds(event: IncomingEvent): void {
     this.trySettingPosition(event);
     this.tracker.track(event);
 
@@ -102,7 +100,7 @@ export class TapGestureHandler extends GestureHandler {
     return {}
   }
 
-  private trySettingPosition(event: AdaptedEvent): void {
+  private trySettingPosition(event: IncomingEvent): void {
     if (this.currentState !== State.UNDETERMINED) return;
     this.offsetX = 0;
     this.offsetY = 0;
@@ -110,7 +108,7 @@ export class TapGestureHandler extends GestureHandler {
     this.startY = event.y;
   }
 
-  private updateState(event: AdaptedEvent): void {
+  private updateState(event: IncomingEvent): void {
     const logger = this.logger.cloneWithPrefix("updateState")
     if (this.maxNumberOfPointersSoFar < this.tracker.getTrackedPointersCount()) {
       this.maxNumberOfPointersSoFar = this.tracker.getTrackedPointersCount()
@@ -177,11 +175,13 @@ export class TapGestureHandler extends GestureHandler {
   }
 
   private endTap() {
+    const logger = this.logger.cloneWithPrefix("endTap")
     this.clearTimeouts();
     if (
       ++this.numberOfTapsSoFar === (this.config.numberOfTaps ?? DEFAULT_NUMBER_OF_TAPS) &&
         this.maxNumberOfPointersSoFar >= (this.config.minNumberOfPointers ?? 0)
     ) {
+      logger.info(JSON.stringify({numberOfTapsSoFar: this.numberOfTapsSoFar}))
       this.activate();
     } else {
       this.delayTimeout = setTimeout(() => this.fail(), this.config.maxDelayMs ?? DEFAULT_MAX_DELAY_MS);

package/harmony/gesture_handler/src/main/ets/gesture-handlers/detectors/RotationGestureDetector.ts

@@ -0,0 +1,167 @@
+import { PointerTracker, IncomingEvent, EventType } from '../../core';
+
+export interface RotationGestureListener {
+  onRotationBegin: (detector: RotationGestureDetector) => boolean;
+  onRotation: (detector: RotationGestureDetector) => boolean;
+  onRotationEnd: (detector: RotationGestureDetector) => void;
+}
+
+export default class RotationGestureDetector
+  implements RotationGestureListener
+{
+  onRotationBegin: (detector: RotationGestureDetector) => boolean;
+  onRotation: (detector: RotationGestureDetector) => boolean;
+  onRotationEnd: (detector: RotationGestureDetector) => void;
+
+  private currentTime = 0;
+  private previousTime = 0;
+
+  private previousAngle = 0;
+  private rotation = 0;
+
+  private anchorX = 0;
+  private anchorY = 0;
+
+  private isInProgress = false;
+
+  private keyPointers: number[] = [NaN, NaN];
+
+  constructor(callbacks: RotationGestureListener) {
+    this.onRotationBegin = callbacks.onRotationBegin;
+    this.onRotation = callbacks.onRotation;
+    this.onRotationEnd = callbacks.onRotationEnd;
+  }
+
+  private updateCurrent(event: IncomingEvent, tracker: PointerTracker): void {
+    this.previousTime = this.currentTime;
+    this.currentTime = event.time;
+
+    const [firstPointerID, secondPointerID] = this.keyPointers;
+
+    const firstPointerX: number = tracker.getLastX(firstPointerID);
+    const firstPointerY: number = tracker.getLastY(firstPointerID);
+    const secondPointerX: number = tracker.getLastX(secondPointerID);
+    const secondPointerY: number = tracker.getLastY(secondPointerID);
+
+    const vectorX: number = secondPointerX - firstPointerX;
+    const vectorY: number = secondPointerY - firstPointerY;
+
+    this.anchorX = (firstPointerX + secondPointerX) / 2;
+    this.anchorY = (firstPointerY + secondPointerY) / 2;
+
+    //Angle diff should be positive when rotating in clockwise direction
+    const angle: number = -Math.atan2(vectorY, vectorX);
+
+    this.rotation = Number.isNaN(this.previousAngle)
+      ? 0
+      : this.previousAngle - angle;
+
+    this.previousAngle = angle;
+
+    if (this.rotation > Math.PI) {
+      this.rotation -= Math.PI;
+    } else if (this.rotation < -Math.PI) {
+      this.rotation += Math.PI;
+    }
+
+    if (this.rotation > Math.PI / 2) {
+      this.rotation -= Math.PI;
+    } else if (this.rotation < -Math.PI / 2) {
+      this.rotation += Math.PI;
+    }
+  }
+
+  private finish(): void {
+    if (!this.isInProgress) {
+      return;
+    }
+
+    this.isInProgress = false;
+    this.keyPointers = [NaN, NaN];
+    this.onRotationEnd(this);
+  }
+
+  private setKeyPointers(tracker: PointerTracker): void {
+    if (this.keyPointers[0] && this.keyPointers[1]) {
+      return;
+    }
+
+    const pointerIDs: IterableIterator<number> = tracker.getData().keys();
+
+    this.keyPointers[0] = pointerIDs.next().value as number;
+    this.keyPointers[1] = pointerIDs.next().value as number;
+  }
+
+  public onTouchEvent(event: IncomingEvent, tracker: PointerTracker): boolean {
+    switch (event.eventType) {
+      case EventType.DOWN:
+        this.isInProgress = false;
+        break;
+
+      case EventType.ADDITIONAL_POINTER_DOWN:
+        if (this.isInProgress) {
+          break;
+        }
+        this.isInProgress = true;
+
+        this.previousTime = event.time;
+        this.previousAngle = NaN;
+
+        this.setKeyPointers(tracker);
+
+        this.updateCurrent(event, tracker);
+        this.onRotationBegin(this);
+        break;
+
+      case EventType.MOVE:
+        if (!this.isInProgress) {
+          break;
+        }
+
+        this.updateCurrent(event, tracker);
+        this.onRotation(this);
+
+        break;
+
+      case EventType.ADDITIONAL_POINTER_UP:
+        if (!this.isInProgress) {
+          break;
+        }
+
+        if (this.keyPointers.indexOf(event.pointerId) >= 0) {
+          this.finish();
+        }
+
+        break;
+
+      case EventType.UP:
+        if (this.isInProgress) {
+          this.finish();
+        }
+        break;
+    }
+
+    return true;
+  }
+
+  public getTimeDelta(): number {
+    return this.currentTime + this.previousTime;
+  }
+
+  public getAnchorX(): number {
+    return this.anchorX;
+  }
+
+  public getAnchorY(): number {
+    return this.anchorY;
+  }
+
+  public getRotation(): number {
+    return this.rotation;
+  }
+
+  public reset(): void {
+    this.keyPointers = [NaN, NaN];
+    this.isInProgress = false;
+  }
+}

package/harmony/gesture_handler/src/main/ets/gesture-handlers/index.ts

@@ -0,0 +1 @@
+export * from "./GestureHandlerFactory"

package/harmony/gesture_handler/src/main/ets/namespace/RNGestureHandlerModule.ts

@@ -1,25 +1,24 @@
 // This file was generated.
-import { Tag } from "../../ts"
 
 export namespace RNGestureHandlerModule {
   export const NAME = 'RNGestureHandlerModule' as const
 
   export interface Spec {
     handleSetJSResponder(tag: number, blockNativeResponder: boolean): void;
-  
+
     handleClearJSResponder(): void;
-  
+
     createGestureHandler(handlerName: string, handlerTag: number, config: Object): void;
-  
+
     attachGestureHandler(handlerTag: number, newView: number, actionType: number): void;
-  
+
     updateGestureHandler(handlerTag: number, newConfig: Object): void;
-  
+
     dropGestureHandler(handlerTag: number): void;
-  
+
     install(): boolean;
-  
+
     flushOperations(): void;
-  
+
   }
 }