diff --git a/src/web/detectors/RotationGestureDetector.ts b/src/web/detectors/RotationGestureDetector.ts index af2c05f277..35f06e28e4 100644 --- a/src/web/detectors/RotationGestureDetector.ts +++ b/src/web/detectors/RotationGestureDetector.ts @@ -10,23 +10,19 @@ export interface RotationGestureListener { export default class RotationGestureDetector implements RotationGestureListener { + private _currentTime = 0; + private _previousTime = 0; + private _previousAngle = 0; + private _rotation = 0; + private _anchorX = 0; + private _anchorY = 0; + private _inProgress = false; + private _keyPointers: number[] = [NaN, NaN]; + 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; @@ -71,11 +67,11 @@ export default class RotationGestureDetector } private finish(): void { - if (!this.isInProgress) { + if (!this.inProgress) { return; } - this.isInProgress = false; + this.inProgress = false; this.keyPointers = [NaN, NaN]; this.onRotationEnd(this); } @@ -94,14 +90,14 @@ export default class RotationGestureDetector public onTouchEvent(event: AdaptedEvent, tracker: PointerTracker): boolean { switch (event.eventType) { case EventTypes.DOWN: - this.isInProgress = false; + this.inProgress = false; break; case EventTypes.ADDITIONAL_POINTER_DOWN: - if (this.isInProgress) { + if (this.inProgress) { break; } - this.isInProgress = true; + this.inProgress = true; this.previousTime = event.time; this.previousAngle = NaN; @@ -113,7 +109,7 @@ export default class RotationGestureDetector break; case EventTypes.MOVE: - if (!this.isInProgress) { + if (!this.inProgress) { break; } @@ -123,7 +119,7 @@ export default class RotationGestureDetector break; case EventTypes.ADDITIONAL_POINTER_UP: - if (!this.isInProgress) { + if (!this.inProgress) { break; } @@ -134,7 +130,7 @@ export default class RotationGestureDetector break; case EventTypes.UP: - if (this.isInProgress) { + if (this.inProgress) { this.finish(); } break; @@ -143,24 +139,68 @@ export default class RotationGestureDetector return true; } - public getTimeDelta(): number { - return this.currentTime + this.previousTime; + public reset(): void { + this.keyPointers = [NaN, NaN]; + this.inProgress = false; } - public getAnchorX(): number { - return this.anchorX; + public get currentTime() { + return this._currentTime; + } + public set currentTime(time: number) { + this._currentTime = time; } - public getAnchorY(): number { - return this.anchorY; + public get previousTime() { + return this._previousTime; + } + public set previousTime(time: number) { + this._previousTime = time; } - public getRotation(): number { - return this.rotation; + public get previousAngle() { + return this._previousAngle; + } + public set previousAngle(angle: number) { + this._previousAngle = angle; } - public reset(): void { - this.keyPointers = [NaN, NaN]; - this.isInProgress = false; + public get rotation() { + return this._rotation; + } + public set rotation(angle: number) { + this._rotation = angle; + } + + public get anchorX() { + return this._anchorX; + } + public set anchorX(value: number) { + this._anchorX = value; + } + + public get anchorY() { + return this._anchorY; + } + public set anchorY(value: number) { + this._anchorY = value; + } + + public get inProgress() { + return this._inProgress; + } + public set inProgress(inProgress: boolean) { + this._inProgress = inProgress; + } + + public get keyPointers() { + return this._keyPointers; + } + public set keyPointers(pointers: number[]) { + this._keyPointers = pointers; + } + + public get timeDelta() { + return this.currentTime + this.previousTime; } } diff --git a/src/web/detectors/ScaleGestureDetector.ts b/src/web/detectors/ScaleGestureDetector.ts index a85adb0174..9c0f89c0b3 100644 --- a/src/web/detectors/ScaleGestureDetector.ts +++ b/src/web/detectors/ScaleGestureDetector.ts @@ -10,32 +10,33 @@ export interface ScaleGestureListener { } export default class ScaleGestureDetector implements ScaleGestureListener { - public onScaleBegin: (detector: ScaleGestureDetector) => boolean; - public onScale: (detector: ScaleGestureDetector) => boolean; - public onScaleEnd: (detector: ScaleGestureDetector) => void; + private _focusX!: number; + private _focusY!: number; + private _currentSpan!: number; + private _prevSpan!: number; + private _initialSpan!: number; + private _currentTime!: number; + private _prevTime!: number; + private _inProgress = false; + private _spanSlop: number; + private _minSpan: number; + private _pointerTracker: PointerTracker; - private focusX!: number; - private focusY!: number; - - private currentSpan!: number; - private prevSpan!: number; - private initialSpan!: number; - - private currentTime!: number; - private prevTime!: number; - - private inProgress = false; - - private spanSlop: number; - private minSpan: number; + onScaleBegin: (detector: ScaleGestureDetector) => boolean; + onScale: (detector: ScaleGestureDetector) => boolean; + onScaleEnd: (detector: ScaleGestureDetector) => void; - public constructor(callbacks: ScaleGestureListener) { + public constructor( + callbacks: ScaleGestureListener, + pointerTracker: PointerTracker + ) { this.onScaleBegin = callbacks.onScaleBegin; this.onScale = callbacks.onScale; this.onScaleEnd = callbacks.onScaleEnd; - this.spanSlop = DEFAULT_TOUCH_SLOP * 2; - this.minSpan = 0; + this._spanSlop = DEFAULT_TOUCH_SLOP * 2; + this._minSpan = 0; + this._pointerTracker = pointerTracker; } public onTouchEvent(event: AdaptedEvent, tracker: PointerTracker): boolean { @@ -145,24 +146,89 @@ export default class ScaleGestureDetector implements ScaleGestureListener { return true; } - public getCurrentSpan(): number { - return this.currentSpan; + public get focusX() { + return this._focusX; + } + public set focusX(value: number) { + this._focusX = value; + } + + public get focusY() { + return this._focusY; + } + public set focusY(value: number) { + this._focusY = value; + } + + public get currentSpan() { + return this._currentSpan; + } + public set currentSpan(value: number) { + this._currentSpan = value; + } + + public get prevSpan() { + return this._prevSpan; + } + public set prevSpan(value: number) { + this._prevSpan = value; + } + + public get initialSpan() { + return this._initialSpan; + } + public set initialSpan(value: number) { + this._initialSpan = value; } - public getFocusX(): number { - return this.focusX; + public get currentTime() { + return this._currentTime; + } + public set currentTime(time: number) { + this._currentTime = time; } - public getFocusY(): number { - return this.focusY; + public get prevTime() { + return this._prevTime; + } + public set prevTime(time: number) { + this._prevTime = time; + } + + public get inProgress() { + return this._inProgress; + } + public set inProgress(inProgress: boolean) { + this._inProgress = inProgress; + } + + public get spanSlop() { + return this._spanSlop; + } + public set spanSlop(value: number) { + this._spanSlop = value; + } + + public get minSpan() { + return this._minSpan; + } + public set minSpan(value: number) { + this._minSpan = value; + } + + public get pointerTracker() { + return this._pointerTracker; + } + public set pointerTracker(pointerTracker: PointerTracker) { + this._pointerTracker = pointerTracker; } - public getTimeDelta(): number { + public get timeDelta(): number { return this.currentTime - this.prevTime; } - public getScaleFactor(numOfPointers: number): number { - if (numOfPointers < 2) { + public get scaleFactor() { + if (this.pointerTracker.getTrackedPointersCount() < 2) { return 1; } diff --git a/src/web/handlers/FlingGestureHandler.ts b/src/web/handlers/FlingGestureHandler.ts index bab45a83a2..4149e5b6b6 100644 --- a/src/web/handlers/FlingGestureHandler.ts +++ b/src/web/handlers/FlingGestureHandler.ts @@ -1,7 +1,6 @@ import { State } from '../../State'; import { DiagonalDirections, Directions } from '../../Directions'; import { AdaptedEvent, Config } from '../interfaces'; - import GestureHandler from './GestureHandler'; import Vector from '../tools/Vector'; import { coneToDeviation } from '../utils'; @@ -16,15 +15,13 @@ const AXIAL_DEVIATION_COSINE = coneToDeviation(DEFAULT_ALIGNMENT_CONE); const DIAGONAL_DEVIATION_COSINE = coneToDeviation(90 - DEFAULT_ALIGNMENT_CONE); export default class FlingGestureHandler extends GestureHandler { - private numberOfPointersRequired = DEFAULT_NUMBER_OF_TOUCHES_REQUIRED; - private direction: Directions = DEFAULT_DIRECTION; - - private maxDurationMs = DEFAULT_MAX_DURATION_MS; - private minVelocity = DEFAULT_MIN_VELOCITY; - private delayTimeout!: number; - - private maxNumberOfPointersSimultaneously = 0; - private keyPointer = NaN; + private _numberOfPointersRequired = DEFAULT_NUMBER_OF_TOUCHES_REQUIRED; + private _direction: Directions = DEFAULT_DIRECTION; + private _maxDurationMs = DEFAULT_MAX_DURATION_MS; + private _minVelocity = DEFAULT_MIN_VELOCITY; + private _delayTimeout!: number; + private _maxNumberOfPointersSimultaneously = 0; + private _keyPointer = NaN; public init(ref: number, propsRef: React.RefObject): void { super.init(ref, propsRef); @@ -51,7 +48,10 @@ export default class FlingGestureHandler extends GestureHandler { } private tryEndFling(): boolean { - const velocityVector = Vector.fromVelocity(this.tracker, this.keyPointer); + const velocityVector = Vector.fromVelocity( + this.pointerTracker, + this.keyPointer + ); const getAlignment = ( direction: Directions | DiagonalDirections, @@ -109,7 +109,7 @@ export default class FlingGestureHandler extends GestureHandler { return; } - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); this.keyPointer = event.pointerId; super.onPointerDown(event); @@ -119,35 +119,35 @@ export default class FlingGestureHandler extends GestureHandler { } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); this.newPointerAction(); } private newPointerAction(): void { - if (this.currentState === State.UNDETERMINED) { + if (this.state === State.UNDETERMINED) { this.startFling(); } - if (this.currentState !== State.BEGAN) { + if (this.state !== State.BEGAN) { return; } this.tryEndFling(); if ( - this.tracker.getTrackedPointersCount() > + this.pointerTracker.getTrackedPointersCount() > this.maxNumberOfPointersSimultaneously ) { this.maxNumberOfPointersSimultaneously = - this.tracker.getTrackedPointersCount(); + this.pointerTracker.getTrackedPointersCount(); } } private pointerMoveAction(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); - if (this.currentState !== State.BEGAN) { + if (this.state !== State.BEGAN) { return; } @@ -177,11 +177,11 @@ export default class FlingGestureHandler extends GestureHandler { } private onUp(event: AdaptedEvent): void { - if (this.currentState === State.BEGAN) { + if (this.state === State.BEGAN) { this.endFling(); } - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); } public activate(force?: boolean): void { @@ -194,4 +194,53 @@ export default class FlingGestureHandler extends GestureHandler { this.numberOfPointersRequired = DEFAULT_NUMBER_OF_TOUCHES_REQUIRED; this.direction = DEFAULT_DIRECTION; } + + public get numberOfPointersRequired() { + return this._numberOfPointersRequired; + } + public set numberOfPointersRequired(value: number) { + this._numberOfPointersRequired = value; + } + + public get direction() { + return this._direction; + } + public set direction(direction: Directions) { + this._direction = direction; + } + + public get maxDurationMs() { + return this._maxDurationMs; + } + public set maxDurationMs(value: number) { + this._maxDurationMs = value; + } + + public get minVelocity() { + return this._minVelocity; + } + public set minVelocity(value: number) { + this._minVelocity = value; + } + + public get delayTimeout() { + return this._delayTimeout; + } + public set delayTimeout(value: number) { + this._delayTimeout = value; + } + + public get maxNumberOfPointersSimultaneously() { + return this._maxNumberOfPointersSimultaneously; + } + public set maxNumberOfPointersSimultaneously(value: number) { + this._maxNumberOfPointersSimultaneously = value; + } + + public get keyPointer() { + return this._keyPointer; + } + public set keyPointer(value: number) { + this._keyPointer = value; + } } diff --git a/src/web/handlers/GestureHandler.ts b/src/web/handlers/GestureHandler.ts index 89fab1cc9e..bbdae894a7 100644 --- a/src/web/handlers/GestureHandler.ts +++ b/src/web/handlers/GestureHandler.ts @@ -20,44 +20,34 @@ import { PointerType } from '../../PointerType'; import { GestureHandlerDelegate } from '../tools/GestureHandlerDelegate'; export default abstract class GestureHandler implements IGestureHandler { - private lastSentState: State | null = null; - protected currentState: State = State.UNDETERMINED; - - protected shouldCancelWhenOutside = false; - protected hasCustomActivationCriteria = false; - protected enabled = false; - - private viewRef!: number; - private propsRef!: React.RefObject; - private handlerTag!: number; - protected config: Config = { enabled: false }; - - protected tracker: PointerTracker = new PointerTracker(); - - // Orchestrator properties - protected activationIndex = 0; - protected awaiting = false; - protected active = false; - protected shouldResetProgress = false; - protected pointerType: PointerType = PointerType.MOUSE; - - protected delegate: GestureHandlerDelegate; + private _lastSentState: State | null = null; + private _state: State = State.UNDETERMINED; + private _shouldCancelWhenOutside = false; + private _hasCustomActivationCriteria = false; + private _enabled = false; + private _viewRef!: number; + private _propsRef!: React.RefObject; + private _config: Config = { enabled: false }; + private _handlerTag!: number; + private _pointerTracker: PointerTracker = new PointerTracker(); + private _activationIndex = 0; + private _awaiting = false; + private _active = false; + private _shouldResetProgress = false; + private _pointerType: PointerType = PointerType.MOUSE; + private _delegate: GestureHandlerDelegate; public constructor( delegate: GestureHandlerDelegate ) { - this.delegate = delegate; + this._delegate = delegate; } - // - // Initializing handler - // - protected init(viewRef: number, propsRef: React.RefObject) { this.propsRef = propsRef; this.viewRef = viewRef; - this.currentState = State.UNDETERMINED; + this.state = State.UNDETERMINED; this.delegate.init(viewRef, this); } @@ -79,36 +69,28 @@ export default abstract class GestureHandler implements IGestureHandler { manager.registerListeners(); } - // - // Resetting handler - // - protected onCancel(): void {} protected onReset(): void {} protected resetProgress(): void {} public reset(): void { - this.tracker.resetTracker(); + this.pointerTracker.resetTracker(); this.onReset(); this.resetProgress(); this.delegate.reset(); - this.currentState = State.UNDETERMINED; + this.state = State.UNDETERMINED; } - // - // State logic - // - public moveToState(newState: State, sendIfDisabled?: boolean) { - if (this.currentState === newState) { + if (this.state === newState) { return; } - const oldState = this.currentState; - this.currentState = newState; + const oldState = this.state; + this.state = newState; if ( - this.tracker.getTrackedPointersCount() > 0 && + this.pointerTracker.getTrackedPointersCount() > 0 && this.config.needsPointerData && this.isFinished() ) { @@ -125,7 +107,7 @@ export default abstract class GestureHandler implements IGestureHandler { this.onStateChange(newState, oldState); if (!this.enabled && this.isFinished()) { - this.currentState = State.UNDETERMINED; + this.state = State.UNDETERMINED; } } @@ -136,7 +118,7 @@ export default abstract class GestureHandler implements IGestureHandler { return; } - if (this.currentState === State.UNDETERMINED) { + if (this.state === State.UNDETERMINED) { this.moveToState(State.BEGAN); } } @@ -145,12 +127,9 @@ export default abstract class GestureHandler implements IGestureHandler { * @param {boolean} sendIfDisabled - Used when handler becomes disabled. With this flag orchestrator will be forced to send fail event */ public fail(sendIfDisabled?: boolean): void { - if ( - this.currentState === State.ACTIVE || - this.currentState === State.BEGAN - ) { + if (this.state === State.ACTIVE || this.state === State.BEGAN) { // Here the order of calling the delegate and moveToState is important. - // At this point we can use currentState as previuos state, because immediately after changing cursor we call moveToState method. + // At this point we can use state as previuos state, because immediately after changing cursor we call moveToState method. this.delegate.onFail(); this.moveToState(State.FAILED, sendIfDisabled); @@ -164,9 +143,9 @@ export default abstract class GestureHandler implements IGestureHandler { */ public cancel(sendIfDisabled?: boolean): void { if ( - this.currentState === State.ACTIVE || - this.currentState === State.UNDETERMINED || - this.currentState === State.BEGAN + this.state === State.ACTIVE || + this.state === State.UNDETERMINED || + this.state === State.BEGAN ) { this.onCancel(); @@ -180,8 +159,7 @@ export default abstract class GestureHandler implements IGestureHandler { public activate(force = false) { if ( (this.config.manualActivation !== true || force) && - (this.currentState === State.UNDETERMINED || - this.currentState === State.BEGAN) + (this.state === State.UNDETERMINED || this.state === State.BEGAN) ) { this.delegate.onActivate(); this.moveToState(State.ACTIVE); @@ -189,10 +167,7 @@ export default abstract class GestureHandler implements IGestureHandler { } public end() { - if ( - this.currentState === State.BEGAN || - this.currentState === State.ACTIVE - ) { + if (this.state === State.BEGAN || this.state === State.ACTIVE) { // Same as above - order matters this.delegate.onEnd(); @@ -202,38 +177,6 @@ export default abstract class GestureHandler implements IGestureHandler { this.resetProgress(); } - // - // Methods for orchestrator - // - - public isAwaiting(): boolean { - return this.awaiting; - } - public setAwaiting(value: boolean): void { - this.awaiting = value; - } - - public isActive(): boolean { - return this.active; - } - public setActive(value: boolean): void { - this.active = value; - } - - public getShouldResetProgress(): boolean { - return this.shouldResetProgress; - } - public setShouldResetProgress(value: boolean): void { - this.shouldResetProgress = value; - } - - public getActivationIndex(): number { - return this.activationIndex; - } - public setActivationIndex(value: number): void { - this.activationIndex = value; - } - public shouldWaitForHandlerFailure(handler: IGestureHandler): boolean { if (handler === this) { return false; @@ -278,10 +221,6 @@ export default abstract class GestureHandler implements IGestureHandler { ); } - // - // Event actions - // - protected onPointerDown(event: AdaptedEvent): void { GestureHandlerOrchestrator.getInstance().recordHandlerIfNotPresent(this); this.pointerType = event.pointerType; @@ -308,7 +247,7 @@ export default abstract class GestureHandler implements IGestureHandler { } protected onPointerLeave(event: AdaptedEvent): void { if (this.shouldCancelWhenOutside) { - switch (this.currentState) { + switch (this.state) { case State.ACTIVE: this.cancel(); break; @@ -348,7 +287,7 @@ export default abstract class GestureHandler implements IGestureHandler { } if (this.active) { - this.sendEvent(this.currentState, this.currentState); + this.sendEvent(this.state, this.state); } this.tryToSendTouchEvent(event); @@ -398,7 +337,7 @@ export default abstract class GestureHandler implements IGestureHandler { this.lastSentState = newState; invokeNullableMethod(onGestureHandlerStateChange, resultEvent); } - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { resultEvent.nativeEvent.oldState = undefined; invokeNullableMethod(onGestureHandlerEvent, resultEvent); } @@ -407,10 +346,10 @@ export default abstract class GestureHandler implements IGestureHandler { private transformEventData(newState: State, oldState: State): ResultEvent { return { nativeEvent: { - numberOfPointers: this.tracker.getTrackedPointersCount(), + numberOfPointers: this.pointerTracker.getTrackedPointersCount(), state: newState, pointerInside: this.delegate.isPointerInBounds( - this.tracker.getAbsoluteCoordsAverage() + this.pointerTracker.getAbsoluteCoordsAverage() ), ...this.transformNativeEvent(), handlerTag: this.handlerTag, @@ -430,7 +369,7 @@ export default abstract class GestureHandler implements IGestureHandler { const all: PointerData[] = []; const changed: PointerData[] = []; - const trackerData = this.tracker.getData(); + const trackerData = this.pointerTracker.getData(); // This if handles edge case where all pointers have been cancelled // When pointercancel is triggered, reset method is called. This means that tracker will be reset after first pointer being cancelled @@ -441,7 +380,7 @@ export default abstract class GestureHandler implements IGestureHandler { } trackerData.forEach((element: TrackerElement, key: number): void => { - const id: number = this.tracker.getMappedTouchEventId(key); + const id: number = this.pointerTracker.getMappedTouchEventId(key); all.push({ id: id, @@ -456,7 +395,7 @@ export default abstract class GestureHandler implements IGestureHandler { // However, if the event is cancel, we want to cancel all pointers to avoid crashes if (event.eventType !== EventTypes.CANCEL) { changed.push({ - id: this.tracker.getMappedTouchEventId(event.pointerId), + id: this.pointerTracker.getMappedTouchEventId(event.pointerId), x: event.x - rect.pageX, y: event.y - rect.pageY, absoluteX: event.x, @@ -464,7 +403,7 @@ export default abstract class GestureHandler implements IGestureHandler { }); } else { trackerData.forEach((element: TrackerElement, key: number): void => { - const id: number = this.tracker.getMappedTouchEventId(key); + const id: number = this.pointerTracker.getMappedTouchEventId(key); changed.push({ id: id, @@ -510,7 +449,7 @@ export default abstract class GestureHandler implements IGestureHandler { return { nativeEvent: { handlerTag: this.handlerTag, - state: this.currentState, + state: this.state, eventType: eventType, changedTouches: changed, allTouches: all, @@ -527,14 +466,14 @@ export default abstract class GestureHandler implements IGestureHandler { const all: PointerData[] = []; const changed: PointerData[] = []; - const trackerData = this.tracker.getData(); + const trackerData = this.pointerTracker.getData(); if (trackerData.size === 0) { return; } trackerData.forEach((element: TrackerElement, key: number): void => { - const id: number = this.tracker.getMappedTouchEventId(key); + const id: number = this.pointerTracker.getMappedTouchEventId(key); all.push({ id: id, @@ -556,7 +495,7 @@ export default abstract class GestureHandler implements IGestureHandler { const cancelEvent: ResultTouchEvent = { nativeEvent: { handlerTag: this.handlerTag, - state: this.currentState, + state: this.state, eventType: TouchEventType.CANCELLED, changedTouches: changed, allTouches: all, @@ -574,8 +513,8 @@ export default abstract class GestureHandler implements IGestureHandler { protected transformNativeEvent(): Record { // Those properties are shared by most handlers and if not this method will be overriden - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); - const lastRelativeCoords = this.tracker.getRelativeCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); + const lastRelativeCoords = this.pointerTracker.getRelativeCoordsAverage(); return { x: lastRelativeCoords.x, @@ -585,10 +524,6 @@ export default abstract class GestureHandler implements IGestureHandler { }; } - // - // Handling config - // - public updateGestureConfig({ enabled = true, ...props }: Config): void { this.config = { enabled: enabled, ...props }; this.enabled = enabled; @@ -596,7 +531,7 @@ export default abstract class GestureHandler implements IGestureHandler { this.delegate.onEnabledChange(enabled); if (this.config.shouldCancelWhenOutside !== undefined) { - this.setShouldCancelWhenOutside(this.config.shouldCancelWhenOutside); + this.shouldCancelWhenOutside = this.config.shouldCancelWhenOutside; } this.validateHitSlops(); @@ -605,7 +540,7 @@ export default abstract class GestureHandler implements IGestureHandler { return; } - switch (this.currentState) { + switch (this.state) { case State.ACTIVE: this.fail(true); break; @@ -728,7 +663,7 @@ export default abstract class GestureHandler implements IGestureHandler { } const rect = this.delegate.measureView(); - const { x, y } = this.tracker.getLastAbsoluteCoords(); + const { x, y } = this.pointerTracker.getLastAbsoluteCoords(); const offsetX: number = x - rect.pageX; const offsetY: number = y - rect.pageY; @@ -751,60 +686,130 @@ export default abstract class GestureHandler implements IGestureHandler { this.delegate.destroy(this.config); } - // - // Getters and setters - // + public getTrackedPointersID(): number[] { + return this.pointerTracker.getTrackedPointersID(); + } - public getTag(): number { - return this.handlerTag; + private isFinished(): boolean { + return ( + this.state === State.END || + this.state === State.FAILED || + this.state === State.CANCELLED + ); } - public setTag(tag: number): void { - this.handlerTag = tag; + public get lastSentState() { + return this._lastSentState; + } + public set lastSentState(state: State | null) { + this._lastSentState = state; } - public getConfig() { - return this.config; + public get state() { + return this._state; + } + public set state(state: State) { + this._state = state; } - public getDelegate(): GestureHandlerDelegate { - return this.delegate; + public get shouldCancelWhenOutside() { + return this._shouldCancelWhenOutside; + } + public set shouldCancelWhenOutside(value: boolean) { + this._shouldCancelWhenOutside = value; } - public getTracker(): PointerTracker { - return this.tracker; + public get hasCustomActivationCriteria() { + return this._hasCustomActivationCriteria; + } + public set hasCustomActivationCriteria(value: boolean) { + this._hasCustomActivationCriteria = value; } - public getTrackedPointersID(): number[] { - return this.tracker.getTrackedPointersID(); + public get enabled() { + return this._enabled; + } + public set enabled(value: boolean) { + this._enabled = value; } - public getState(): State { - return this.currentState; + public get viewRef() { + return this._viewRef; + } + public set viewRef(value: number) { + this._viewRef = value; } - public isEnabled(): boolean { - return this.enabled; + public get propsRef() { + return this._propsRef; + } + public set propsRef(propsRef: React.RefObject) { + this._propsRef = propsRef; } - private isFinished(): boolean { - return ( - this.currentState === State.END || - this.currentState === State.FAILED || - this.currentState === State.CANCELLED - ); + public get handlerTag() { + return this._handlerTag; + } + public set handlerTag(tag: number) { + this._handlerTag = tag; } - protected setShouldCancelWhenOutside(shouldCancel: boolean) { - this.shouldCancelWhenOutside = shouldCancel; + public get config() { + return this._config; + } + public set config(config: Config) { + this._config = config; } - protected getShouldCancelWhenOutside(): boolean { - return this.shouldCancelWhenOutside; + public get pointerTracker() { + return this._pointerTracker; + } + public set pointerTracker(pointerTracker: PointerTracker) { + this._pointerTracker = pointerTracker; + } + + public get activationIndex() { + return this._activationIndex; + } + public set activationIndex(value: number) { + this._activationIndex = value; + } + + public get awaiting() { + return this._awaiting; + } + public set awaiting(value: boolean) { + this._awaiting = value; + } + + public get active() { + return this._active; + } + public set active(value: boolean) { + this._active = value; } - public getPointerType(): PointerType { - return this.pointerType; + public get shouldResetProgress() { + return this._shouldResetProgress; + } + public set shouldResetProgress(value: boolean) { + this._shouldResetProgress = value; + } + + public get pointerType() { + return this._pointerType; + } + public set pointerType(pointerType: PointerType) { + this._pointerType = pointerType; + } + + public get delegate() { + return this._delegate; + } + public set delegate( + delegate: GestureHandlerDelegate + ) { + this._delegate = delegate; } } diff --git a/src/web/handlers/HoverGestureHandler.ts b/src/web/handlers/HoverGestureHandler.ts index 832c8e412d..782ff98218 100644 --- a/src/web/handlers/HoverGestureHandler.ts +++ b/src/web/handlers/HoverGestureHandler.ts @@ -4,7 +4,7 @@ import GestureHandlerOrchestrator from '../tools/GestureHandlerOrchestrator'; import GestureHandler from './GestureHandler'; export default class HoverGestureHandler extends GestureHandler { - private stylusData: StylusData | undefined; + private _stylusData: StylusData | undefined; public init(ref: number, propsRef: React.RefObject) { super.init(ref, propsRef); @@ -24,18 +24,18 @@ export default class HoverGestureHandler extends GestureHandler { protected onPointerMoveOver(event: AdaptedEvent): void { GestureHandlerOrchestrator.getInstance().recordHandlerIfNotPresent(this); - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); this.stylusData = event.stylusData; super.onPointerMoveOver(event); - if (this.getState() === State.UNDETERMINED) { + if (this.state === State.UNDETERMINED) { this.begin(); this.activate(); } } protected onPointerMoveOut(event: AdaptedEvent): void { - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); this.stylusData = event.stylusData; super.onPointerMoveOut(event); @@ -44,7 +44,7 @@ export default class HoverGestureHandler extends GestureHandler { } protected onPointerMove(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); this.stylusData = event.stylusData; super.onPointerMove(event); @@ -54,4 +54,11 @@ export default class HoverGestureHandler extends GestureHandler { super.onPointerCancel(event); this.reset(); } + + public get stylusData() { + return this._stylusData; + } + public set stylusData(stylusData: StylusData | undefined) { + this._stylusData = stylusData; + } } diff --git a/src/web/handlers/IGestureHandler.ts b/src/web/handlers/IGestureHandler.ts index f46ff26447..1b51e80652 100644 --- a/src/web/handlers/IGestureHandler.ts +++ b/src/web/handlers/IGestureHandler.ts @@ -1,25 +1,30 @@ -import type { PointerType } from '../../PointerType'; +import { PointerType } from '../../PointerType'; import type { MouseButton } from '../../handlers/gestureHandlerCommon'; import type { State } from '../../State'; import type { Config } from '../interfaces'; import type EventManager from '../tools/EventManager'; -import type { GestureHandlerDelegate } from '../tools/GestureHandlerDelegate'; -import type PointerTracker from '../tools/PointerTracker'; +import { GestureHandlerDelegate } from '../tools/GestureHandlerDelegate'; +import PointerTracker from '../tools/PointerTracker'; export default interface IGestureHandler { - getTag: () => number; - getState: () => State; - getConfig: () => Config; - getDelegate: () => GestureHandlerDelegate; + active: boolean; + awaiting: boolean; + activationIndex: number; + config: Config; + delegate: GestureHandlerDelegate; + enabled: boolean; + pointerTracker: PointerTracker; + pointerType: PointerType; + shouldResetProgress: boolean; + state: State; + handlerTag: number; attachEventManager: (manager: EventManager) => void; isButtonInConfig: ( mouseButton: MouseButton | undefined ) => boolean | number | undefined; - getPointerType: () => PointerType; - getTracker: () => PointerTracker; getTrackedPointersID: () => number[]; begin: () => void; @@ -29,13 +34,6 @@ export default interface IGestureHandler { cancel: () => void; reset: () => void; - isEnabled: () => boolean; - isActive: () => boolean; - setActive: (value: boolean) => void; - isAwaiting: () => boolean; - setAwaiting: (value: boolean) => void; - setActivationIndex: (value: number) => void; - setShouldResetProgress: (value: boolean) => void; shouldWaitForHandlerFailure: (handler: IGestureHandler) => boolean; shouldRequireToWaitForFailure: (handler: IGestureHandler) => boolean; diff --git a/src/web/handlers/LongPressGestureHandler.ts b/src/web/handlers/LongPressGestureHandler.ts index 82ef5b3d78..c8b4344b96 100644 --- a/src/web/handlers/LongPressGestureHandler.ts +++ b/src/web/handlers/LongPressGestureHandler.ts @@ -8,18 +8,15 @@ const DEFAULT_MAX_DIST_DP = 10; const SCALING_FACTOR = 10; export default class LongPressGestureHandler extends GestureHandler { - private minDurationMs = DEFAULT_MIN_DURATION_MS; - private defaultMaxDistSq = DEFAULT_MAX_DIST_DP * SCALING_FACTOR; - - private maxDistSq = this.defaultMaxDistSq; - private numberOfPointers = 1; - private startX = 0; - private startY = 0; - - private startTime = 0; - private previousTime = 0; - - private activationTimeout: number | undefined; + private _minDurationMs = DEFAULT_MIN_DURATION_MS; + private _defaultMaxDistSq = DEFAULT_MAX_DIST_DP * SCALING_FACTOR; + private _maxDistSq = this.defaultMaxDistSq; + private _numberOfPointers = 1; + private _startX = 0; + private _startY = 0; + private _startTime = 0; + private _previousTime = 0; + private _activationTimeout: number | undefined; public init(ref: number, propsRef: React.RefObject) { if (this.config.enableContextMenu === undefined) { @@ -67,7 +64,7 @@ export default class LongPressGestureHandler extends GestureHandler { return; } - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.startX = event.x; @@ -80,14 +77,15 @@ export default class LongPressGestureHandler extends GestureHandler { } protected onPointerAdd(event: AdaptedEvent): void { super.onPointerAdd(event); - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); - if (this.tracker.getTrackedPointersCount() > this.numberOfPointers) { + if (this.pointerTracker.getTrackedPointersCount() > this.numberOfPointers) { this.fail(); return; } - const absoluteCoordsAverage = this.tracker.getAbsoluteCoordsAverage(); + const absoluteCoordsAverage = + this.pointerTracker.getAbsoluteCoordsAverage(); this.startX = absoluteCoordsAverage.x; this.startY = absoluteCoordsAverage.y; @@ -97,15 +95,15 @@ export default class LongPressGestureHandler extends GestureHandler { protected onPointerMove(event: AdaptedEvent): void { super.onPointerMove(event); - this.tracker.track(event); + this.pointerTracker.track(event); this.checkDistanceFail(); } protected onPointerUp(event: AdaptedEvent): void { super.onPointerUp(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.end(); } else { this.fail(); @@ -114,18 +112,18 @@ export default class LongPressGestureHandler extends GestureHandler { protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); if ( - this.tracker.getTrackedPointersCount() < this.numberOfPointers && - this.getState() !== State.ACTIVE + this.pointerTracker.getTrackedPointersCount() < this.numberOfPointers && + this.state !== State.ACTIVE ) { this.fail(); } } private tryBegin(): void { - if (this.currentState !== State.UNDETERMINED) { + if (this.state !== State.UNDETERMINED) { return; } @@ -136,7 +134,9 @@ export default class LongPressGestureHandler extends GestureHandler { } private tryActivate(): void { - if (this.tracker.getTrackedPointersCount() !== this.numberOfPointers) { + if ( + this.pointerTracker.getTrackedPointersCount() !== this.numberOfPointers + ) { return; } @@ -150,7 +150,8 @@ export default class LongPressGestureHandler extends GestureHandler { } private checkDistanceFail(): void { - const absoluteCoordsAverage = this.tracker.getAbsoluteCoordsAverage(); + const absoluteCoordsAverage = + this.pointerTracker.getAbsoluteCoordsAverage(); const dx = absoluteCoordsAverage.x - this.startX; const dy = absoluteCoordsAverage.y - this.startY; @@ -160,10 +161,73 @@ export default class LongPressGestureHandler extends GestureHandler { return; } - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.cancel(); } else { this.fail(); } } + + public get minDurationMs() { + return this._minDurationMs; + } + public set minDurationMs(value: number) { + this._minDurationMs = value; + } + + public get defaultMaxDistSq() { + return this._defaultMaxDistSq; + } + public set defaultMaxDistSq(value: number) { + this._defaultMaxDistSq = value; + } + + public get maxDistSq() { + return this._maxDistSq; + } + public set maxDistSq(value: number) { + this._maxDistSq = value; + } + + public get numberOfPointers() { + return this._numberOfPointers; + } + public set numberOfPointers(value: number) { + this._numberOfPointers = value; + } + + public get startX() { + return this._startX; + } + public set startX(value: number) { + this._startX = value; + } + + public get startY() { + return this._startY; + } + public set startY(value: number) { + this._startY = value; + } + + public get startTime() { + return this._startTime; + } + public set startTime(time: number) { + this._startTime = time; + } + + public get previousTime() { + return this._previousTime; + } + public set previousTime(time: number) { + this._previousTime = time; + } + + public get activationTimeout() { + return this._activationTimeout; + } + public set activationTimeout(value: number | undefined) { + this._activationTimeout = value; + } } diff --git a/src/web/handlers/ManualGestureHandler.ts b/src/web/handlers/ManualGestureHandler.ts index 9c9b37db17..17653042de 100644 --- a/src/web/handlers/ManualGestureHandler.ts +++ b/src/web/handlers/ManualGestureHandler.ts @@ -11,7 +11,7 @@ export default class ManualGestureHandler extends GestureHandler { } protected onPointerDown(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.begin(); @@ -19,27 +19,27 @@ export default class ManualGestureHandler extends GestureHandler { } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); } protected onPointerMove(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); super.onPointerMove(event); } protected onPointerOutOfBounds(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); super.onPointerOutOfBounds(event); } protected onPointerUp(event: AdaptedEvent): void { super.onPointerUp(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); } protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); } } diff --git a/src/web/handlers/NativeViewGestureHandler.ts b/src/web/handlers/NativeViewGestureHandler.ts index 9c4c64c169..1a7ee45e47 100644 --- a/src/web/handlers/NativeViewGestureHandler.ts +++ b/src/web/handlers/NativeViewGestureHandler.ts @@ -5,21 +5,18 @@ import { AdaptedEvent, Config } from '../interfaces'; import GestureHandler from './GestureHandler'; export default class NativeViewGestureHandler extends GestureHandler { - private buttonRole!: boolean; - + private _buttonRole!: boolean; // TODO: Implement logic for activation on start - // @ts-ignore Logic yet to be implemented - private shouldActivateOnStart = false; - private disallowInterruption = false; - - private startX = 0; - private startY = 0; - private minDistSq = DEFAULT_TOUCH_SLOP * DEFAULT_TOUCH_SLOP; + private _shouldActivateOnStart = false; + private _disallowInterruption = false; + private _startX = 0; + private _startY = 0; + private _minDistSq = DEFAULT_TOUCH_SLOP * DEFAULT_TOUCH_SLOP; public init(ref: number, propsRef: React.RefObject): void { super.init(ref, propsRef); - this.setShouldCancelWhenOutside(true); + this.shouldCancelWhenOutside = true; if (Platform.OS !== 'web') { return; @@ -60,7 +57,7 @@ export default class NativeViewGestureHandler extends GestureHandler { } protected onPointerDown(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.newPointerAction(); @@ -68,17 +65,17 @@ export default class NativeViewGestureHandler extends GestureHandler { } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); this.newPointerAction(); } private newPointerAction(): void { - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.startX = lastCoords.x; this.startY = lastCoords.y; - if (this.currentState !== State.UNDETERMINED) { + if (this.state !== State.UNDETERMINED) { return; } @@ -89,27 +86,24 @@ export default class NativeViewGestureHandler extends GestureHandler { } protected onPointerMove(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); const dx = this.startX - lastCoords.x; const dy = this.startY - lastCoords.y; const distSq = dx * dx + dy * dy; if (distSq >= this.minDistSq) { - if (this.buttonRole && this.currentState === State.ACTIVE) { + if (this.buttonRole && this.state === State.ACTIVE) { this.cancel(); - } else if (!this.buttonRole && this.currentState === State.BEGAN) { + } else if (!this.buttonRole && this.state === State.BEGAN) { this.activate(); } } } protected onPointerLeave(): void { - if ( - this.currentState === State.BEGAN || - this.currentState === State.ACTIVE - ) { + if (this.state === State.BEGAN || this.state === State.ACTIVE) { this.cancel(); } } @@ -125,10 +119,10 @@ export default class NativeViewGestureHandler extends GestureHandler { } private onUp(event: AdaptedEvent): void { - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); - if (this.tracker.getTrackedPointersCount() === 0) { - if (this.currentState === State.ACTIVE) { + if (this.pointerTracker.getTrackedPointersCount() === 0) { + if (this.state === State.ACTIVE) { this.end(); } else { this.fail(); @@ -143,7 +137,7 @@ export default class NativeViewGestureHandler extends GestureHandler { if ( handler instanceof NativeViewGestureHandler && - handler.getState() === State.ACTIVE && + handler.state === State.ACTIVE && handler.disallowsInterruption() ) { return false; @@ -152,17 +146,15 @@ export default class NativeViewGestureHandler extends GestureHandler { const canBeInterrupted = !this.disallowInterruption; if ( - this.currentState === State.ACTIVE && - handler.getState() === State.ACTIVE && + this.state === State.ACTIVE && + handler.state === State.ACTIVE && canBeInterrupted ) { return false; } return ( - this.currentState === State.ACTIVE && - canBeInterrupted && - handler.getTag() > 0 + this.state === State.ACTIVE && canBeInterrupted && handler.handlerTag > 0 ); } @@ -177,4 +169,46 @@ export default class NativeViewGestureHandler extends GestureHandler { public isButton(): boolean { return this.buttonRole; } + + public get buttonRole() { + return this._buttonRole; + } + public set buttonRole(isButton: boolean) { + this._buttonRole = isButton; + } + + public get shouldActivateOnStart() { + return this._shouldActivateOnStart; + } + public set shouldActivateOnStart(value: boolean) { + this._shouldActivateOnStart = value; + } + + public get disallowInterruption() { + return this._disallowInterruption; + } + public set disallowInterruption(value: boolean) { + this._disallowInterruption = value; + } + + public get startX() { + return this._startX; + } + public set startX(value: number) { + this._startX = value; + } + + public get startY() { + return this._startY; + } + public set startY(value: number) { + this._startY = value; + } + + public get minDistSq() { + return this._minDistSq; + } + public set minDistSq(value: number) { + this._minDistSq = value; + } } diff --git a/src/web/handlers/PanGestureHandler.ts b/src/web/handlers/PanGestureHandler.ts index b95d9ddb86..50a4d00e98 100644 --- a/src/web/handlers/PanGestureHandler.ts +++ b/src/web/handlers/PanGestureHandler.ts @@ -8,58 +8,49 @@ const DEFAULT_MIN_POINTERS = 1; const DEFAULT_MAX_POINTERS = 10; const DEFAULT_MIN_DIST_SQ = DEFAULT_TOUCH_SLOP * DEFAULT_TOUCH_SLOP; +const PAN_CUSTOM_ACTIVATION_PROPERTIES = [ + 'activeOffsetXStart', + 'activeOffsetXEnd', + 'failOffsetXStart', + 'failOffsetXEnd', + 'activeOffsetYStart', + 'activeOffsetYEnd', + 'failOffsetYStart', + 'failOffsetYEnd', + 'minVelocityX', + 'minVelocityY', + 'minVelocity', +]; + export default class PanGestureHandler extends GestureHandler { - private readonly customActivationProperties: string[] = [ - 'activeOffsetXStart', - 'activeOffsetXEnd', - 'failOffsetXStart', - 'failOffsetXEnd', - 'activeOffsetYStart', - 'activeOffsetYEnd', - 'failOffsetYStart', - 'failOffsetYEnd', - 'minVelocityX', - 'minVelocityY', - 'minVelocity', - ]; - - public velocityX = 0; - public velocityY = 0; - - private minDistSq = DEFAULT_MIN_DIST_SQ; - - private activeOffsetXStart = -Number.MAX_SAFE_INTEGER; - private activeOffsetXEnd = Number.MIN_SAFE_INTEGER; - private failOffsetXStart = Number.MIN_SAFE_INTEGER; - private failOffsetXEnd = Number.MAX_SAFE_INTEGER; - - private activeOffsetYStart = Number.MAX_SAFE_INTEGER; - private activeOffsetYEnd = Number.MIN_SAFE_INTEGER; - private failOffsetYStart = Number.MIN_SAFE_INTEGER; - private failOffsetYEnd = Number.MAX_SAFE_INTEGER; - - private minVelocityX = Number.MAX_SAFE_INTEGER; - private minVelocityY = Number.MAX_SAFE_INTEGER; - private minVelocitySq = Number.MAX_SAFE_INTEGER; - - private minPointers = DEFAULT_MIN_POINTERS; - private maxPointers = DEFAULT_MAX_POINTERS; - - private startX = 0; - private startY = 0; - private offsetX = 0; - private offsetY = 0; - private lastX = 0; - private lastY = 0; - - private stylusData: StylusData | undefined; - - private activateAfterLongPress = 0; - private activationTimeout = 0; - - private enableTrackpadTwoFingerGesture = false; - private endWheelTimeout = 0; - private wheelDevice = WheelDevice.UNDETERMINED; + private _velocityX = 0; + private _velocityY = 0; + private _minDistSq = DEFAULT_MIN_DIST_SQ; + private _activeOffsetXStart = -Number.MAX_SAFE_INTEGER; + private _activeOffsetXEnd = Number.MIN_SAFE_INTEGER; + private _failOffsetXStart = Number.MIN_SAFE_INTEGER; + private _failOffsetXEnd = Number.MAX_SAFE_INTEGER; + private _activeOffsetYStart = Number.MAX_SAFE_INTEGER; + private _activeOffsetYEnd = Number.MIN_SAFE_INTEGER; + private _failOffsetYStart = Number.MIN_SAFE_INTEGER; + private _failOffsetYEnd = Number.MAX_SAFE_INTEGER; + private _minVelocityX = Number.MAX_SAFE_INTEGER; + private _minVelocityY = Number.MAX_SAFE_INTEGER; + private _minVelocitySq = Number.MAX_SAFE_INTEGER; + private _minPointers = DEFAULT_MIN_POINTERS; + private _maxPointers = DEFAULT_MAX_POINTERS; + private _startX = 0; + private _startY = 0; + private _offsetX = 0; + private _offsetY = 0; + private _lastX = 0; + private _lastY = 0; + private _stylusData: StylusData | undefined; + private _activateAfterLongPress = 0; + private _activationTimeout = 0; + private _enableTrackpadTwoFingerGesture = false; + private _endWheelTimeout = 0; + private _wheelDevice = WheelDevice.UNDETERMINED; public init(ref: number, propsRef: React.RefObject): void { super.init(ref, propsRef); @@ -69,7 +60,7 @@ export default class PanGestureHandler extends GestureHandler { this.resetConfig(); super.updateGestureConfig({ enabled: enabled, ...props }); - this.checkCustomActivationCriteria(this.customActivationProperties); + this.checkCustomActivationCriteria(PAN_CUSTOM_ACTIVATION_PROPERTIES); if (this.config.minDist !== undefined) { this.minDistSq = this.config.minDist * this.config.minDist; @@ -228,12 +219,12 @@ export default class PanGestureHandler extends GestureHandler { return; } - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); this.stylusData = event.stylusData; super.onPointerDown(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -247,22 +238,22 @@ export default class PanGestureHandler extends GestureHandler { } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); this.tryBegin(event); this.offsetX += this.lastX - this.startX; this.offsetY += this.lastY - this.startY; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; this.startX = this.lastX; this.startY = this.lastY; - if (this.tracker.getTrackedPointersCount() > this.maxPointers) { - if (this.currentState === State.ACTIVE) { + if (this.pointerTracker.getTrackedPointersCount() > this.maxPointers) { + if (this.state === State.ACTIVE) { this.cancel(); } else { this.fail(); @@ -276,19 +267,19 @@ export default class PanGestureHandler extends GestureHandler { this.stylusData = event.stylusData; super.onPointerUp(event); - if (this.currentState === State.ACTIVE) { - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + if (this.state === State.ACTIVE) { + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; } - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); - if (this.tracker.getTrackedPointersCount() === 0) { + if (this.pointerTracker.getTrackedPointersCount() === 0) { this.clearActivationTimeout(); } - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.end(); } else { this.resetProgress(); @@ -298,12 +289,12 @@ export default class PanGestureHandler extends GestureHandler { protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); this.offsetX += this.lastX - this.startX; this.offsetY += this.lastY - this.startY; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -312,8 +303,8 @@ export default class PanGestureHandler extends GestureHandler { if ( !( - this.currentState === State.ACTIVE && - this.tracker.getTrackedPointersCount() < this.minPointers + this.state === State.ACTIVE && + this.pointerTracker.getTrackedPointersCount() < this.minPointers ) ) { this.checkBegan(); @@ -321,14 +312,14 @@ export default class PanGestureHandler extends GestureHandler { } protected onPointerMove(event: AdaptedEvent): void { - this.tracker.track(event); + this.pointerTracker.track(event); this.stylusData = event.stylusData; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; - const velocity = this.tracker.getVelocity(event.pointerId); + const velocity = this.pointerTracker.getVelocity(event.pointerId); this.velocityX = velocity.x; this.velocityY = velocity.y; @@ -338,24 +329,24 @@ export default class PanGestureHandler extends GestureHandler { } protected onPointerOutOfBounds(event: AdaptedEvent): void { - if (this.getShouldCancelWhenOutside()) { + if (this.shouldCancelWhenOutside) { return; } - this.tracker.track(event); + this.pointerTracker.track(event); this.stylusData = event.stylusData; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; - const velocity = this.tracker.getVelocity(event.pointerId); + const velocity = this.pointerTracker.getVelocity(event.pointerId); this.velocityX = velocity.x; this.velocityY = velocity.y; this.checkBegan(); - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { super.onPointerOutOfBounds(event); } } @@ -364,10 +355,10 @@ export default class PanGestureHandler extends GestureHandler { clearTimeout(this.endWheelTimeout); this.endWheelTimeout = setTimeout(() => { - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.end(); - this.tracker.removeFromTracker(event.pointerId); - this.currentState = State.UNDETERMINED; + this.pointerTracker.removeFromTracker(event.pointerId); + this.state = State.UNDETERMINED; } this.wheelDevice = WheelDevice.UNDETERMINED; @@ -382,7 +373,7 @@ export default class PanGestureHandler extends GestureHandler { return; } - if (this.currentState === State.UNDETERMINED) { + if (this.state === State.UNDETERMINED) { this.wheelDevice = event.wheelDeltaY! % 120 !== 0 ? WheelDevice.TOUCHPAD @@ -393,9 +384,9 @@ export default class PanGestureHandler extends GestureHandler { return; } - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -405,13 +396,13 @@ export default class PanGestureHandler extends GestureHandler { this.begin(); this.activate(); } - this.tracker.track(event); + this.pointerTracker.track(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; - const velocity = this.tracker.getVelocity(event.pointerId); + const velocity = this.pointerTracker.getVelocity(event.pointerId); this.velocityX = velocity.x; this.velocityY = velocity.y; @@ -527,8 +518,8 @@ export default class PanGestureHandler extends GestureHandler { private tryBegin(event: AdaptedEvent): void { if ( - this.currentState === State.UNDETERMINED && - this.tracker.getTrackedPointersCount() >= this.minPointers + this.state === State.UNDETERMINED && + this.pointerTracker.getTrackedPointersCount() >= this.minPointers ) { this.resetProgress(); this.offsetX = 0; @@ -544,14 +535,14 @@ export default class PanGestureHandler extends GestureHandler { }, this.activateAfterLongPress); } } else { - const velocity = this.tracker.getVelocity(event.pointerId); + const velocity = this.pointerTracker.getVelocity(event.pointerId); this.velocityX = velocity.x; this.velocityY = velocity.y; } } private checkBegan(): void { - if (this.currentState === State.BEGAN) { + if (this.state === State.BEGAN) { if (this.shouldFail()) { this.fail(); } else if (this.shouldActivate()) { @@ -561,7 +552,7 @@ export default class PanGestureHandler extends GestureHandler { } public activate(force = false): void { - if (this.currentState !== State.ACTIVE) { + if (this.state !== State.ACTIVE) { this.resetProgress(); } @@ -577,11 +568,207 @@ export default class PanGestureHandler extends GestureHandler { } protected resetProgress(): void { - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { return; } this.startX = this.lastX; this.startY = this.lastY; } + + public get velocityX() { + return this._velocityX; + } + public set velocityX(value: number) { + this._velocityX = value; + } + + public get velocityY() { + return this._velocityY; + } + public set velocityY(value: number) { + this._velocityY = value; + } + + public get minDistSq() { + return this._minDistSq; + } + public set minDistSq(value: number) { + this._minDistSq = value; + } + + public get activeOffsetXStart() { + return this._activeOffsetXStart; + } + public set activeOffsetXStart(value: number) { + this._activeOffsetXStart = value; + } + + public get activeOffsetXEnd() { + return this._activeOffsetXEnd; + } + public set activeOffsetXEnd(value: number) { + this._activeOffsetXEnd = value; + } + + public get failOffsetXStart() { + return this._failOffsetXStart; + } + public set failOffsetXStart(value: number) { + this._failOffsetXStart = value; + } + + public get failOffsetXEnd() { + return this._failOffsetXEnd; + } + public set failOffsetXEnd(value: number) { + this._failOffsetXEnd = value; + } + + public get activeOffsetYStart() { + return this._activeOffsetYStart; + } + public set activeOffsetYStart(value: number) { + this._activeOffsetYStart = value; + } + + public get activeOffsetYEnd() { + return this._activeOffsetYEnd; + } + public set activeOffsetYEnd(value: number) { + this._activeOffsetYEnd = value; + } + + public get failOffsetYStart() { + return this._failOffsetYStart; + } + public set failOffsetYStart(value: number) { + this._failOffsetYStart = value; + } + + public get failOffsetYEnd() { + return this._failOffsetYEnd; + } + public set failOffsetYEnd(value: number) { + this._failOffsetYEnd = value; + } + + public get minVelocityX() { + return this._minVelocityX; + } + public set minVelocityX(value: number) { + this._minVelocityX = value; + } + + public get minVelocityY() { + return this._minVelocityY; + } + public set minVelocityY(value: number) { + this._minVelocityY = value; + } + + public get minVelocitySq() { + return this._minVelocitySq; + } + public set minVelocitySq(value: number) { + this._minVelocitySq = value; + } + + public get minPointers() { + return this._minPointers; + } + public set minPointers(value: number) { + this._minPointers = value; + } + + public get maxPointers() { + return this._maxPointers; + } + public set maxPointers(value: number) { + this._maxPointers = value; + } + + public get startX() { + return this._startX; + } + public set startX(value: number) { + this._startX = value; + } + + public get startY() { + return this._startY; + } + public set startY(value: number) { + this._startY = value; + } + + public get offsetX() { + return this._offsetX; + } + public set offsetX(value: number) { + this._offsetX = value; + } + + public get offsetY() { + return this._offsetY; + } + public set offsetY(value: number) { + this._offsetY = value; + } + + public get lastX() { + return this._lastX; + } + public set lastX(value: number) { + this._lastX = value; + } + + public get lastY() { + return this._lastY; + } + public set lastY(value: number) { + this._lastY = value; + } + + public get stylusData() { + return this._stylusData; + } + public set stylusData(stylusData: StylusData | undefined) { + this._stylusData = stylusData; + } + + public get activateAfterLongPress() { + return this._activateAfterLongPress; + } + public set activateAfterLongPress(value: number) { + this._activateAfterLongPress = value; + } + + public get activationTimeout() { + return this._activationTimeout; + } + public set activationTimeout(value: number) { + this._activationTimeout = value; + } + + public get enableTrackpadTwoFingerGesture() { + return this._enableTrackpadTwoFingerGesture; + } + public set enableTrackpadTwoFingerGesture(value: boolean) { + this._enableTrackpadTwoFingerGesture = value; + } + + public get endWheelTimeout() { + return this._endWheelTimeout; + } + public set endWheelTimeout(value: number) { + this._endWheelTimeout = value; + } + + public get wheelDevice() { + return this._wheelDevice; + } + public set wheelDevice(value: WheelDevice) { + this._wheelDevice = value; + } } diff --git a/src/web/handlers/PinchGestureHandler.ts b/src/web/handlers/PinchGestureHandler.ts index 5ee8db2e59..b28da7a67c 100644 --- a/src/web/handlers/PinchGestureHandler.ts +++ b/src/web/handlers/PinchGestureHandler.ts @@ -8,32 +8,27 @@ import ScaleGestureDetector, { } from '../detectors/ScaleGestureDetector'; export default class PinchGestureHandler extends GestureHandler { - private scale = 1; - private velocity = 0; - - private startingSpan = 0; - private spanSlop = DEFAULT_TOUCH_SLOP; - - private scaleDetectorListener: ScaleGestureListener = { + 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(); + this.startingSpan = detector.currentSpan; return true; }, onScale: (detector: ScaleGestureDetector): boolean => { const prevScaleFactor: number = this.scale; - this.scale *= detector.getScaleFactor( - this.tracker.getTrackedPointersCount() - ); + this.scale *= detector.scaleFactor; - const delta = detector.getTimeDelta(); + const delta = detector.timeDelta; if (delta > 0) { this.velocity = (this.scale - prevScaleFactor) / delta; } if ( - Math.abs(this.startingSpan - detector.getCurrentSpan()) >= - this.spanSlop && - this.currentState === State.BEGAN + Math.abs(this.startingSpan - detector.currentSpan) >= this.spanSlop && + this.state === State.BEGAN ) { this.activate(); } @@ -44,15 +39,13 @@ export default class PinchGestureHandler extends GestureHandler { // eslint-disable-next-line @typescript-eslint/no-empty-function ): void => {}, }; - - private scaleGestureDetector: ScaleGestureDetector = new ScaleGestureDetector( - this.scaleDetectorListener - ); + private _scaleGestureDetector: ScaleGestureDetector = + new ScaleGestureDetector(this.scaleDetectorListener, this.pointerTracker); public init(ref: number, propsRef: React.RefObject) { super.init(ref, propsRef); - this.setShouldCancelWhenOutside(false); + this.shouldCancelWhenOutside = false; } public updateGestureConfig({ enabled = true, ...props }: Config): void { @@ -61,36 +54,36 @@ export default class PinchGestureHandler extends GestureHandler { protected transformNativeEvent() { return { - focalX: this.scaleGestureDetector.getFocusX(), - focalY: this.scaleGestureDetector.getFocusY(), + focalX: this.scaleGestureDetector.focusX, + focalY: this.scaleGestureDetector.focusY, velocity: this.velocity, scale: this.scale, }; } protected onPointerDown(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.tryToSendTouchEvent(event); } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); this.tryBegin(); - this.scaleGestureDetector.onTouchEvent(event, this.tracker); + this.scaleGestureDetector.onTouchEvent(event, this.pointerTracker); } protected onPointerUp(event: AdaptedEvent): void { super.onPointerUp(event); - this.tracker.removeFromTracker(event.pointerId); - if (this.currentState !== State.ACTIVE) { + this.pointerTracker.removeFromTracker(event.pointerId); + if (this.state !== State.ACTIVE) { return; } - this.scaleGestureDetector.onTouchEvent(event, this.tracker); + this.scaleGestureDetector.onTouchEvent(event, this.pointerTracker); - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.end(); } else { this.fail(); @@ -99,38 +92,38 @@ export default class PinchGestureHandler extends GestureHandler { protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.scaleGestureDetector.onTouchEvent(event, this.tracker); - this.tracker.removeFromTracker(event.pointerId); + this.scaleGestureDetector.onTouchEvent(event, this.pointerTracker); + this.pointerTracker.removeFromTracker(event.pointerId); if ( - this.currentState === State.ACTIVE && - this.tracker.getTrackedPointersCount() < 2 + this.state === State.ACTIVE && + this.pointerTracker.getTrackedPointersCount() < 2 ) { this.end(); } } protected onPointerMove(event: AdaptedEvent): void { - if (this.tracker.getTrackedPointersCount() < 2) { + if (this.pointerTracker.getTrackedPointersCount() < 2) { return; } - this.tracker.track(event); + this.pointerTracker.track(event); - this.scaleGestureDetector.onTouchEvent(event, this.tracker); + this.scaleGestureDetector.onTouchEvent(event, this.pointerTracker); super.onPointerMove(event); } protected onPointerOutOfBounds(event: AdaptedEvent): void { - if (this.tracker.getTrackedPointersCount() < 2) { + if (this.pointerTracker.getTrackedPointersCount() < 2) { return; } - this.tracker.track(event); + this.pointerTracker.track(event); - this.scaleGestureDetector.onTouchEvent(event, this.tracker); + this.scaleGestureDetector.onTouchEvent(event, this.pointerTracker); super.onPointerOutOfBounds(event); } private tryBegin(): void { - if (this.currentState !== State.UNDETERMINED) { + if (this.state !== State.UNDETERMINED) { return; } @@ -139,7 +132,7 @@ export default class PinchGestureHandler extends GestureHandler { } public activate(force?: boolean): void { - if (this.currentState !== State.ACTIVE) { + if (this.state !== State.ACTIVE) { this.resetProgress(); } @@ -151,10 +144,52 @@ export default class PinchGestureHandler extends GestureHandler { } protected resetProgress(): void { - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { return; } this.velocity = 0; this.scale = 1; } + + public get scale() { + return this._scale; + } + public set scale(value: number) { + this._scale = value; + } + + public get velocity() { + return this._velocity; + } + public set velocity(value: number) { + this._velocity = value; + } + + public get startingSpan() { + return this._startingSpan; + } + public set startingSpan(value: number) { + this._startingSpan = value; + } + + public get spanSlop() { + return this._spanSlop; + } + public set spanSlop(value: number) { + this._spanSlop = value; + } + + public get scaleDetectorListener() { + return this._scaleDetectorListener; + } + public set scaleDetectorListener(listener: ScaleGestureListener) { + this._scaleDetectorListener = listener; + } + + public get scaleGestureDetector() { + return this._scaleGestureDetector; + } + public set scaleGestureDetector(detector: ScaleGestureDetector) { + this._scaleGestureDetector = detector; + } } diff --git a/src/web/handlers/RotationGestureHandler.ts b/src/web/handlers/RotationGestureHandler.ts index f2654c6faa..c8bc9ac4c0 100644 --- a/src/web/handlers/RotationGestureHandler.ts +++ b/src/web/handlers/RotationGestureHandler.ts @@ -9,19 +9,17 @@ import RotationGestureDetector, { const ROTATION_RECOGNITION_THRESHOLD = Math.PI / 36; export default class RotationGestureHandler extends GestureHandler { - private rotation = 0; - private velocity = 0; - - private cachedAnchorX = 0; - private cachedAnchorY = 0; - - private rotationGestureListener: RotationGestureListener = { + private _rotation = 0; + private _velocity = 0; + private _cachedAnchorX = 0; + private _cachedAnchorY = 0; + private _rotationGestureListener: RotationGestureListener = { onRotationBegin: (_detector: RotationGestureDetector): boolean => true, onRotation: (detector: RotationGestureDetector): boolean => { const previousRotation: number = this.rotation; - this.rotation += detector.getRotation(); + this.rotation += detector.rotation; - const delta = detector.getTimeDelta(); + const delta = detector.timeDelta; if (delta > 0) { this.velocity = (this.rotation - previousRotation) / delta; @@ -29,7 +27,7 @@ export default class RotationGestureHandler extends GestureHandler { if ( Math.abs(this.rotation) >= ROTATION_RECOGNITION_THRESHOLD && - this.currentState === State.BEGAN + this.state === State.BEGAN ) { this.activate(); } @@ -40,14 +38,13 @@ export default class RotationGestureHandler extends GestureHandler { this.end(); }, }; - - private rotationGestureDetector: RotationGestureDetector = + private _rotationGestureDetector: RotationGestureDetector = new RotationGestureDetector(this.rotationGestureListener); public init(ref: number, propsRef: React.RefObject): void { super.init(ref, propsRef); - this.setShouldCancelWhenOutside(false); + this.shouldCancelWhenOutside = false; } public updateGestureConfig({ enabled = true, ...props }: Config): void { @@ -64,34 +61,34 @@ export default class RotationGestureHandler extends GestureHandler { } public getAnchorX(): number { - const anchorX = this.rotationGestureDetector.getAnchorX(); + const anchorX = this.rotationGestureDetector.anchorX; return anchorX ? anchorX : this.cachedAnchorX; } public getAnchorY(): number { - const anchorY = this.rotationGestureDetector.getAnchorY(); + const anchorY = this.rotationGestureDetector.anchorY; return anchorY ? anchorY : this.cachedAnchorY; } protected onPointerDown(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.tryToSendTouchEvent(event); } protected onPointerAdd(event: AdaptedEvent): void { - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerAdd(event); this.tryBegin(); - this.rotationGestureDetector.onTouchEvent(event, this.tracker); + this.rotationGestureDetector.onTouchEvent(event, this.pointerTracker); } protected onPointerMove(event: AdaptedEvent): void { - if (this.tracker.getTrackedPointersCount() < 2) { + if (this.pointerTracker.getTrackedPointersCount() < 2) { return; } @@ -102,15 +99,15 @@ export default class RotationGestureHandler extends GestureHandler { this.cachedAnchorY = this.getAnchorY(); } - this.tracker.track(event); + this.pointerTracker.track(event); - this.rotationGestureDetector.onTouchEvent(event, this.tracker); + this.rotationGestureDetector.onTouchEvent(event, this.pointerTracker); super.onPointerMove(event); } protected onPointerOutOfBounds(event: AdaptedEvent): void { - if (this.tracker.getTrackedPointersCount() < 2) { + if (this.pointerTracker.getTrackedPointersCount() < 2) { return; } @@ -121,23 +118,23 @@ export default class RotationGestureHandler extends GestureHandler { this.cachedAnchorY = this.getAnchorY(); } - this.tracker.track(event); + this.pointerTracker.track(event); - this.rotationGestureDetector.onTouchEvent(event, this.tracker); + this.rotationGestureDetector.onTouchEvent(event, this.pointerTracker); super.onPointerOutOfBounds(event); } protected onPointerUp(event: AdaptedEvent): void { super.onPointerUp(event); - this.tracker.removeFromTracker(event.pointerId); - this.rotationGestureDetector.onTouchEvent(event, this.tracker); + this.pointerTracker.removeFromTracker(event.pointerId); + this.rotationGestureDetector.onTouchEvent(event, this.pointerTracker); - if (this.currentState !== State.ACTIVE) { + if (this.state !== State.ACTIVE) { return; } - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { this.end(); } else { this.fail(); @@ -146,12 +143,12 @@ export default class RotationGestureHandler extends GestureHandler { protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.rotationGestureDetector.onTouchEvent(event, this.tracker); - this.tracker.removeFromTracker(event.pointerId); + this.rotationGestureDetector.onTouchEvent(event, this.pointerTracker); + this.pointerTracker.removeFromTracker(event.pointerId); } protected tryBegin(): void { - if (this.currentState !== State.UNDETERMINED) { + if (this.state !== State.UNDETERMINED) { return; } @@ -163,7 +160,7 @@ export default class RotationGestureHandler extends GestureHandler { } protected onReset(): void { - if (this.currentState === State.ACTIVE) { + if (this.state === State.ACTIVE) { return; } @@ -171,4 +168,46 @@ export default class RotationGestureHandler extends GestureHandler { this.velocity = 0; this.rotationGestureDetector.reset(); } + + public get rotation() { + return this._rotation; + } + public set rotation(angle: number) { + this._rotation = angle; + } + + public get velocity() { + return this._velocity; + } + public set velocity(value: number) { + this._velocity = value; + } + + public get cachedAnchorX() { + return this._cachedAnchorX; + } + public set cachedAnchorX(value: number) { + this._cachedAnchorX = value; + } + + public get cachedAnchorY() { + return this._cachedAnchorY; + } + public set cachedAnchorY(value: number) { + this._cachedAnchorY = value; + } + + public get rotationGestureListener(): RotationGestureListener { + return this._rotationGestureListener; + } + public set rotationGestureListener(listener: RotationGestureListener) { + this._rotationGestureListener = listener; + } + + public get rotationGestureDetector(): RotationGestureDetector { + return this._rotationGestureDetector; + } + public set rotationGestureDetector(detector: RotationGestureDetector) { + this._rotationGestureDetector = detector; + } } diff --git a/src/web/handlers/TapGestureHandler.ts b/src/web/handlers/TapGestureHandler.ts index cc1f98478d..f7699075fa 100644 --- a/src/web/handlers/TapGestureHandler.ts +++ b/src/web/handlers/TapGestureHandler.ts @@ -9,27 +9,23 @@ const DEFAULT_NUMBER_OF_TAPS = 1; const DEFAULT_MIN_NUMBER_OF_POINTERS = 1; export default class TapGestureHandler extends GestureHandler { - private maxDeltaX = Number.MIN_SAFE_INTEGER; - private maxDeltaY = Number.MIN_SAFE_INTEGER; - private maxDistSq = Number.MIN_SAFE_INTEGER; - private maxDurationMs = DEFAULT_MAX_DURATION_MS; - private maxDelayMs = DEFAULT_MAX_DELAY_MS; - - private numberOfTaps = DEFAULT_NUMBER_OF_TAPS; - private minNumberOfPointers = DEFAULT_MIN_NUMBER_OF_POINTERS; - private currentMaxNumberOfPointers = 1; - - private startX = 0; - private startY = 0; - private offsetX = 0; - private offsetY = 0; - private lastX = 0; - private lastY = 0; - - private waitTimeout: number | undefined; - private delayTimeout: number | undefined; - - private tapsSoFar = 0; + private _maxDeltaX = Number.MIN_SAFE_INTEGER; + private _maxDeltaY = Number.MIN_SAFE_INTEGER; + private _maxDistSq = Number.MIN_SAFE_INTEGER; + private _maxDurationMs = DEFAULT_MAX_DURATION_MS; + private _maxDelayMs = DEFAULT_MAX_DELAY_MS; + private _numberOfTaps = DEFAULT_NUMBER_OF_TAPS; + private _minNumberOfPointers = DEFAULT_MIN_NUMBER_OF_POINTERS; + private _currentMaxNumberOfPointers = 1; + private _startX = 0; + private _startY = 0; + private _offsetX = 0; + private _offsetY = 0; + private _lastX = 0; + private _lastY = 0; + private _waitTimeout: number | undefined; + private _delayTimeout: number | undefined; + private _tapsSoFar = 0; public init(ref: number, propsRef: React.RefObject): void { super.init(ref, propsRef); @@ -109,7 +105,7 @@ export default class TapGestureHandler extends GestureHandler { return; } - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); super.onPointerDown(event); this.trySettingPosition(event); @@ -127,13 +123,13 @@ export default class TapGestureHandler extends GestureHandler { protected onPointerAdd(event: AdaptedEvent): void { super.onPointerAdd(event); - this.tracker.addToTracker(event); + this.pointerTracker.addToTracker(event); this.trySettingPosition(event); this.offsetX += this.lastX - this.startX; this.offsetY += this.lastY - this.startY; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -146,23 +142,23 @@ export default class TapGestureHandler extends GestureHandler { protected onPointerUp(event: AdaptedEvent): void { super.onPointerUp(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); this.updateState(event); } protected onPointerRemove(event: AdaptedEvent): void { super.onPointerRemove(event); - this.tracker.removeFromTracker(event.pointerId); + this.pointerTracker.removeFromTracker(event.pointerId); this.offsetX += this.lastX - this.startX; this.offsetY += this.lastY = this.startY; - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -174,9 +170,9 @@ export default class TapGestureHandler extends GestureHandler { protected onPointerMove(event: AdaptedEvent): void { this.trySettingPosition(event); - this.tracker.track(event); + this.pointerTracker.track(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -187,9 +183,9 @@ export default class TapGestureHandler extends GestureHandler { protected onPointerOutOfBounds(event: AdaptedEvent): void { this.trySettingPosition(event); - this.tracker.track(event); + this.pointerTracker.track(event); - const lastCoords = this.tracker.getAbsoluteCoordsAverage(); + const lastCoords = this.pointerTracker.getAbsoluteCoordsAverage(); this.lastX = lastCoords.x; this.lastY = lastCoords.y; @@ -200,9 +196,11 @@ export default class TapGestureHandler extends GestureHandler { private updateState(event: AdaptedEvent): void { if ( - this.currentMaxNumberOfPointers < this.tracker.getTrackedPointersCount() + this.currentMaxNumberOfPointers < + this.pointerTracker.getTrackedPointersCount() ) { - this.currentMaxNumberOfPointers = this.tracker.getTrackedPointersCount(); + this.currentMaxNumberOfPointers = + this.pointerTracker.getTrackedPointersCount(); } if (this.shouldFail()) { @@ -210,7 +208,7 @@ export default class TapGestureHandler extends GestureHandler { return; } - switch (this.currentState) { + switch (this.state) { case State.UNDETERMINED: if (event.eventType === EventTypes.DOWN) { this.begin(); @@ -231,7 +229,7 @@ export default class TapGestureHandler extends GestureHandler { } private trySettingPosition(event: AdaptedEvent): void { - if (this.currentState !== State.UNDETERMINED) { + if (this.state !== State.UNDETERMINED) { return; } @@ -282,4 +280,123 @@ export default class TapGestureHandler extends GestureHandler { this.tapsSoFar = 0; this.currentMaxNumberOfPointers = 0; } + + public get maxDeltaX() { + return this._maxDeltaX; + } + public set maxDeltaX(value: number) { + this._maxDeltaX = value; + } + + public get maxDeltaY() { + return this._maxDeltaY; + } + public set maxDeltaY(value: number) { + this._maxDeltaY = value; + } + + public get maxDistSq() { + return this._maxDistSq; + } + public set maxDistSq(value: number) { + this._maxDistSq = value; + } + + public get maxDurationMs() { + return this._maxDurationMs; + } + public set maxDurationMs(value: number) { + this._maxDurationMs = value; + } + + public get maxDelayMs() { + return this._maxDelayMs; + } + public set maxDelayMs(value: number) { + this._maxDelayMs = value; + } + + public get numberOfTaps() { + return this._numberOfTaps; + } + public set numberOfTaps(value: number) { + this._numberOfTaps = value; + } + + public get minNumberOfPointers() { + return this._minNumberOfPointers; + } + public set minNumberOfPointers(value: number) { + this._minNumberOfPointers = value; + } + + public get currentMaxNumberOfPointers() { + return this._currentMaxNumberOfPointers; + } + public set currentMaxNumberOfPointers(value: number) { + this._currentMaxNumberOfPointers = value; + } + + public get startX() { + return this._startX; + } + public set startX(value: number) { + this._startX = value; + } + + public get startY() { + return this._startY; + } + public set startY(value: number) { + this._startY = value; + } + + public get offsetX() { + return this._offsetX; + } + public set offsetX(value: number) { + this._offsetX = value; + } + + public get offsetY() { + return this._offsetY; + } + public set offsetY(value: number) { + this._offsetY = value; + } + + public get lastX() { + return this._lastX; + } + public set lastX(value: number) { + this._lastX = value; + } + + public get lastY() { + return this._lastY; + } + public set lastY(value: number) { + this._lastY = value; + } + + public get waitTimeout() { + return this._waitTimeout; + } + public set waitTimeout(value: number | undefined) { + this._waitTimeout = value; + } + + public get delayTimeout() { + return this._delayTimeout; + } + public set delayTimeout(value: number | undefined) { + this._delayTimeout = value; + } + + public get tapsSoFar() { + return this._tapsSoFar; + } + public set tapsSoFar(value: number) { + this._tapsSoFar = value; + } } diff --git a/src/web/tools/GestureHandlerOrchestrator.ts b/src/web/tools/GestureHandlerOrchestrator.ts index 18ef4e83d1..74b5ee91fb 100644 --- a/src/web/tools/GestureHandlerOrchestrator.ts +++ b/src/web/tools/GestureHandlerOrchestrator.ts @@ -26,9 +26,9 @@ export default class GestureHandlerOrchestrator { private cleanHandler(handler: IGestureHandler): void { handler.reset(); - handler.setActive(false); - handler.setAwaiting(false); - handler.setActivationIndex(Number.MAX_VALUE); + handler.active = false; + handler.awaiting = false; + handler.activationIndex = Number.MAX_VALUE; } public removeHandlerFromOrchestrator(handler: IGestureHandler): void { @@ -41,7 +41,7 @@ export default class GestureHandlerOrchestrator { if (indexInAwaitingHandlers >= 0) { this.awaitingHandlers.splice(indexInAwaitingHandlers, 1); - this.awaitingHandlersTags.delete(handler.getTag()); + this.awaitingHandlersTags.delete(handler.handlerTag); } } @@ -51,7 +51,7 @@ export default class GestureHandlerOrchestrator { for (let i = this.gestureHandlers.length - 1; i >= 0; --i) { const handler = this.gestureHandlers[i]; - if (this.isFinished(handler.getState()) && !handler.isAwaiting()) { + if (this.isFinished(handler.state) && !handler.awaiting) { this.cleanHandler(handler); handlersToRemove.add(handler); } @@ -65,7 +65,7 @@ export default class GestureHandlerOrchestrator { private hasOtherHandlerToWaitFor(handler: IGestureHandler): boolean { const hasToWaitFor = (otherHandler: IGestureHandler) => { return ( - !this.isFinished(otherHandler.getState()) && + !this.isFinished(otherHandler.state) && this.shouldHandlerWaitForOther(handler, otherHandler) ); }; @@ -79,7 +79,7 @@ export default class GestureHandlerOrchestrator { const shouldBeCancelled = (otherHandler: IGestureHandler) => { return ( this.shouldHandlerWaitForOther(handler, otherHandler) && - otherHandler.getState() === State.END + otherHandler.state === State.END ); }; @@ -97,7 +97,7 @@ export default class GestureHandlerOrchestrator { return; } - const handlerState = handler.getState(); + const handlerState = handler.state; if (handlerState === State.CANCELLED || handlerState === State.FAILED) { return; @@ -129,7 +129,7 @@ export default class GestureHandlerOrchestrator { private cleanupAwaitingHandlers(handler: IGestureHandler): void { const shouldWait = (otherHandler: IGestureHandler) => { return ( - !otherHandler.isAwaiting() && + !otherHandler.awaiting && this.shouldHandlerWaitForOther(otherHandler, handler) ); }; @@ -137,12 +137,12 @@ export default class GestureHandlerOrchestrator { for (const otherHandler of this.awaitingHandlers) { if (shouldWait(otherHandler)) { this.cleanHandler(otherHandler); - this.awaitingHandlersTags.delete(otherHandler.getTag()); + this.awaitingHandlersTags.delete(otherHandler.handlerTag); } } this.awaitingHandlers = this.awaitingHandlers.filter((otherHandler) => - this.awaitingHandlersTags.has(otherHandler.getTag()) + this.awaitingHandlersTags.has(otherHandler.handlerTag) ); } @@ -152,7 +152,7 @@ export default class GestureHandlerOrchestrator { oldState: State, sendIfDisabled?: boolean ): void { - if (!handler.isEnabled() && !sendIfDisabled) { + if (!handler.enabled && !sendIfDisabled) { return; } @@ -162,7 +162,7 @@ export default class GestureHandlerOrchestrator { for (const otherHandler of this.awaitingHandlers) { if ( !this.shouldHandlerWaitForOther(otherHandler, handler) || - !this.awaitingHandlersTags.has(otherHandler.getTag()) + !this.awaitingHandlersTags.has(otherHandler.handlerTag) ) { continue; } @@ -174,7 +174,7 @@ export default class GestureHandlerOrchestrator { otherHandler.cancel(); - if (otherHandler.getState() === State.END) { + if (otherHandler.state === 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. @@ -182,14 +182,14 @@ export default class GestureHandlerOrchestrator { otherHandler.sendEvent(State.CANCELLED, State.BEGAN); } - otherHandler.setAwaiting(false); + otherHandler.awaiting = false; } } if (newState === State.ACTIVE) { this.tryActivate(handler); } else if (oldState === State.ACTIVE || oldState === State.END) { - if (handler.isActive()) { + if (handler.active) { handler.sendEvent(newState, oldState); } else if ( oldState === State.ACTIVE && @@ -214,11 +214,11 @@ export default class GestureHandlerOrchestrator { } private makeActive(handler: IGestureHandler): void { - const currentState = handler.getState(); + const currentState = handler.state; - handler.setActive(true); - handler.setShouldResetProgress(true); - handler.setActivationIndex(this.activationIndex++); + handler.active = true; + handler.shouldResetProgress = true; + handler.activationIndex = this.activationIndex++; for (let i = this.gestureHandlers.length - 1; i >= 0; --i) { if (this.shouldHandlerBeCancelledBy(this.gestureHandlers[i], handler)) { @@ -228,7 +228,7 @@ export default class GestureHandlerOrchestrator { for (const otherHandler of this.awaitingHandlers) { if (this.shouldHandlerBeCancelledBy(otherHandler, handler)) { - otherHandler.setAwaiting(false); + otherHandler.awaiting = false; } } @@ -241,11 +241,11 @@ export default class GestureHandlerOrchestrator { } } - if (!handler.isAwaiting()) { + if (!handler.awaiting) { return; } - handler.setAwaiting(false); + handler.awaiting = false; this.awaitingHandlers = this.awaitingHandlers.filter( (otherHandler) => otherHandler !== handler @@ -258,10 +258,10 @@ export default class GestureHandlerOrchestrator { } this.awaitingHandlers.push(handler); - this.awaitingHandlersTags.add(handler.getTag()); + this.awaitingHandlersTags.add(handler.handlerTag); - handler.setAwaiting(true); - handler.setActivationIndex(this.activationIndex++); + handler.awaiting = true; + handler.activationIndex = this.activationIndex++; } public recordHandlerIfNotPresent(handler: IGestureHandler): void { @@ -271,9 +271,9 @@ export default class GestureHandlerOrchestrator { this.gestureHandlers.push(handler); - handler.setActive(false); - handler.setAwaiting(false); - handler.setActivationIndex(Number.MAX_SAFE_INTEGER); + handler.active = false; + handler.awaiting = false; + handler.activationIndex = Number.MAX_SAFE_INTEGER; } private shouldHandlerWaitForOther( @@ -306,7 +306,7 @@ export default class GestureHandlerOrchestrator { return false; } - if (handler.isAwaiting() || handler.getState() === State.ACTIVE) { + if (handler.awaiting || handler.state === State.ACTIVE) { // For now it always returns false return handler.shouldBeCancelledByOther(otherHandler); } @@ -316,7 +316,7 @@ export default class GestureHandlerOrchestrator { if ( !PointerTracker.shareCommonPointers(handlerPointers, otherPointers) && - handler.getDelegate().getView() !== otherHandler.getDelegate().getView() + handler.delegate.getView() !== otherHandler.delegate.getView() ) { return this.checkOverlap(handler, otherHandler); } @@ -335,11 +335,11 @@ export default class GestureHandlerOrchestrator { // TODO: Find better way to handle that issue, for example by activation order and handler cancelling const isPointerWithinBothBounds = (pointer: number) => { - const point = handler.getTracker().getLastAbsoluteCoords(pointer); + const point = handler.pointerTracker.getLastAbsoluteCoords(pointer); return ( - handler.getDelegate().isPointerInBounds(point) && - otherHandler.getDelegate().isPointerInBounds(point) + handler.delegate.isPointerInBounds(point) && + otherHandler.delegate.isPointerInBounds(point) ); }; @@ -361,8 +361,8 @@ export default class GestureHandlerOrchestrator { public cancelMouseAndPenGestures(currentHandler: IGestureHandler): void { this.gestureHandlers.forEach((handler: IGestureHandler) => { if ( - handler.getPointerType() !== PointerType.MOUSE && - handler.getPointerType() !== PointerType.STYLUS + handler.pointerType !== PointerType.MOUSE && + handler.pointerType !== PointerType.STYLUS ) { return; } @@ -377,7 +377,7 @@ export default class GestureHandlerOrchestrator { // // 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(); + handler.pointerTracker.resetTracker(); } }); } diff --git a/src/web/tools/GestureHandlerWebDelegate.ts b/src/web/tools/GestureHandlerWebDelegate.ts index 32fb2591a7..38135918a1 100644 --- a/src/web/tools/GestureHandlerWebDelegate.ts +++ b/src/web/tools/GestureHandlerWebDelegate.ts @@ -37,7 +37,7 @@ export class GestureHandlerWebDelegate init(viewRef: number, handler: IGestureHandler): void { if (!viewRef) { throw new Error( - `Cannot find HTML Element for handler ${handler.getTag()}` + `Cannot find HTML Element for handler ${handler.handlerTag}` ); } @@ -51,7 +51,7 @@ export class GestureHandlerWebDelegate touchAction: this.view.style.touchAction, }; - const config = handler.getConfig(); + const config = handler.config; this.setUserSelect(config.enabled); this.setTouchAction(config.enabled); @@ -88,12 +88,12 @@ export class GestureHandlerWebDelegate } tryResetCursor() { - const config = this.gestureHandler.getConfig(); + const config = this.gestureHandler.config; if ( config.activeCursor && config.activeCursor !== 'auto' && - this.gestureHandler.getState() === State.ACTIVE + this.gestureHandler.state === State.ACTIVE ) { this.view.style.cursor = 'auto'; } @@ -132,7 +132,7 @@ export class GestureHandlerWebDelegate } private setUserSelect(isHandlerEnabled: boolean) { - const { userSelect } = this.gestureHandler.getConfig(); + const { userSelect } = this.gestureHandler.config; this.view.style['userSelect'] = isHandlerEnabled ? userSelect ?? 'none' @@ -144,7 +144,7 @@ export class GestureHandlerWebDelegate } private setTouchAction(isHandlerEnabled: boolean) { - const { touchAction } = this.gestureHandler.getConfig(); + const { touchAction } = this.gestureHandler.config; this.view.style['touchAction'] = isHandlerEnabled ? touchAction ?? 'none' @@ -157,7 +157,7 @@ export class GestureHandlerWebDelegate } private setContextMenu(isHandlerEnabled: boolean) { - const config = this.gestureHandler.getConfig(); + const config = this.gestureHandler.config; if (isHandlerEnabled) { this.addContextMenuListeners(config); @@ -181,7 +181,7 @@ export class GestureHandlerWebDelegate } onActivate(): void { - const config = this.gestureHandler.getConfig(); + const config = this.gestureHandler.config; if ( (!this.view.style.cursor || this.view.style.cursor === 'auto') && diff --git a/src/web/tools/InteractionManager.ts b/src/web/tools/InteractionManager.ts index 6b65c3a7b6..aa178df588 100644 --- a/src/web/tools/InteractionManager.ts +++ b/src/web/tools/InteractionManager.ts @@ -13,7 +13,7 @@ export default class InteractionManager { private constructor() {} public configureInteractions(handler: IGestureHandler, config: Config) { - this.dropRelationsForHandlerWithTag(handler.getTag()); + this.dropRelationsForHandlerWithTag(handler.handlerTag); if (config.waitFor) { const waitFor: number[] = []; @@ -27,7 +27,7 @@ export default class InteractionManager { } }); - this.waitForRelations.set(handler.getTag(), waitFor); + this.waitForRelations.set(handler.handlerTag, waitFor); } if (config.simultaneousHandlers) { @@ -40,7 +40,7 @@ export default class InteractionManager { } }); - this.simultaneousRelations.set(handler.getTag(), simultaneousHandlers); + this.simultaneousRelations.set(handler.handlerTag, simultaneousHandlers); } if (config.blocksHandlers) { @@ -53,7 +53,7 @@ export default class InteractionManager { } }); - this.blocksHandlersRelations.set(handler.getTag(), blocksHandlers); + this.blocksHandlersRelations.set(handler.handlerTag, blocksHandlers); } } @@ -62,12 +62,12 @@ export default class InteractionManager { otherHandler: IGestureHandler ): boolean { const waitFor: number[] | undefined = this.waitForRelations.get( - handler.getTag() + handler.handlerTag ); return ( - waitFor?.find((tag: number) => { - return tag === otherHandler.getTag(); + waitFor?.find((handlerTag: number) => { + return handlerTag === otherHandler.handlerTag; }) !== undefined ); } @@ -77,11 +77,11 @@ export default class InteractionManager { otherHandler: IGestureHandler ): boolean { const simultaneousHandlers: number[] | undefined = - this.simultaneousRelations.get(handler.getTag()); + this.simultaneousRelations.get(handler.handlerTag); return ( - simultaneousHandlers?.find((tag: number) => { - return tag === otherHandler.getTag(); + simultaneousHandlers?.find((handlerTag: number) => { + return handlerTag === otherHandler.handlerTag; }) !== undefined ); } @@ -91,12 +91,12 @@ export default class InteractionManager { otherHandler: IGestureHandler ): boolean { const waitFor: number[] | undefined = this.blocksHandlersRelations.get( - handler.getTag() + handler.handlerTag ); return ( - waitFor?.find((tag: number) => { - return tag === otherHandler.getTag(); + waitFor?.find((handlerTag: number) => { + return handlerTag === otherHandler.handlerTag; }) !== undefined ); } @@ -108,7 +108,7 @@ export default class InteractionManager { // 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 isActive = otherHandler.state === State.ACTIVE; const isButton = otherHandler.isButton?.() === true; return isNativeHandler && isActive && !isButton; diff --git a/src/web/tools/NodeManager.ts b/src/web/tools/NodeManager.ts index 43aa80ea70..04bedaa895 100644 --- a/src/web/tools/NodeManager.ts +++ b/src/web/tools/NodeManager.ts @@ -28,7 +28,7 @@ export default abstract class NodeManager { } this.gestures[handlerTag] = handler; - this.gestures[handlerTag].setTag(handlerTag); + this.gestures[handlerTag].handlerTag = handlerTag; } public static dropGestureHandler(handlerTag: number): void {