@react-native-oh-tpl/react-native-gesture-handler 2.14.8-rc.1 → 2.14.14

package/harmony/gesture_handler/src/main/ets/core/GestureHandlerOrchestrator.ts

@@ -0,0 +1,344 @@
+import { GestureHandler } from "./GestureHandler"
+import { State, getStateName } from "./State"
+import { PointerType } from "./IncomingEvent"
+import { RNGHLogger } from "./RNGHLogger"
+
+export class GestureHandlerOrchestrator {
+  private awaitingHandlers: Set<GestureHandler> = new Set()
+  private gestureHandlers: GestureHandler[] = []
+  private handlersToCancel: GestureHandler[] = []
+  private activationIndex: number = 0
+
+  private logger: RNGHLogger
+
+  constructor(logger: RNGHLogger) {
+    this.logger = logger.cloneAndJoinPrefix("GestureHandlerOrchestrator")
+  }
+
+  public onHandlerStateChange(handler: GestureHandler, newState: State, oldState: State, sendIfDisabled?: boolean) {
+    const logger =
+      this.logger.cloneAndJoinPrefix(`onHandlerStateChange(handler=${handler.getTag()}, newState=${getStateName(newState)}, oldState=${getStateName(oldState)})`)
+    logger.debug("start")
+
+    if (!handler.isEnabled() && !sendIfDisabled) {
+      return;
+    }
+
+    // this.handlingChangeSemaphore += 1;
+
+    if (this.isFinishedState(newState)) {
+      this.awaitingHandlers.forEach((otherHandler) => {
+        if (otherHandler.shouldWaitFor(handler)) {
+          if (newState === State.END) {
+            otherHandler?.cancel();
+            if (otherHandler.getState() === State.END) {
+              // Handle edge case, where discrete gestures end immediately after activation thus
+              // their state is set to END and when the gesture they are waiting for activates they
+              // should be cancelled, however `cancel` was never sent as gestures were already in the END state.
+              // Send synthetic BEGAN -> CANCELLED to properly handle JS logic
+              otherHandler.sendEvent({ newState: State.CANCELLED, oldState: State.BEGAN });
+            }
+            otherHandler?.setAwaiting(false);
+          } else {
+            this.tryActivate(otherHandler);
+          }
+        }
+      });
+    }
+
+    if (newState === State.ACTIVE) {
+      this.tryActivate(handler);
+    } else if (oldState === State.ACTIVE || oldState === State.END) {
+      if (handler.isActive()) {
+        handler.sendEvent({ newState, oldState });
+      } else if (
+        oldState === State.ACTIVE &&
+          (newState === State.CANCELLED || newState === State.FAILED)
+      ) {
+        handler.sendEvent({ newState, oldState: State.BEGAN });
+      }
+    } else if (
+      oldState !== State.UNDETERMINED ||
+        newState !== State.CANCELLED
+    ) {
+      handler.sendEvent({ newState, oldState });
+    }
+
+    // this.handlingChangeSemaphore -= 1;
+
+    this.cleanUpFinishedHandlers();
+    if (!this.awaitingHandlers.has(handler)) {
+      this.cleanupAwaitingHandlers(handler);
+    }
+  }
+
+  private isFinishedState(state: State) {
+    return [State.END, State.FAILED, State.CANCELLED].includes(state)
+  }
+
+  private tryActivate(handler: GestureHandler): void {
+    const logger = this.logger.cloneAndJoinPrefix(`tryActivate(${handler.getTag()})`)
+    logger.debug({
+      gestureHandlers: this.gestureHandlers.map(gh => gh.getTag()),
+      awaitingHandlers: Array.from(this.awaitingHandlers).map(gh => gh.getTag()),
+      handlersToCancel: this.handlersToCancel.map(gh => gh.getTag())
+    })
+    if (this.shouldBeCancelledByFinishedHandler(handler)) {
+      logger.debug("failed to activate - cancelling")
+      handler.cancel();
+      return;
+    }
+    if (this.hasOtherHandlerToWaitFor(handler)) {
+      this.addAwaitingHandler(handler);
+      logger.debug("request ignored - has other handler waiting")
+      return;
+    }
+    const handlerState = handler.getState();
+    if (handlerState === State.CANCELLED || handlerState === State.FAILED) {
+      logger.debug("request ignored - handler is in cancelled or failed state")
+      return;
+    }
+    if (this.shouldActivate(handler)) {
+      logger.debug("activating")
+      this.makeActive(handler);
+      return;
+    }
+    if (handlerState === State.ACTIVE) {
+      logger.debug("failed to activate - handler is already active, marking as fail")
+      handler.fail();
+      return;
+    }
+    if (handlerState === State.BEGAN) {
+      logger.debug("handler is in BEGAN state but shouldActivate returned false - cancelling")
+      handler.cancel();
+    }
+  }
+
+  private shouldBeCancelledByFinishedHandler(
+    handler: GestureHandler
+  ): boolean {
+    const shouldBeCancelled = (otherHandler: GestureHandler) => {
+      return (
+        handler.shouldWaitFor(otherHandler) &&
+          otherHandler.getState() === State.END
+      );
+    };
+    return this.gestureHandlers.some(shouldBeCancelled);
+  }
+
+  private hasOtherHandlerToWaitFor(handler: GestureHandler): boolean {
+    const logger = this.logger.cloneAndJoinPrefix(`hasOtherHandlerToWaitFor(handler=${handler.getTag()})`)
+    for (const otherHandler of this.gestureHandlers) {
+      if (otherHandler === handler) {
+        return false
+      }
+      if (!this.isFinishedState(otherHandler.getState()) && handler.shouldWaitFor(otherHandler)) {
+        logger.debug("true")
+        return true
+      }
+    }
+    logger.debug("false")
+    return false;
+  }
+
+  private addAwaitingHandler(handler: GestureHandler) {
+    const logger = this.logger.cloneAndJoinPrefix(`addAwaitingHandler(handlerTag=${handler.getTag()})`)
+    logger.debug({ awaitingHandlers: this.awaitingHandlers })
+    if (!this.awaitingHandlers.has(handler)) {
+      this.awaitingHandlers.add(handler)
+      handler.setAwaiting(true)
+      handler.setActivationIndex(this.activationIndex++)
+    }
+  }
+
+  private shouldActivate(handler: GestureHandler) {
+    for (const otherHandler of this.gestureHandlers) {
+      if (this.shouldHandlerBeCancelledByOtherHandler({ handler, otherHandler })) {
+        return false
+      }
+    }
+    return true
+  }
+
+  private shouldHandlerBeCancelledByOtherHandler({ handler, otherHandler }: {
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  }): boolean {
+    const logger =
+      this.logger.cloneAndJoinPrefix(`shouldHandlerBeCancelledByOtherHandler(${handler.getTag()}, ${otherHandler.getTag()})`)
+    if (this.canRunSimultaneously(handler, otherHandler)) {
+      logger.debug("false")
+      return false;
+    }
+    if (handler !== otherHandler && (handler.isAwaiting() || handler.getState() === State.ACTIVE)) {
+      const result = handler.shouldBeCancelledByOther(otherHandler)
+      logger.debug(`${result} (1)`)
+      return result
+    }
+    const result = this.checkOverlap(handler, otherHandler)
+    logger.debug(`${result} (2)`)
+    return result;
+  }
+
+  private canRunSimultaneously(handlerA: GestureHandler, handlerB: GestureHandler) {
+    const logger = this.logger.cloneAndJoinPrefix("canRunSimultaneously")
+    const result = handlerA === handlerB
+      || handlerA.shouldRecognizeSimultaneously(handlerB)
+      || handlerB.shouldRecognizeSimultaneously(handlerA)
+
+    logger.debug({ result, handlerA: handlerA.getTag(), handlerB: handlerB.getTag() })
+    return result
+  }
+
+  private checkOverlap(
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  ): boolean {
+    // If handlers don't have common pointers, default return value is false.
+    // However, if at least on pointer overlaps with both handlers, we return true
+    // This solves issue in overlapping parents example
+
+    // TODO: Find better way to handle that issue, for example by activation order and handler cancelling
+
+    const handlerPointers: number[] = handler.getTrackedPointersID();
+    const otherPointers: number[] = otherHandler.getTrackedPointersID();
+    let overlap = false;
+    handlerPointers.forEach((pointer: number) => {
+      const handlerX: number = handler.getTracker().getLastX(pointer);
+      const handlerY: number = handler.getTracker().getLastY(pointer);
+      if (
+        handler.getView().isPositionInBounds({ x: handlerX, y: handlerY }) &&
+        otherHandler.getView().isPositionInBounds({ x: handlerX, y: handlerY })
+      ) {
+        overlap = true;
+      }
+    });
+    otherPointers.forEach((pointer: number) => {
+      const otherX: number = otherHandler.getTracker().getLastX(pointer);
+      const otherY: number = otherHandler.getTracker().getLastY(pointer);
+      if (
+        handler.getView().isPositionInBounds({ x: otherX, y: otherY }) &&
+        otherHandler.getView().isPositionInBounds({ x: otherX, y: otherY })
+      ) {
+        overlap = true;
+      }
+    });
+    return overlap;
+  }
+
+  private makeActive(handler: GestureHandler): void {
+    handler.setActive(true)
+    handler.setShouldResetProgress(true)
+    handler.setActivationIndex(this.activationIndex++)
+    for (const otherHandler of this.gestureHandlers) {
+      if (this.shouldHandlerBeCancelledByOtherHandler({ handler: otherHandler, otherHandler: handler })) {
+        this.handlersToCancel.push(otherHandler)
+      }
+    }
+    for (let i = this.handlersToCancel.length - 1; i >= 0; --i) {
+      this.handlersToCancel[i]?.cancel();
+    }
+    this.handlersToCancel = []
+    for (const awaitingHandler of this.awaitingHandlers) {
+      if (this.shouldHandlerBeCancelledByOtherHandler({ handler: awaitingHandler, otherHandler: handler })) {
+        awaitingHandler.cancel();
+        awaitingHandler.setAwaiting(true);
+      }
+    }
+    const currentState = handler.getState()
+    handler.sendEvent({ newState: State.ACTIVE, oldState: State.BEGAN })
+    if (currentState !== State.ACTIVE) {
+      handler.sendEvent({ newState: State.END, oldState: State.ACTIVE })
+      if (currentState !== State.END) {
+        handler.sendEvent({ newState: State.UNDETERMINED, oldState: State.END })
+      }
+    }
+    if (handler.isAwaiting()) {
+      handler.setAwaiting(false)
+      this.awaitingHandlers.delete(handler)
+    }
+  }
+
+  private cleanUpHandlers(handler: GestureHandler) {
+    this.cleanUpFinishedHandlers()
+    if (this.awaitingHandlers.has(handler)) {
+      this.cleanupAwaitingHandlers(handler);
+    }
+  }
+
+  private cleanUpFinishedHandlers(): void {
+    for (let i = this.gestureHandlers.length - 1; i >= 0; --i) {
+      const handler = this.gestureHandlers[i];
+      if (!handler) {
+        continue;
+      }
+      if (this.isFinishedState(handler.getState()) && !handler.isAwaiting()) {
+        this.gestureHandlers.splice(i, 1);
+        this.cleanUpHandler(handler);
+      }
+    }
+  }
+
+  private cleanupAwaitingHandlers(handler: GestureHandler): void {
+    const logger = this.logger.cloneAndJoinPrefix(`cleanupAwaitingHandlers(handler=${handler.getTag()})`)
+    logger.debug({ awaitingHandlers: this.awaitingHandlers })
+    for (const awaitingHandler of this.awaitingHandlers) {
+      if (
+        awaitingHandler.isAwaiting() &&
+        awaitingHandler.shouldWaitFor(handler)
+      ) {
+        this.cleanUpHandler(awaitingHandler);
+        this.awaitingHandlers.delete(awaitingHandler)
+      }
+    }
+  }
+
+  private cleanUpHandler(handler: GestureHandler) {
+    handler.reset();
+    handler.setActive(false);
+    handler.setAwaiting(false);
+    handler.setActivationIndex(Number.MAX_VALUE);
+  }
+
+  public registerHandlerIfNotPresent(handler: GestureHandler) {
+    this.logger.info(`registerHandlerIfNotPresent(${handler.getTag()})`)
+    if (this.gestureHandlers.includes(handler)) {
+      return;
+    }
+    this.gestureHandlers.push(handler);
+    handler.setActive(false);
+    handler.setAwaiting(false);
+    handler.setActivationIndex(Number.MAX_SAFE_INTEGER);
+  }
+
+  /**
+   This function is called when handler receives touchdown event
+   If handler is using mouse or pen as a pointer and any handler receives touch event,
+   mouse/pen event disappears - it doesn't send onPointerCancel nor onPointerUp (and others)
+   This became a problem because handler was left at active state without any signal to end or fail
+   To handle this, when new touch event is received, we loop through active handlers and check which type of
+   pointer they're using. If there are any handler with mouse/pen as a pointer, we cancel them
+   */
+  public cancelMouseAndPenGestures(currentHandler: GestureHandler): void {
+    this.logger.info("cancelMouseAndPenGestures")
+    this.gestureHandlers.forEach((handler: GestureHandler) => {
+      if (handler.getPointerType() !== PointerType.MOUSE && handler.getPointerType() !== PointerType.PEN) {
+        return;
+      }
+
+      if (handler !== currentHandler) {
+        handler.cancel();
+      } else {
+        // Handler that received touch event should have its pointer tracker reset
+        // This allows handler to smoothly change from mouse/pen to touch
+        // The drawback is, that when we try to use mouse/pen one more time, it doesn't send onPointerDown at the first time
+        // so it is required to click two times to get handler to work
+        //
+        // However, handler will receive manually created onPointerEnter that is triggered in EventManager in onPointerMove method.
+        // There may be possibility to use that fact to make handler respond properly to first mouse click
+        handler.getTracker().resetTracker();
+      }
+    });
+  }
+}
+

package/harmony/gesture_handler/src/main/ets/core/GestureHandlerRegistry.ts

@@ -0,0 +1,63 @@
+import { GestureHandler } from "./GestureHandler"
+import { View } from "./View"
+import { RNGHLogger } from "./RNGHLogger"
+import { ViewRegistry } from "./ViewRegistry"
+
+export class GestureHandlerRegistry {
+  private gestureHandlerByHandlerTag: Map<number, GestureHandler> = new Map()
+  private gestureHandlersByViewTag: Map<number, Set<GestureHandler>> = new Map()
+  private viewRegistry: ViewRegistry | undefined
+  private logger: RNGHLogger
+
+  constructor(viewRegistry: ViewRegistry | undefined, logger: RNGHLogger) {
+    this.logger = logger.cloneAndJoinPrefix("GestureHandlerRegistry")
+    this.viewRegistry = viewRegistry
+  }
+
+  public addGestureHandler(gestureHandler: GestureHandler) {
+    this.gestureHandlerByHandlerTag.set(gestureHandler.getTag(), gestureHandler)
+  }
+
+  public bindGestureHandlerWithView(gestureHandlerTag: number, view: View) {
+    this.logger.cloneAndJoinPrefix("bindGestureHandlerWithView").debug({gestureHandlerTag, viewTag: view.getTag()})
+    const viewTag = view.getTag()
+    if (!this.gestureHandlersByViewTag.has(viewTag))
+      this.gestureHandlersByViewTag.set(viewTag, new Set())
+    const gestureHandler = this.gestureHandlerByHandlerTag.get(gestureHandlerTag)
+    this.gestureHandlersByViewTag.get(viewTag).add(gestureHandler)
+    gestureHandler.onViewAttached(view)
+  }
+
+  public getGestureHandlersByViewTag(viewTag: number): GestureHandler[] {
+    return Array.from(this.gestureHandlersByViewTag.get(viewTag) ?? [])
+  }
+
+  public removeGestureHandlerByHandlerTag(handlerTag: number) {
+    const gestureHandler = this.gestureHandlerByHandlerTag.get(handlerTag)
+    if (!gestureHandler) {
+      return;
+    }
+    const viewTag = gestureHandler.getView()?.getTag();
+    if (viewTag) {
+      const gestureHandlers = this.gestureHandlersByViewTag.get(viewTag)
+      if (gestureHandlers) {
+        gestureHandlers.delete(gestureHandler)
+        if (gestureHandlers.size === 0) {
+          this.gestureHandlersByViewTag.delete(viewTag)
+          this.viewRegistry?.deleteByTag(viewTag)
+        }
+      }
+    }
+    if (gestureHandler.getView()) {
+      // Handler is in "prepared" state which means it is registered in the orchestrator and can
+      // receive touch events. This means that before we remove it from the registry we need to
+      // "cancel" it so that orchestrator does no longer keep a reference to it.
+      gestureHandler.cancel()
+    }
+    this.gestureHandlerByHandlerTag.delete(handlerTag)
+  }
+
+  public getGestureHandlerByHandlerTag(handlerTag: number): GestureHandler {
+    return this.gestureHandlerByHandlerTag.get(handlerTag)
+  }
+}

package/harmony/gesture_handler/src/main/ets/core/IncomingEvent.ts

@@ -0,0 +1,78 @@
+export interface HitSlop {
+  left?: number;
+  right?: number;
+  top?: number;
+  bottom?: number;
+  horizontal?: number;
+  vertical?: number;
+  width?: number;
+  height?: number;
+}
+
+const RIGHT = 1;
+const LEFT = 2;
+const UP = 4;
+const DOWN = 8;
+
+export const Directions = {
+  RIGHT: RIGHT,
+  LEFT: LEFT,
+  UP: UP,
+  DOWN: DOWN,
+} as const;
+
+export type Directions = typeof Directions[keyof typeof Directions];
+
+export const DiagonalDirections = {
+  UP_RIGHT: UP | RIGHT,
+  DOWN_RIGHT: DOWN | RIGHT,
+  UP_LEFT: UP | LEFT,
+  DOWN_LEFT: DOWN | LEFT,
+} as const;
+
+export type DiagonalDirections =
+  typeof DiagonalDirections[keyof typeof DiagonalDirections];
+
+export enum PointerType {
+  NONE = 'none',
+  MOUSE = 'mouse',
+  TOUCH = 'touch',
+  PEN = 'pen',
+}
+
+export enum EventType {
+  DOWN = "DOWN",
+  ADDITIONAL_POINTER_DOWN = "ADDITIONAL_POINTER_DOWN",
+  UP = "UP",
+  ADDITIONAL_POINTER_UP = "ADDITIONAL_POINTER_UP",
+  MOVE = "MOVE",
+  ENTER = "ENTER",
+  OUT = "OUT",
+  CANCEL = "CANCEL",
+}
+
+export type Touch = {id: number, x: number, y: number, absoluteX: number, absoluteY: number}
+
+export enum TouchEventType {
+  UNDETERMINED = 0,
+  DOWN = 1,
+  MOVE = 2,
+  UP = 3,
+  CANCELLED = 4,
+}
+
+export interface IncomingEvent {
+  x: number;
+  y: number;
+  offsetX: number;
+  offsetY: number;
+  pointerId: number;
+  eventType: EventType;
+  pointerType: PointerType;
+  buttons: number;
+  time: number;
+  allTouches?: Touch[];
+  changedTouches?: Touch[];
+  touchEventType?: TouchEventType;
+}
+

package/harmony/gesture_handler/src/main/ets/core/InteractionManager.ts

@@ -0,0 +1,144 @@
+import { GestureHandler, Handler, GestureConfig as Config, GHTag } from "./GestureHandler"
+import { RNGHLogger } from "./RNGHLogger"
+
+export class InteractionManager {
+  private readonly waitForRelations: Map<GHTag, Set<GHTag>> = new Map()
+  private readonly simultaneousRelations: Map<GHTag, GHTag[]> = new Map()
+  private readonly blocksHandlersRelations: Map<GHTag, GHTag[]> = new Map();
+
+  private logger: RNGHLogger
+
+  constructor(logger: RNGHLogger) {
+    this.logger = logger.cloneAndJoinPrefix("InteractionManager")
+  }
+
+  public configureInteractions(handler: GestureHandler, config: Config) {
+    this.dropRelationsForHandlerWithTag(handler.getTag());
+
+    if (config.waitFor) {
+      const waitFor = new Set<GHTag>();
+      config.waitFor.forEach((otherHandler: Handler): void => {
+        // New API reference
+        if (typeof otherHandler === 'number') {
+          waitFor.add(otherHandler);
+        } else {
+          // Old API reference
+          waitFor.add(otherHandler.handlerTag);
+        }
+      });
+
+      this.waitForRelations.set(handler.getTag(), waitFor);
+    }
+
+    if (config.simultaneousHandlers) {
+      const simultaneousHandlers: number[] = [];
+      config.simultaneousHandlers.forEach((otherHandler: Handler): void => {
+        if (typeof otherHandler === 'number') {
+          simultaneousHandlers.push(otherHandler);
+        } else {
+          simultaneousHandlers.push(otherHandler.handlerTag);
+        }
+      });
+
+      this.simultaneousRelations.set(handler.getTag(), simultaneousHandlers);
+    }
+
+     if (config.blocksHandlers) {
+       const blocksHandlers: number[] = [];
+       config.blocksHandlers.forEach((otherHandler: Handler): void => {
+         if (typeof otherHandler === 'number') {
+           blocksHandlers.push(otherHandler);
+         } else {
+           blocksHandlers.push(otherHandler.handlerTag);
+         }
+       });
+       this.blocksHandlersRelations.set(handler.getTag(), blocksHandlers);
+     }
+  }
+
+  public shouldWaitForHandlerFailure(
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  ): boolean {
+    const logger = this.logger.cloneAndJoinPrefix(`shouldWaitForHandlerFailure(${handler.getTag()}, ${otherHandler.getTag()})`)
+    const waitFor = this.waitForRelations.get(
+      handler.getTag()
+    );
+    logger.debug({waitFor: Array.from(waitFor ?? [])})
+    if (!waitFor) {
+      logger.debug("false")
+      return false;
+    }
+
+    let shouldWait = false;
+    waitFor.forEach((tag: number): void => {
+      if (tag === otherHandler.getTag()) {
+        shouldWait = true;
+        return; //Returns from callback
+      }
+    });
+    logger.debug(shouldWait)
+    return shouldWait;
+  }
+
+  public shouldRecognizeSimultaneously(
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  ): boolean {
+    const logger = this.logger.cloneAndJoinPrefix(`shouldRecognizeSimultaneously(${handler.getTag()}, ${otherHandler.getTag()})`)
+    const simultaneousHandlers: number[] | undefined =
+      this.simultaneousRelations.get(handler.getTag());
+    if (!simultaneousHandlers) {
+      logger.debug(`false - Handler ${handler.getTag()} doesn't have simultaneousRelations specified`)
+      return false;
+    }
+    let shouldRecognizeSimultaneously = false;
+    simultaneousHandlers.forEach((tag: number): void => {
+      if (tag === otherHandler.getTag()) {
+        shouldRecognizeSimultaneously = true;
+        return;
+      }
+    });
+    logger.debug(`${shouldRecognizeSimultaneously} ${JSON.stringify({ simultaneousHandlers })}`)
+    return shouldRecognizeSimultaneously;
+  }
+
+  public shouldRequireHandlerToWaitForFailure(
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  ): boolean {
+    const waitFor: number[] | undefined = this.blocksHandlersRelations.get(
+      handler.getTag()
+    );
+
+    return (
+      waitFor?.find((tag: number) => {
+        return tag === otherHandler.getTag();
+      }) !== undefined
+    );
+  }
+
+  public shouldHandlerBeCancelledBy(
+    handler: GestureHandler,
+    otherHandler: GestureHandler
+  ): boolean {
+    const logger = this.logger.cloneAndJoinPrefix(`shouldHandlerBeCancelledBy(handler=${handler.getTag()}, otherHandler=${otherHandler.getTag()})`)
+    // We check constructor name instead of using `instanceof` in order do avoid circular dependencies
+    // const isNativeHandler =
+    //   otherHandler.constructor.name === 'NativeViewGestureHandler';
+    // const isActive = otherHandler.getState() === State.ACTIVE;
+    // const isButton = otherHandler.isButton?.() === true;
+    // return isNativeHandler && isActive && !isButton;
+    return false
+  }
+
+  public dropRelationsForHandlerWithTag(handlerTag: number): void {
+    this.waitForRelations.delete(handlerTag);
+    this.simultaneousRelations.delete(handlerTag);
+  }
+
+  public reset() {
+    this.waitForRelations.clear();
+    this.simultaneousRelations.clear();
+  }
+}