Merge pull request #8091 from belfortk/update-inspector-scene-change

Add Support to Auto-Update Inspector when Switching Scenes

dist/preview release/what's new.md

@@ -40,6 +40,7 @@
 - Added right click options to create PBR and Standard Materials ([Deltakosh](https://github.com/deltakosh))
 - Added support for recording GIF ([Deltakosh](https://github.com/deltakosh))
 - Popup Window available (To be used in Curve Editor) ([pixelspace](https://github.com/devpixelspace))
+- Add support to update inspector when switching to new scene ([belfortk](https://github.com/belfortk))
 
 ### Cameras
 

inspector/src/components/globalState.ts

@@ -20,7 +20,7 @@ export class GlobalState {
     public onTabChangedObservable = new Observable<number>();
     public onSelectionRenamedObservable = new Observable<void>();
     public onPluginActivatedObserver: Nullable<Observer<ISceneLoaderPlugin | ISceneLoaderPluginAsync>>;
-
+    public onNewSceneObservable = new Observable<Scene>();
     public sceneImportDefaults: { [key: string]: any } = {};
 
     public validationResults: Nullable<IGLTFValidationResults> = null;

inspector/src/components/sceneExplorer/sceneExplorerComponent.tsx

@@ -63,6 +63,7 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
     private _onSelectionChangeObserver: Nullable<Observer<any>>;
     private _onSelectionRenamedObserver: Nullable<Observer<void>>;
     private _onNewSceneAddedObserver: Nullable<Observer<Scene>>;
+    private _onNewSceneObserver: Nullable<Observer<Scene>>;
     private sceneExplorerRef: React.RefObject<Resizable>;
 
 
@@ -79,6 +80,11 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
         this.sceneMutationFunc = this.processMutation.bind(this);
 
         this.sceneExplorerRef = React.createRef();
+        this._onNewSceneObserver = this.props.globalState.onNewSceneObservable.add((scene: Scene) => {
+            this.setState({
+                scene
+            });
+        })
     }
 
     processMutation() {
@@ -114,6 +120,10 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
             EngineStore.LastCreatedEngine!.onNewSceneAddedObservable.remove(this._onNewSceneAddedObserver);
         }
 
+        if(this._onNewSceneObserver){
+            this.props.globalState.onNewSceneObservable.remove(this._onNewSceneObserver);
+        }
+
         const scene = this.state.scene;
 
         scene.onNewSkeletonAddedObservable.removeCallback(this.sceneMutationFunc);

inspector/src/inspector.ts

@@ -417,6 +417,11 @@ export class Inspector {
         }
     }
 
+    public static _SetNewScene(scene: Scene) {
+        this._Scene = scene;
+        this._GlobalState.onNewSceneObservable.notifyObservers(scene);
+    }
+
     public static _CreateCanvasContainer(parentControl: HTMLElement) {
         // Create a container for previous elements
         this._NewCanvasContainer = parentControl.ownerDocument!.createElement("div");

src/Debug/debugLayer.ts

@@ -262,6 +262,16 @@ export class DebugLayer {
         }
     }
 
+
+    /**
+     * Update the scene in the inspector 
+     */
+    public setAsActiveScene(){
+        if (this.BJSINSPECTOR) {
+            this.BJSINSPECTOR.Inspector._SetNewScene(this._scene);
+        }
+    }
+
     /**
       * Launch the debugLayer.
       * @param config Define the configuration of the inspector