From c426f95bee6422ed95ac671bed449b6524e826e5 Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Wed, 15 Apr 2026 11:36:26 +0900
Subject: [PATCH] wip

---
 packages/frontend/src/pages/room.vue          | 60 -------------------
 .../frontend/src/utility/room/controller.ts   | 22 ++++++-
 packages/frontend/src/utility/room/engine.ts  | 43 +++++++++++++
 3 files changed, 62 insertions(+), 63 deletions(-)

diff --git a/packages/frontend/src/pages/room.vue b/packages/frontend/src/pages/room.vue
index fa1fe592b5..f8f000b15b 100644
--- a/packages/frontend/src/pages/room.vue
+++ b/packages/frontend/src/pages/room.vue
@@ -166,66 +166,6 @@ const data = localStorage.getItem('roomData') != null ? { ...JSON.parse(localSto
 
 const controller = new RoomController(data);
 
-function onKeydown(ev: KeyboardEvent) {
-	if (ev.code === 'KeyE') {
-		ev.preventDefault();
-		ev.stopPropagation();
-		if (controller.isEditMode.value) {
-			if (controller.grabbing.value) {
-				endGrabbing();
-			} else {
-				beginSelectedInstalledObjectGrabbing();
-			}
-		} else if (controller.selected.value != null) {
-			controller.interact(controller.selected.value.objectId);
-		}
-	} else if (ev.code === 'KeyR') {
-		ev.preventDefault();
-		ev.stopPropagation();
-		if (controller.grabbing.value) {
-			rotate();
-		}
-	} else if (ev.code === 'KeyQ') {
-		ev.preventDefault();
-		ev.stopPropagation();
-		if (controller.isSitting.value) {
-			controller.standUp();
-		}
-	} else if (ev.code === 'Tab') {
-		ev.preventDefault();
-		ev.stopPropagation();
-		if (controller.isEditMode.value) {
-			controller.exitEditMode();
-			controller.isEditMode.value = false;
-		} else {
-			controller.enterEditMode();
-			controller.isEditMode.value = true;
-		}
-	} else if (ev.code === 'KeyZ') {
-		ev.preventDefault();
-		ev.stopPropagation();
-		isZenMode.value = !isZenMode.value;
-		nextTick(() => {
-			resize();
-		});
-	}
-}
-
-function onWheel(ev: WheelEvent) {
-	if (controller.grabbing.value) {
-		ev.preventDefault();
-		ev.stopPropagation();
-
-		controller.changeGrabbingDistance(ev.deltaY * 0.025);
-	} else {
-		ev.preventDefault();
-		ev.stopPropagation();
-
-		controller.camera.fov += ev.deltaY * 0.001;
-		controller.camera.fov = Math.max(0.25, Math.min(1, controller.camera.fov));
-	}
-}
-
 onMounted(async () => {
 	controller.init(canvas.value!);
 
diff --git a/packages/frontend/src/utility/room/controller.ts b/packages/frontend/src/utility/room/controller.ts
index eceb6fc802..bcd013a1cc 100644
--- a/packages/frontend/src/utility/room/controller.ts
+++ b/packages/frontend/src/utility/room/controller.ts
@@ -77,21 +77,37 @@ export class RoomController {
 		}
 
 		this.canvas.addEventListener('keydown', (ev) => {
-			if (this.worker != null) this.worker.postMessage({ type: 'dom:keydown', ev: { code: ev.code, shiftKey: ev.shiftKey } });
+			if (this.worker != null) {
+				this.worker.postMessage({ type: 'dom:keydown', ev: { code: ev.code, shiftKey: ev.shiftKey } });
+			} else if (this.engine != null) {
+				this.engine.domEvents.emit('keydown', { code: ev.code, shiftKey: ev.shiftKey });
+			}
 			ev.preventDefault();
 			ev.stopPropagation();
 			return false;
 		});
 
 		this.canvas.addEventListener('keyup', (ev) => {
-			if (this.worker != null) this.worker.postMessage({ type: 'dom:keyup', ev: { code: ev.code, shiftKey: ev.shiftKey } });
+			if (this.worker != null) {
+				this.worker.postMessage({ type: 'dom:keyup', ev: { code: ev.code, shiftKey: ev.shiftKey } });
+			} else if (this.engine != null) {
+				this.engine.domEvents.emit('keyup', { code: ev.code, shiftKey: ev.shiftKey });
+			}
 			ev.preventDefault();
 			ev.stopPropagation();
 			return false;
 		});
 
 		this.canvas.addEventListener('pointerdown', (ev) => {
-			if (this.worker != null) this.worker.postMessage({ type: 'dom:pointerdown', ev: { button: ev.button, shiftKey: ev.shiftKey } });
+			// todo
+		});
+
+		this.canvas.addEventListener('wheel', (ev) => {
+			if (this.worker != null) {
+				this.worker.postMessage({ type: 'dom:wheel', ev: { deltaY: ev.deltaY } });
+			} else if (this.engine != null) {
+				this.engine.domEvents.emit('wheel', { deltaY: ev.deltaY });
+			}
 			ev.preventDefault();
 			ev.stopPropagation();
 			return false;
diff --git a/packages/frontend/src/utility/room/engine.ts b/packages/frontend/src/utility/room/engine.ts
index 7ef09eae43..228ae2ca24 100644
--- a/packages/frontend/src/utility/room/engine.ts
+++ b/packages/frontend/src/utility/room/engine.ts
@@ -530,6 +530,12 @@ export class RoomEngine extends EventEmitter<RoomEngineEvents> {
 	public isSitting = false;
 	private fps = 60;
 
+	public domEvents: EventEmitter<{
+		'keydown': (event: { code: string; shiftKey: boolean; }) => void;
+		'keyup': (event: { code: string; shiftKey: boolean; }) => void;
+		'wheel': (event: { deltaY: number; }) => void;
+	}> = new EventEmitter();
+
 	constructor(roomState: RoomState, options: {
 		canvas: HTMLCanvasElement;
 		engine: BABYLON.WebGPUEngine;
@@ -866,6 +872,43 @@ export class RoomEngine extends EventEmitter<RoomEngineEvents> {
 				}
 			}, 3000);
 		}
+
+		this.domEvents.on('keydown', (ev) => {
+			if (ev.code === 'KeyE') {
+				if (this.isEditMode) {
+					if (this.grabbingCtx != null) {
+						this.endGrabbing();
+					} else {
+						this.beginSelectedInstalledObjectGrabbing();
+					}
+				} else if (this.selected != null) {
+					this.interact(this.selected.objectId);
+				}
+			} else if (ev.code === 'KeyR') {
+				if (this.grabbingCtx != null) {
+					this.changeGrabbingRotationY(Math.PI / 8);
+				}
+			} else if (ev.code === 'KeyQ') {
+				if (this.isSitting) {
+					this.standUp();
+				}
+			} else if (ev.code === 'Tab') {
+				if (this.isEditMode) {
+					this.exitEditMode();
+				} else {
+					this.enterEditMode();
+				}
+			}
+		});
+
+		this.domEvents.on('wheel', (ev) => {
+			if (this.grabbingCtx != null) {
+				this.changeGrabbingDistance(ev.deltaY * 0.025);
+			} else {
+				this.camera.fov += ev.deltaY * 0.001;
+				this.camera.fov = Math.max(0.25, Math.min(1, this.camera.fov));
+			}
+		});
 	}
 
 	public selectObject(objectId: string | null) {