Skip to content

Commit

Permalink
PointerTracker refactor. (#2931)
Browse files Browse the repository at this point in the history 
## Description

Fixing #2929 required adding additional information to `TrackerElement`. If we were to leave current structure of `PointerTracker`, we would have to add few more methods. After refactoring, there are only 2 that were not present before:

- `getLastViewRelativeCoords`
- `getViewRelativeCoordsSum`

I'd like to make similar changes to our handlers in the future (i.e. use `coords` object instead of `lastX` and `lastY` variables).

## Test plan

Tested on example app.
  • Loading branch information
@m-bert
m-bert authored Jun 4, 2024
1 parent 4def677 commit dd4d40f
Show file tree
Hide file tree
Showing 9 changed files with 158 additions and 159 deletions.
14 changes: 6 additions & 8 deletions src/web/detectors/RotationGestureDetector.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,16 +39,14 @@ export default class RotationGestureDetector

const [firstPointerID, secondPointerID] = this.keyPointers;

const firstPointerX: number = tracker.getLastX(firstPointerID);
const firstPointerY: number = tracker.getLastY(firstPointerID);
const secondPointerX: number = tracker.getLastX(secondPointerID);
const secondPointerY: number = tracker.getLastY(secondPointerID);
const firstPointerCoords = tracker.getLastAbsoluteCoords(firstPointerID);
const secondPointerCoords = tracker.getLastAbsoluteCoords(secondPointerID);

const vectorX: number = secondPointerX - firstPointerX;
const vectorY: number = secondPointerY - firstPointerY;
const vectorX: number = secondPointerCoords.x - firstPointerCoords.x;
const vectorY: number = secondPointerCoords.y - firstPointerCoords.y;

this.anchorX = (firstPointerX + secondPointerX) / 2;
this.anchorY = (firstPointerY + secondPointerY) / 2;
this.anchorX = (firstPointerCoords.x + secondPointerCoords.x) / 2;
this.anchorY = (firstPointerCoords.y + secondPointerCoords.y) / 2;

//Angle diff should be positive when rotating in clockwise direction
const angle: number = -Math.atan2(vectorY, vectorX);
Expand Down
11 changes: 5 additions & 6 deletions src/web/detectors/ScaleGestureDetector.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,11 +76,10 @@ export default class ScaleGestureDetector implements ScaleGestureListener {

const div: number = pointerUp ? numOfPointers - 1 : numOfPointers;

const sumX = tracker.getSumX(ignoredPointer);
const sumY = tracker.getSumY(ignoredPointer);
const coordsSum = tracker.getAbsoluteCoordsSum();

const focusX = sumX / div;
const focusY = sumY / div;
const focusX = coordsSum.x / div;
const focusY = coordsSum.y / div;

//Determine average deviation from focal point

Expand All @@ -92,8 +91,8 @@ export default class ScaleGestureDetector implements ScaleGestureListener {
return;
}

devSumX += Math.abs(value.lastX - focusX);
devSumY += Math.abs(value.lastY - focusY);
devSumX += Math.abs(value.abosoluteCoords.x - focusX);
devSumY += Math.abs(value.abosoluteCoords.y - focusY);
});

const devX: number = devSumX / div;
Expand Down
53 changes: 27 additions & 26 deletions src/web/handlers/GestureHandler.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -405,10 +405,9 @@ export default abstract class GestureHandler implements IGestureHandler {
nativeEvent: {
numberOfPointers: this.tracker.getTrackedPointersCount(),
state: newState,
pointerInside: this.delegate.isPointerInBounds({
x: this.tracker.getLastAvgX(),
y: this.tracker.getLastAvgY(),
}),
pointerInside: this.delegate.isPointerInBounds(
this.tracker.getAbsoluteCoordsAverage()
),
...this.transformNativeEvent(),
handlerTag: this.handlerTag,
target: this.viewRef,
Expand Down Expand Up @@ -442,10 +441,10 @@ export default abstract class GestureHandler implements IGestureHandler {

all.push({
id: id,
x: element.lastX - rect.pageX,
y: element.lastY - rect.pageY,
absoluteX: element.lastX,
absoluteY: element.lastY,
x: element.abosoluteCoords.x - rect.pageX,
y: element.abosoluteCoords.y - rect.pageY,
absoluteX: element.abosoluteCoords.x,
absoluteY: element.abosoluteCoords.y,
});
});

Expand All @@ -465,10 +464,10 @@ export default abstract class GestureHandler implements IGestureHandler {

changed.push({
id: id,
x: element.lastX - rect.pageX,
y: element.lastY - rect.pageY,
absoluteX: element.lastX,
absoluteY: element.lastY,
x: element.abosoluteCoords.x - rect.pageX,
y: element.abosoluteCoords.y - rect.pageY,
absoluteX: element.abosoluteCoords.x,
absoluteY: element.abosoluteCoords.y,
});
});
}
Expand Down Expand Up @@ -534,18 +533,18 @@ export default abstract class GestureHandler implements IGestureHandler {

all.push({
id: id,
x: element.lastX - rect.pageX,
y: element.lastY - rect.pageY,
absoluteX: element.lastX,
absoluteY: element.lastY,
x: element.abosoluteCoords.x - rect.pageX,
y: element.abosoluteCoords.y - rect.pageY,
absoluteX: element.abosoluteCoords.x,
absoluteY: element.abosoluteCoords.y,
});

changed.push({
id: id,
x: element.lastX - rect.pageX,
y: element.lastY - rect.pageY,
absoluteX: element.lastX,
absoluteY: element.lastY,
x: element.abosoluteCoords.x - rect.pageX,
y: element.abosoluteCoords.y - rect.pageY,
absoluteX: element.abosoluteCoords.x,
absoluteY: element.abosoluteCoords.y,
});
});

Expand All @@ -570,12 +569,13 @@ export default abstract class GestureHandler implements IGestureHandler {
protected transformNativeEvent(): Record<string, unknown> {
// those properties are shared by most handlers and if not this method will be overriden
const rect = this.delegate.measureView();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();

return {
x: this.tracker.getLastAvgX() - rect.pageX,
y: this.tracker.getLastAvgY() - rect.pageY,
absoluteX: this.tracker.getLastAvgX(),
absoluteY: this.tracker.getLastAvgY(),
x: lastCoords.x - rect.pageX,
y: lastCoords.y - rect.pageY,
absoluteX: lastCoords.x,
absoluteY: lastCoords.y,
};
}

Expand Down Expand Up @@ -720,8 +720,9 @@ export default abstract class GestureHandler implements IGestureHandler {
}

const rect = this.delegate.measureView();
const offsetX: number = this.tracker.getLastX() - rect.pageX;
const offsetY: number = this.tracker.getLastY() - rect.pageY;
const { x, y } = this.tracker.getLastAbsoluteCoords();
const offsetX: number = x - rect.pageX;
const offsetY: number = y - rect.pageY;

if (
offsetX >= left &&
Expand Down
10 changes: 6 additions & 4 deletions src/web/handlers/NativeViewGestureHandler.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,8 +64,9 @@ export default class NativeViewGestureHandler extends GestureHandler {
}

private newPointerAction(): void {
this.startX = this.tracker.getLastAvgX();
this.startY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.startX = lastCoords.x;
this.startY = lastCoords.y;

if (this.currentState !== State.UNDETERMINED) {
return;
Expand All @@ -80,8 +81,9 @@ export default class NativeViewGestureHandler extends GestureHandler {
protected onPointerMove(event: AdaptedEvent): void {
this.tracker.track(event);

const dx = this.startX - this.tracker.getLastAvgX();
const dy = this.startY - this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
const dx = this.startX - lastCoords.x;
const dy = this.startY - lastCoords.y;
const distSq = dx * dx + dy * dy;

if (distSq >= this.minDistSq) {
Expand Down
47 changes: 29 additions & 18 deletions src/web/handlers/PanGestureHandler.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -219,8 +219,9 @@ export default class PanGestureHandler extends GestureHandler {
this.tracker.addToTracker(event);
super.onPointerDown(event);

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.startX = this.lastX;
this.startY = this.lastY;
Expand All @@ -239,8 +240,9 @@ export default class PanGestureHandler extends GestureHandler {
this.offsetX += this.lastX - this.startX;
this.offsetY += this.lastY - this.startY;

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.startX = this.lastX;
this.startY = this.lastY;
Expand All @@ -259,8 +261,9 @@ export default class PanGestureHandler extends GestureHandler {
protected onPointerUp(event: AdaptedEvent): void {
super.onPointerUp(event);
if (this.currentState === State.ACTIVE) {
this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;
}

this.tracker.removeFromTracker(event.pointerId);
Expand All @@ -280,8 +283,9 @@ export default class PanGestureHandler extends GestureHandler {
this.offsetX += this.lastX - this.startX;
this.offsetY += this.lastY - this.startY;

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.startX = this.lastX;
this.startY = this.lastY;
Expand All @@ -299,10 +303,13 @@ export default class PanGestureHandler extends GestureHandler {
protected onPointerMove(event: AdaptedEvent): void {
this.tracker.track(event);

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
this.velocityX = this.tracker.getVelocityX(event.pointerId);
this.velocityY = this.tracker.getVelocityY(event.pointerId);
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

const velocity = this.tracker.getVelocity(event.pointerId);
this.velocityX = velocity.x;
this.velocityY = velocity.y;

this.checkBegan();

Expand All @@ -316,10 +323,13 @@ export default class PanGestureHandler extends GestureHandler {

this.tracker.track(event);

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
this.velocityX = this.tracker.getVelocityX(event.pointerId);
this.velocityY = this.tracker.getVelocityY(event.pointerId);
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

const velocity = this.tracker.getVelocity(event.pointerId);
this.velocityX = velocity.x;
this.velocityY = velocity.y;

this.checkBegan();

Expand Down Expand Up @@ -453,8 +463,9 @@ export default class PanGestureHandler extends GestureHandler {
}, this.activateAfterLongPress);
}
} else {
this.velocityX = this.tracker.getVelocityX(event.pointerId);
this.velocityY = this.tracker.getVelocityY(event.pointerId);
const velocity = this.tracker.getVelocity(event.pointerId);
this.velocityX = velocity.x;
this.velocityY = velocity.y;
}
}

Expand Down
30 changes: 18 additions & 12 deletions src/web/handlers/TapGestureHandler.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -133,19 +133,22 @@ export default class TapGestureHandler extends GestureHandler {
this.offsetX += this.lastX - this.startX;
this.offsetY += this.lastY - this.startY;

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.startX = this.tracker.getLastAvgX();
this.startY = this.tracker.getLastAvgY();
this.startX = lastCoords.x;
this.startY = lastCoords.y;

this.updateState(event);
}

protected onPointerUp(event: AdaptedEvent): void {
super.onPointerUp(event);
this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();

const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.tracker.removeFromTracker(event.pointerId);

Expand All @@ -159,8 +162,9 @@ export default class TapGestureHandler extends GestureHandler {
this.offsetX += this.lastX - this.startX;
this.offsetY += this.lastY = this.startY;

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.startX = this.lastX;
this.startY = this.lastY;
Expand All @@ -172,8 +176,9 @@ export default class TapGestureHandler extends GestureHandler {
this.trySettingPosition(event);
this.tracker.track(event);

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.updateState(event);

Expand All @@ -184,8 +189,9 @@ export default class TapGestureHandler extends GestureHandler {
this.trySettingPosition(event);
this.tracker.track(event);

this.lastX = this.tracker.getLastAvgX();
this.lastY = this.tracker.getLastAvgY();
const lastCoords = this.tracker.getAbsoluteCoordsAverage();
this.lastX = lastCoords.x;
this.lastY = lastCoords.y;

this.updateState(event);

Expand Down
8 changes: 1 addition & 7 deletions src/web/tools/GestureHandlerOrchestrator.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -335,13 +335,7 @@ 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 handlerX: number = handler.getTracker().getLastX(pointer);
const handlerY: number = handler.getTracker().getLastY(pointer);

const point = {
x: handlerX,
y: handlerY,
};
const point = handler.getTracker().getLastAbsoluteCoords(pointer);

return (
handler.getDelegate().isPointerInBounds(point) &&
Expand Down
Loading

0 comments on commit dd4d40f

Please sign in to comment.