Adding changed points and coalescing to pointer tracker. Fixes #133. (#134)

* Adding changed points and coalescing to pointer tracker. Fixes #133.

* Nits and exposing native pointer
This commit is contained in:
Jake Archibald
2018-08-15 15:14:33 +01:00
committed by GitHub
parent 65c3ea826f
commit bff515b63f
2 changed files with 30 additions and 9 deletions

View File

@@ -12,8 +12,11 @@ export class Pointer {
clientY: number; clientY: number;
/** ID for this pointer */ /** ID for this pointer */
id: number = -1; id: number = -1;
/** The platform object used to create this Pointer */
nativePointer: Touch | PointerEvent | MouseEvent;
constructor (nativePointer: Touch | PointerEvent | MouseEvent) { constructor (nativePointer: Touch | PointerEvent | MouseEvent) {
this.nativePointer = nativePointer;
this.pageX = nativePointer.pageX; this.pageX = nativePointer.pageX;
this.pageY = nativePointer.pageY; this.pageY = nativePointer.pageY;
this.clientX = nativePointer.clientX; this.clientX = nativePointer.clientX;
@@ -25,6 +28,16 @@ export class Pointer {
this.id = nativePointer.pointerId; this.id = nativePointer.pointerId;
} }
} }
/**
* Returns an expanded set of Pointers for high-resolution inputs.
*/
getCoalesced(): Pointer[] {
if ('getCoalescedEvents' in this.nativePointer) {
return this.nativePointer.getCoalescedEvents().map(p => new Pointer(p));
}
return [this];
}
} }
const isPointerEvent = (event: any): event is PointerEvent => const isPointerEvent = (event: any): event is PointerEvent =>
@@ -33,9 +46,13 @@ const isPointerEvent = (event: any): event is PointerEvent =>
const noop = () => {}; const noop = () => {};
export type InputEvent = TouchEvent | PointerEvent | MouseEvent; export type InputEvent = TouchEvent | PointerEvent | MouseEvent;
type StartCallback = ((pointer: Pointer, event: InputEvent) => boolean); type StartCallback = (pointer: Pointer, event: InputEvent) => boolean;
type MoveCallback = ((previousPointers: Pointer[], event: InputEvent) => void); type MoveCallback = (
type EndCallback = ((pointer: Pointer, event: InputEvent) => void); previousPointers: Pointer[],
changedPointers: Pointer[],
event: InputEvent,
) => void;
type EndCallback = (pointer: Pointer, event: InputEvent) => void;
interface PointerTrackerCallbacks { interface PointerTrackerCallbacks {
/** /**
@@ -54,6 +71,7 @@ interface PointerTrackerCallbacks {
* @param previousPointers The state of the pointers before this event. * @param previousPointers The state of the pointers before this event.
* This contains the same number of pointers, in the same order, as * This contains the same number of pointers, in the same order, as
* this.currentPointers and this.startPointers. * this.currentPointers and this.startPointers.
* @param changedPointers The pointers that have changed since the last move callback.
* @param event The event related to the pointer changes. * @param event The event related to the pointer changes.
*/ */
move?: MoveCallback; move?: MoveCallback;
@@ -172,19 +190,18 @@ export class PointerTracker {
const changedPointers = ('changedTouches' in event) ? // Shortcut for 'is touch event'. const changedPointers = ('changedTouches' in event) ? // Shortcut for 'is touch event'.
Array.from(event.changedTouches).map(t => new Pointer(t)) : Array.from(event.changedTouches).map(t => new Pointer(t)) :
[new Pointer(event)]; [new Pointer(event)];
const trackedChangedPointers = [];
let shouldCallback = false;
for (const pointer of changedPointers) { for (const pointer of changedPointers) {
const index = this.currentPointers.findIndex(p => p.id === pointer.id); const index = this.currentPointers.findIndex(p => p.id === pointer.id);
if (index === -1) continue; if (index === -1) continue; // Not a pointer we're tracking
shouldCallback = true; trackedChangedPointers.push(pointer);
this.currentPointers[index] = pointer; this.currentPointers[index] = pointer;
} }
if (!shouldCallback) return; if (trackedChangedPointers.length === 0) return;
this._moveCallback(previousPointers, event); this._moveCallback(previousPointers, trackedChangedPointers, event);
} }
/** /**

View File

@@ -4,3 +4,7 @@ interface Window {
PointerEvent: typeof PointerEvent; PointerEvent: typeof PointerEvent;
Touch: typeof Touch; Touch: typeof Touch;
} }
interface PointerEvent {
getCoalescedEvents(): PointerEvent[];
}