@ue-too/board / index / VanillaTouchEventParser

クラス: VanillaTouchEventParser

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

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.

例

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:107

パラメータ

touchInputStateMachine

TouchInputStateMachine

orchestrator

InputOrchestrator

canvas?

HTMLCanvasElement | SVGSVGElement

戻り値

VanillaTouchEventParser

アクセッサー

disabled

署名を取得する

get disabled(): boolean

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

Whether all touch input is disabled

戻り値

boolean

Whether all touch input is disabled

の実装

TouchEventParser.disabled

---

orchestrator

署名を取得する

get orchestrator(): InputOrchestrator

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

戻り値

InputOrchestrator

---

stateMachine

署名を取得する

get stateMachine(): TouchInputStateMachine

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

The state machine this parser dispatches into, when the implementation exposes one. Optional so existing external parser implementations remain valid, but note this member is typed to the full TouchInputStateMachine — unlike KMTEventParser.stateMachine's minimal { happens } contract, an external implementation is more likely to need adjustment to satisfy this member's shape. Intended for tooling/introspection — dispatch through the parser, not through this reference.

戻り値

TouchInputStateMachine

The state machine this parser dispatches into, when the implementation exposes one. Optional so existing external parser implementations remain valid, but note this member is typed to the full TouchInputStateMachine — unlike KMTEventParser.stateMachine's minimal { happens } contract, an external implementation is more likely to need adjustment to satisfy this member's shape. Intended for tooling/introspection — dispatch through the parser, not through this reference.

の実装

TouchEventParser.stateMachine

メソッド

attach()

attach(canvas): void

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

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:129

戻り値

void

---

disable()

disable(): void

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

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:140

戻り値

void

---

enable()

enable(): void

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

Enables the parser

戻り値

void

の実装

TouchEventParser.enable

---

enableStrategy()

enableStrategy(): void

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

戻り値

void

---

setUp()

setUp(): void

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

Initializes event listeners

戻り値

void

の実装

TouchEventParser.setUp

---

tearDown()

tearDown(): void

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

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:221

パラメータ

e

TouchEvent

戻り値

void

---

touchendHandler()

touchendHandler(e): void

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

パラメータ

e

TouchEvent

戻り値

void

---

touchmoveHandler()

touchmoveHandler(e): void

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

パラメータ

e

TouchEvent

戻り値

void

---

touchstartHandler()

touchstartHandler(e): void

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

パラメータ

e

TouchEvent

戻り値

void