@ue-too/board / index / VanillaTouchEventParser

類別: VanillaTouchEventParser

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:84

DOM event parser for touch input.

備註

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.

範例

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();

實作

• TouchEventParser

建構函式

建構函式

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

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:96

參數

touchInputStateMachine

TouchInputStateMachine

orchestrator

InputOrchestrator

canvas?

HTMLCanvasElement | SVGSVGElement

回傳

VanillaTouchEventParser

存取器

disabled

Getter 簽章

get disabled(): boolean

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:164

Whether all touch input is disabled

回傳

boolean

Whether all touch input is disabled

實作了

TouchEventParser.disabled

---

orchestrator

Getter 簽章

get orchestrator(): InputOrchestrator

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:110

回傳

InputOrchestrator

方法

attach()

attach(canvas): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:252

Attaches to a new canvas element

參數

canvas

HTMLCanvasElement

回傳

void

實作了

TouchEventParser.attach

---

bindListeners()

bindListeners(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:114

回傳

void

---

disable()

disable(): void

定義於: 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

回傳

void

實作了

TouchEventParser.disable

---

disableStrategy()

disableStrategy(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:125

回傳

void

---

enable()

enable(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:172

Enables the parser

回傳

void

實作了

TouchEventParser.enable

---

enableStrategy()

enableStrategy(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:121

回傳

void

---

setUp()

setUp(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:129

Initializes event listeners

回傳

void

實作了

TouchEventParser.setUp

---

tearDown()

tearDown(): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:158

Removes event listeners and cleans up

回傳

void

實作了

TouchEventParser.tearDown

---

touchcancelHandler()

touchcancelHandler(e): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:206

參數

e

TouchEvent

回傳

void

---

touchendHandler()

touchendHandler(e): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:221

參數

e

TouchEvent

回傳

void

---

touchmoveHandler()

touchmoveHandler(e): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:236

參數

e

TouchEvent

回傳

void

---

touchstartHandler()

touchstartHandler(e): void

定義於: packages/board/src/input-interpretation/raw-input-parser/vanilla-touch-event-parser.ts:189

參數

e

TouchEvent

回傳

void