jbourdon/space-game
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(viewer): add Vue-based HUD, ops strip, and history window

Browse Source
This commit is contained in:
Jonathan Bourdon
2026-03-19 13:49:56 -04:00
parent 710addf1f5
commit 3ca568c05d
36 changed files with 2648 additions and 1017 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
apps/viewer/src/viewerControllerFactory.ts
View File

@@ -79,21 +79,13 @@ export function createViewerControllers(host: any) {
const presentationController = new ViewerPresentationController({
renderer: host.renderer,
hudState: host.hudState,
galaxyScene: host.galaxyLayer.scene,
galaxyCamera: host.galaxyLayer.camera,
systemCamera: host.systemLayer.camera,
galaxyAnchor: host.galaxyAnchor,
systemAnchor: host.systemAnchor,
ambienceGroup: host.universeLayer.ambienceGroup,
gameSummaryEl: host.gameSummaryEl,
networkSummaryEl: host.networkSummaryEl,
performanceSummaryEl: host.performanceSummaryEl,
statusEl: host.statusEl,
networkPanelEl: host.networkPanelEl,
performancePanelEl: host.performancePanelEl,
systemPanelEl: host.systemPanelEl,
systemTitleEl: host.systemTitleEl,
systemBodyEl: host.systemBodyEl,
networkStats: host.networkStats,
performanceStats: host.performanceStats,
getWorld: () => host.world,
@@ -137,10 +129,7 @@ export function createViewerControllers(host: any) {
getCameraTargetShipId: () => host.cameraTargetShipId,
getNetworkStats: () => host.networkStats,
getSystemSummaryVisuals: () => new Map(),
errorEl: host.errorEl,
opsStripEl: host.opsStripEl,
detailTitleEl: host.detailTitleEl,
detailBodyEl: host.detailBodyEl,
hudState: host.hudState,
worldLabel: () => host.world?.label ?? "",
rebuildSystems: (systems) => sceneDataController.rebuildSystems(systems),
syncCelestials: (celestials) => sceneDataController.syncCelestials(celestials),
@@ -166,7 +155,6 @@ export function createViewerControllers(host: any) {
});
const historyController = new ViewerHistoryWindowController({
historyLayerEl: host.historyLayerEl,
historyWindows: host.historyWindows,
getWorld: () => host.world,
getHistoryWindowCounter: () => host.historyWindowCounter,
@@ -200,13 +188,14 @@ export function createViewerControllers(host: any) {
hoverLabelEl: host.hoverLabelEl,
hoverConnectorLineEl: host.hoverConnectorLineEl,
marqueeEl: host.marqueeEl,
hudState: host.hudState,
keyState: host.keyState,
getWorld: () => host.world,
getActiveSystemId: () => host.activeSystemId,
getPovLevel: () => host.povLevel,
getSelectedItems: () => host.selectedItems,
setSelectedItems: (items) => {
host.selectedItems = items;
host.applySelectedItems(items, "viewer");
},
getDragMode: () => host.dragMode,
setDragMode: (mode) => {
@@ -268,20 +257,33 @@ export function createViewerControllers(host: any) {
}
export function wireViewerEvents(host: any) {
host.renderer.domElement.addEventListener("pointerdown", host.interactionController.onPointerDown);
host.renderer.domElement.addEventListener("pointermove", host.interactionController.onPointerMove);
host.renderer.domElement.addEventListener("pointerup", host.interactionController.onPointerUp);
host.renderer.domElement.addEventListener("pointerleave", host.interactionController.onPointerUp);
host.renderer.domElement.addEventListener("click", host.interactionController.onClick);
host.renderer.domElement.addEventListener("dblclick", host.interactionController.onDoubleClick);
host.renderer.domElement.addEventListener("wheel", host.interactionController.onWheel, { passive: false });
host.opsStripEl.addEventListener("click", host.interactionController.onOpsStripClick);
host.opsStripEl.addEventListener("dblclick", host.interactionController.onOpsStripDoubleClick);
const canvas = host.renderer.domElement;
canvas.addEventListener("pointerdown", host.interactionController.onPointerDown);
canvas.addEventListener("pointermove", host.interactionController.onPointerMove);
canvas.addEventListener("pointerup", host.interactionController.onPointerUp);
canvas.addEventListener("pointerleave", host.interactionController.onPointerUp);
canvas.addEventListener("click", host.interactionController.onClick);
canvas.addEventListener("dblclick", host.interactionController.onDoubleClick);
canvas.addEventListener("wheel", host.interactionController.onWheel, { passive: false });
host.historyLayerEl.addEventListener("click", host.interactionController.onHistoryLayerClick);
host.historyLayerEl.addEventListener("pointerdown", host.interactionController.onHistoryLayerPointerDown);
window.addEventListener("pointermove", host.interactionController.onHistoryWindowPointerMove);
window.addEventListener("pointerup", host.interactionController.onHistoryWindowPointerUp);
window.addEventListener("keydown", host.interactionController.onKeyDown);
window.addEventListener("keyup", host.interactionController.onKeyUp);
window.addEventListener("resize", host.onResize);
return () => {
canvas.removeEventListener("pointerdown", host.interactionController.onPointerDown);
canvas.removeEventListener("pointermove", host.interactionController.onPointerMove);
canvas.removeEventListener("pointerup", host.interactionController.onPointerUp);
canvas.removeEventListener("pointerleave", host.interactionController.onPointerUp);
canvas.removeEventListener("click", host.interactionController.onClick);
canvas.removeEventListener("dblclick", host.interactionController.onDoubleClick);
canvas.removeEventListener("wheel", host.interactionController.onWheel);
host.historyLayerEl.removeEventListener("click", host.interactionController.onHistoryLayerClick);
host.historyLayerEl.removeEventListener("pointerdown", host.interactionController.onHistoryLayerPointerDown);
window.removeEventListener("pointermove", host.interactionController.onHistoryWindowPointerMove);
window.removeEventListener("pointerup", host.interactionController.onHistoryWindowPointerUp);
window.removeEventListener("keydown", host.interactionController.onKeyDown);
window.removeEventListener("keyup", host.interactionController.onKeyUp);
};
}