Fixed a bug with LastCreatedScene

Models thath were loaded async, after two viewers were created,
were added to the LasstCreatedScene, and not to the cxorrect viewer's scene.

Viewer/assets/templates/default/overlay.html

@@ -3,7 +3,7 @@
         position: absolute;
         z-index: 99;
         opacity: 0;
-        display: flex;
+        display: none;
         justify-content: center;
         align-items: center;
         -webkit-transition: opacity 1s ease;

Viewer/src/configuration/configurationContainer.ts

@@ -1,5 +1,5 @@
 import { ViewerConfiguration } from './configuration';
-import { Color3 } from 'babylonjs';
+import { Color3, Scene } from 'babylonjs';
 
 export class ConfigurationContainer {
 
@@ -9,4 +9,5 @@ export class ConfigurationContainer {
 
     public mainColor: Color3 = Color3.White();
     public reflectionColor: Color3 = Color3.White();
+    public scene?: Scene;
 }

Viewer/src/loader/modelLoader.ts

@@ -1,9 +1,8 @@
 import { ISceneLoaderPlugin, ISceneLoaderPluginAsync, Tools, SceneLoader, Tags } from "babylonjs";
 import { GLTFFileLoader, GLTFLoaderAnimationStartMode } from "babylonjs-loaders";
-import { ViewerConfiguration } from "../configuration/configuration";
 import { IModelConfiguration } from "../configuration/interfaces/modelConfiguration";
 import { ViewerModel, ModelState } from "../model/viewerModel";
-import { getLoaderPluginByName, TelemetryLoaderPlugin, ILoaderPlugin } from './plugins/';
+import { getLoaderPluginByName, ILoaderPlugin } from './plugins/';
 import { ObservablesManager } from "../managers/observablesManager";
 import { ConfigurationContainer } from "../configuration/configurationContainer";
 
@@ -58,7 +57,7 @@ export class ModelLoader {
      */
     public load(modelConfiguration: IModelConfiguration): ViewerModel {
 
-        const model = new ViewerModel(this._observablesManager, modelConfiguration);
+        const model = new ViewerModel(this._observablesManager, modelConfiguration, this._configurationContainer);
 
         model.loadId = this._loadId++;
 

Viewer/src/managers/sceneManager.ts

@@ -338,6 +338,8 @@ export class SceneManager {
         // create a new scene
         this.scene = new Scene(this._engine);
 
+        this._configurationContainer.scene = this.scene;
+
         // set a default PBR material
         if (!sceneConfiguration.defaultMaterial) {
             var defaultMaterial = new BABYLON.PBRMaterial('defaultMaterial', this.scene);

Viewer/src/model/viewerModel.ts

@@ -114,8 +114,10 @@ export class ViewerModel implements IDisposable {
 
         this.state = ModelState.INIT;
 
-        this.rootMesh = new AbstractMesh("modelRootMesh");
-        this._pivotMesh = new AbstractMesh("pivotMesh");
+        let scene = this._configurationContainer && this._configurationContainer.scene
+
+        this.rootMesh = new AbstractMesh("modelRootMesh", scene);
+        this._pivotMesh = new AbstractMesh("pivotMesh", scene);
         this._pivotMesh.parent = this.rootMesh;
         // rotate 180, gltf fun
         this._pivotMesh.rotation.y += Math.PI;
@@ -241,7 +243,7 @@ export class ViewerModel implements IDisposable {
         // check if this is not a gltf loader and init the animations
         if (this.skeletons.length) {
             this.skeletons.forEach((skeleton, idx) => {
-                let ag = new AnimationGroup("animation-" + idx);
+                let ag = new AnimationGroup("animation-" + idx, this._configurationContainer && this._configurationContainer.scene);
                 let add = false;
                 skeleton.getAnimatables().forEach(a => {
                     if (a.animations[0]) {