uē-tôo

Appearance

@ue-too/board / VanillaTouchEventParser

Class: VanillaTouchEventParser ​

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:84

DOM event parser for touch input.

Remarks ​

This parser converts raw DOM TouchEvents into state machine events and coordinates with the orchestrator to process outputs. It serves as the entry point for all touch input in the input interpretation pipeline.

Event Flow:

DOM TouchEvents → Parser → State Machine → Parser → Orchestrator → Camera/Observers

Responsibilities:

  1. Listen for DOM touch events (touchstart/move/end/cancel)
  2. Extract touch point data (identifier, x, y)
  3. Convert to state machine event format
  4. Send events to the state machine
  5. Forward state machine outputs to the orchestrator

Touch Point Extraction:

  • touchstart/touchend: Uses changedTouches (only new/removed touches)
  • touchmove: Uses targetTouches (all touches on the canvas)

Gesture Control: Individual gesture types (pan, zoom, rotate) can be disabled independently, though currently the state machine outputs are filtered by the orchestrator rather than the parser.

The parser prevents default touch behavior to avoid browser scroll/zoom interfering with canvas gestures.

Example ​

typescript
const canvasElement = document.getElementById("canvas");
const stateMachine = createTouchInputStateMachine(context);
const orchestrator = new InputOrchestrator(cameraMux, cameraRig, publisher);
const parser = new VanillaTouchEventParser(stateMachine, orchestrator, canvasElement);

parser.setUp(); // Starts listening for touch events

// Disable zoom gestures temporarily
parser.zoomDisabled = true;

// Cleanup when done
parser.tearDown();

Implements ​

Constructors ​

Constructor ​

new VanillaTouchEventParser(touchInputStateMachine, orchestrator, canvas?): VanillaTouchEventParser

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:96

Parameters ​

touchInputStateMachine ​

TouchInputStateMachine

orchestrator ​

InputOrchestrator

canvas? ​

HTMLCanvasElement | SVGSVGElement

Returns ​

VanillaTouchEventParser

Accessors ​

disabled ​

Get Signature ​

get disabled(): boolean

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:164

Whether all touch input is disabled

Returns ​

boolean

Whether all touch input is disabled

Implementation of ​

TouchEventParser.disabled

orchestrator ​

Get Signature ​

get orchestrator(): InputOrchestrator

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:110

Returns ​

InputOrchestrator

Methods ​

attach() ​

attach(canvas): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:252

Attaches to a new canvas element

Parameters ​

canvas ​

HTMLCanvasElement

Returns ​

void

Implementation of ​

TouchEventParser.attach

bindListeners() ​

bindListeners(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:114

Returns ​

void

disable() ​

disable(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:168

Disables the parser; the event listeners are still attached just not processing any events

Returns ​

void

Implementation of ​

TouchEventParser.disable

disableStrategy() ​

disableStrategy(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:125

Returns ​

void

enable() ​

enable(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:172

Enables the parser

Returns ​

void

Implementation of ​

TouchEventParser.enable

enableStrategy() ​

enableStrategy(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:121

Returns ​

void

setUp() ​

setUp(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:129

Initializes event listeners

Returns ​

void

Implementation of ​

TouchEventParser.setUp

tearDown() ​

tearDown(): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:158

Removes event listeners and cleans up

Returns ​

void

Implementation of ​

TouchEventParser.tearDown

touchcancelHandler() ​

touchcancelHandler(e): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:206

Parameters ​

e ​

TouchEvent

Returns ​

void

touchendHandler() ​

touchendHandler(e): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:221

Parameters ​

e ​

TouchEvent

Returns ​

void

touchmoveHandler() ​

touchmoveHandler(e): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:236

Parameters ​

e ​

TouchEvent

Returns ​

void

touchstartHandler() ​

touchstartHandler(e): void

Defined in: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:189

Parameters ​

e ​

TouchEvent

Returns ​

void