From 66c8ea2744e07d61134da29cdaed5ad2ec1a2e5e Mon Sep 17 00:00:00 2001 From: kv-bh <52176828+kv-bh@users.noreply.github.com> Date: Fri, 19 Sep 2025 16:27:24 -0400 Subject: [PATCH 1/2] Create abstraction layer over the inspector gizmo layer --- .../entities/cameraTreeItemComponent.tsx | 5 +-- .../entities/lightTreeItemComponent.tsx | 5 +-- .../entities/sceneTreeItemComponent.tsx | 41 +++++++------------ packages/dev/inspector/src/inspector.ts | 6 +-- .../inspector/src/inspectorGizmoManager.ts | 36 ++++++++++++++++ 5 files changed, 56 insertions(+), 37 deletions(-) create mode 100644 packages/dev/inspector/src/inspectorGizmoManager.ts diff --git a/packages/dev/inspector/src/components/sceneExplorer/entities/cameraTreeItemComponent.tsx b/packages/dev/inspector/src/components/sceneExplorer/entities/cameraTreeItemComponent.tsx index f51de5b36de..809cf13a0e9 100644 --- a/packages/dev/inspector/src/components/sceneExplorer/entities/cameraTreeItemComponent.tsx +++ b/packages/dev/inspector/src/components/sceneExplorer/entities/cameraTreeItemComponent.tsx @@ -10,6 +10,7 @@ import { TreeItemLabelComponent } from "../treeItemLabelComponent"; import { ExtensionsComponent } from "../extensionsComponent"; import * as React from "react"; import type { GlobalState } from "../../globalState"; +import { GetInspectorGizmoManager } from "../../../inspectorGizmoManager"; interface ICameraTreeItemComponentProps { camera: Camera; @@ -73,9 +74,7 @@ export class CameraTreeItemComponent extends React.Component { this._selectedEntity = entity; - if (entity && scene.reservedDataStore && scene.reservedDataStore.gizmoManager) { - const manager: GizmoManager = scene.reservedDataStore.gizmoManager; - + const manager = GetInspectorGizmoManager(scene, false); + if (entity && manager) { const className = entity.getClassName(); if (className === "TransformNode" || className.indexOf("Mesh") !== -1) { @@ -181,10 +178,11 @@ export class SceneTreeItemComponent extends React.Component< } onCoordinatesMode() { - const scene = this.props.scene; - const manager: GizmoManager = scene.reservedDataStore.gizmoManager; + const manager = GetInspectorGizmoManager(this.props.scene, false); // flip coordinate system - manager.coordinatesMode = this.state.isInWorldCoodinatesMode ? GizmoCoordinatesMode.Local : GizmoCoordinatesMode.World; + if (manager) { + manager.coordinatesMode = this.state.isInWorldCoodinatesMode ? GizmoCoordinatesMode.Local : GizmoCoordinatesMode.World; + } this.setState({ isInWorldCoodinatesMode: !this.state.isInWorldCoodinatesMode }); } onPickingMode() { @@ -266,27 +264,17 @@ export class SceneTreeItemComponent extends React.Component< setGizmoMode(mode: number) { const scene = this.props.scene; - if (!scene.reservedDataStore) { - scene.reservedDataStore = {}; - } - if (this._gizmoLayerOnPointerObserver) { scene.onPointerObservable.remove(this._gizmoLayerOnPointerObserver); this._gizmoLayerOnPointerObserver = null; } - if (!scene.reservedDataStore.gizmoManager) { - const layer1 = scene.frameGraph ? FrameGraphUtils.CreateUtilityLayerRenderer(scene.frameGraph) : new UtilityLayerRenderer(scene); - const layer2 = scene.frameGraph ? FrameGraphUtils.CreateUtilityLayerRenderer(scene.frameGraph) : new UtilityLayerRenderer(scene); - - scene.reservedDataStore.gizmoManager = new GizmoManager(scene, undefined, layer1, layer2); - } + const manager = GetInspectorGizmoManager(scene, true); if (this.props.gizmoCamera) { - scene.reservedDataStore.gizmoManager.utilityLayer.setRenderCamera(this.props.gizmoCamera); + manager.utilityLayer.setRenderCamera(this.props.gizmoCamera); } - const manager: GizmoManager = scene.reservedDataStore.gizmoManager; // Allow picking of light gizmo when a gizmo mode is selected this._gizmoLayerOnPointerObserver = UtilityLayerRenderer.DefaultUtilityLayer.utilityLayerScene.onPointerObservable.add((pointerInfo) => { if (pointerInfo.type == PointerEventTypes.POINTERDOWN) { @@ -312,8 +300,7 @@ export class SceneTreeItemComponent extends React.Component< if (this.state.gizmoMode === mode) { mode = 0; - manager.dispose(); - scene.reservedDataStore.gizmoManager = null; + DisposeInspectorGizmoManager(scene); } else { switch (mode) { case 1: diff --git a/packages/dev/inspector/src/inspector.ts b/packages/dev/inspector/src/inspector.ts index 6f1b0871f82..246d9a23916 100644 --- a/packages/dev/inspector/src/inspector.ts +++ b/packages/dev/inspector/src/inspector.ts @@ -19,6 +19,7 @@ import type { IPopupComponentProps } from "./components/popupComponent"; import { PopupComponent } from "./components/popupComponent"; import { CopyStyles } from "shared-ui-components/styleHelper"; import { CreatePopup } from "shared-ui-components/popupHelper"; +import { DisposeInspectorGizmoManager } from "./inspectorGizmoManager"; interface IInternalInspectorOptions extends IInspectorOptions { popup: boolean; @@ -538,10 +539,7 @@ export class Inspector { this._GlobalState.enableCameraGizmo(g.camera, false); } } - if (this._Scene && this._Scene.reservedDataStore && this._Scene.reservedDataStore.gizmoManager) { - this._Scene.reservedDataStore.gizmoManager.dispose(); - this._Scene.reservedDataStore.gizmoManager = null; - } + DisposeInspectorGizmoManager(this._Scene); if (this._NewCanvasContainer) { this._DestroyCanvasContainer(); diff --git a/packages/dev/inspector/src/inspectorGizmoManager.ts b/packages/dev/inspector/src/inspectorGizmoManager.ts new file mode 100644 index 00000000000..ccc948a8f81 --- /dev/null +++ b/packages/dev/inspector/src/inspectorGizmoManager.ts @@ -0,0 +1,36 @@ +import type { Scene } from "core/scene"; +import type { Nullable } from "core/types"; +import { UtilityLayerRenderer } from "core/Rendering/utilityLayerRenderer"; +import { GizmoManager } from "core/Gizmos/gizmoManager"; +import { FrameGraphUtils } from "core/FrameGraph/frameGraphUtils"; + +function CreateInspectorGizmoManager(scene: Scene): GizmoManager { + const layer1 = scene.frameGraph ? FrameGraphUtils.CreateUtilityLayerRenderer(scene.frameGraph) : new UtilityLayerRenderer(scene); + const layer2 = scene.frameGraph ? FrameGraphUtils.CreateUtilityLayerRenderer(scene.frameGraph) : new UtilityLayerRenderer(scene); + const gizmoManager = new GizmoManager(scene, undefined, layer1, layer2); + scene.reservedDataStore ??= {}; + scene.reservedDataStore.gizmoManager = gizmoManager; + return gizmoManager; +} + +export function GetInspectorGizmoManager(scene: Nullable | undefined, create: true): GizmoManager; +export function GetInspectorGizmoManager(scene: Nullable | undefined, create: false): Nullable; +export function GetInspectorGizmoManager(scene: Nullable | undefined, create: boolean): Nullable { + let gizmoManager = ( + scene && scene.reservedDataStore && scene.reservedDataStore.gizmoManager + ? scene.reservedDataStore.gizmoManager as GizmoManager + : null + ); + if (!gizmoManager && create) { + if (!scene) { throw new Error('Invalid scene provided to GetInspectorGizmoManager'); } + gizmoManager = CreateInspectorGizmoManager(scene); + } + return gizmoManager; +} + +export function DisposeInspectorGizmoManager(scene: Nullable | undefined): void { + const gizmoManager = GetInspectorGizmoManager(scene, false); + if (!gizmoManager) { return; } + gizmoManager.dispose(); + scene!.reservedDataStore.gizmoManager = null; +} From 570b95f679412e887ee81cef742c519cd9a28a26 Mon Sep 17 00:00:00 2001 From: kv-bh <52176828+kv-bh@users.noreply.github.com> Date: Mon, 22 Sep 2025 09:13:48 -0400 Subject: [PATCH 2/2] Fix formatting --- .../dev/inspector/src/inspectorGizmoManager.ts | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/dev/inspector/src/inspectorGizmoManager.ts b/packages/dev/inspector/src/inspectorGizmoManager.ts index ccc948a8f81..3e91a66eb1d 100644 --- a/packages/dev/inspector/src/inspectorGizmoManager.ts +++ b/packages/dev/inspector/src/inspectorGizmoManager.ts @@ -16,13 +16,11 @@ function CreateInspectorGizmoManager(scene: Scene): GizmoManager { export function GetInspectorGizmoManager(scene: Nullable | undefined, create: true): GizmoManager; export function GetInspectorGizmoManager(scene: Nullable | undefined, create: false): Nullable; export function GetInspectorGizmoManager(scene: Nullable | undefined, create: boolean): Nullable { - let gizmoManager = ( - scene && scene.reservedDataStore && scene.reservedDataStore.gizmoManager - ? scene.reservedDataStore.gizmoManager as GizmoManager - : null - ); + let gizmoManager = scene && scene.reservedDataStore && scene.reservedDataStore.gizmoManager ? (scene.reservedDataStore.gizmoManager as GizmoManager) : null; if (!gizmoManager && create) { - if (!scene) { throw new Error('Invalid scene provided to GetInspectorGizmoManager'); } + if (!scene) { + throw new Error("Invalid scene provided to GetInspectorGizmoManager"); + } gizmoManager = CreateInspectorGizmoManager(scene); } return gizmoManager; @@ -30,7 +28,9 @@ export function GetInspectorGizmoManager(scene: Nullable | undefined, cre export function DisposeInspectorGizmoManager(scene: Nullable | undefined): void { const gizmoManager = GetInspectorGizmoManager(scene, false); - if (!gizmoManager) { return; } + if (!gizmoManager) { + return; + } gizmoManager.dispose(); scene!.reservedDataStore.gizmoManager = null; }