Merge remote-tracking branch 'upstream/master'

Tools/Gulp/config.json

@@ -1752,6 +1752,7 @@
                     "../../gui/src/3D/controls/container3D.ts",
                     "../../gui/src/3D/controls/abstractButton3D.ts",
                     "../../gui/src/3D/controls/button3D.ts",
+                    "../../gui/src/3D/controls/meshButton3D.ts",
                     "../../gui/src/3D/controls/holographicButton.ts",
                     "../../gui/src/3D/controls/stackPanel3D.ts",
                     "../../gui/src/3D/controls/volumeBasedPanel.ts",

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]) {

dist/preview release/babylon.max.js

@@ -12092,7 +12092,7 @@ var BABYLON;
              * Returns the current version of the framework
              */
             get: function () {
-                return "3.3.0-alpha.7";
+                return "3.3.0-alpha.8";
             },
             enumerable: true,
             configurable: true
@@ -50845,8 +50845,9 @@ var BABYLON;
             if (!this._isStarted) {
                 return this;
             }
-            while (this._animatables.length > 0) {
-                this._animatables[0].stop();
+            var list = this._animatables.slice();
+            for (var index = 0; index < list.length; index++) {
+                list[index].stop();
             }
             this._isStarted = false;
             return this;

dist/preview release/babylon.no-module.max.js

@@ -12059,7 +12059,7 @@ var BABYLON;
              * Returns the current version of the framework
              */
             get: function () {
-                return "3.3.0-alpha.7";
+                return "3.3.0-alpha.8";
             },
             enumerable: true,
             configurable: true
@@ -50812,8 +50812,9 @@ var BABYLON;
             if (!this._isStarted) {
                 return this;
             }
-            while (this._animatables.length > 0) {
-                this._animatables[0].stop();
+            var list = this._animatables.slice();
+            for (var index = 0; index < list.length; index++) {
+                list[index].stop();
             }
             this._isStarted = false;
             return this;

dist/preview release/es6.js

@@ -12059,7 +12059,7 @@ var BABYLON;
              * Returns the current version of the framework
              */
             get: function () {
-                return "3.3.0-alpha.7";
+                return "3.3.0-alpha.8";
             },
             enumerable: true,
             configurable: true
@@ -50812,8 +50812,9 @@ var BABYLON;
             if (!this._isStarted) {
                 return this;
             }
-            while (this._animatables.length > 0) {
-                this._animatables[0].stop();
+            var list = this._animatables.slice();
+            for (var index = 0; index < list.length; index++) {
+                list[index].stop();
             }
             this._isStarted = false;
             return this;

dist/preview release/glTF2Interface/package.json

@@ -1,7 +1,7 @@
 {
     "name": "babylonjs-gltf2interface",
     "description": "A typescript declaration of babylon's gltf2 inteface.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/gui/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-gui",
     "description": "The Babylon.js GUI library is an extension you can use to generate interactive user interface. It is build on top of the DynamicTexture.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/inspector/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-inspector",
     "description": "The Babylon.js inspector.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/loaders/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-loaders",
     "description": "The Babylon.js file loaders library is an extension you can use to load different 3D file types into a Babylon scene.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -27,7 +27,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs-gltf2interface": "3.3.0-alpha.7"
+        "babylonjs-gltf2interface": "3.3.0-alpha.8"
     },
     "peerDependencies": {
         "babylonjs": ">=3.2.0-alpha"

dist/preview release/materialsLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-materials",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/postProcessesLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-post-process",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/proceduralTexturesLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-procedural-textures",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/serializers/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-serializers",
     "description": "The Babylon.js serializers library is an extension you can use to serialize Babylon scenes.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -27,7 +27,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs-gltf2interface": "3.3.0-alpha.7"
+        "babylonjs-gltf2interface": "3.3.0-alpha.8"
     },
     "peerDependencies": {
         "babylonjs": ">=3.2.0-alpha"

dist/preview release/viewer/babylon.viewer.d.ts

@@ -1482,6 +1482,7 @@ declare module BabylonViewer {
         viewerId: string;
         mainColor: BABYLON.Color3;
         reflectionColor: BABYLON.Color3;
+        scene?: BABYLON.Scene;
     }
 }
 

dist/preview release/viewer/babylon.viewer.module.d.ts

@@ -1476,12 +1476,13 @@ declare module 'babylonjs-viewer/managers/observablesManager' {
 
 declare module 'babylonjs-viewer/configuration/configurationContainer' {
     import { ViewerConfiguration } from 'babylonjs-viewer/configuration/configuration';
-    import { Color3 } from 'babylonjs';
+    import { Color3, Scene } from 'babylonjs';
     export class ConfigurationContainer {
         configuration: ViewerConfiguration;
         viewerId: string;
         mainColor: Color3;
         reflectionColor: Color3;
+        scene?: Scene;
     }
 }
 

dist/preview release/what's new.md

@@ -95,7 +95,8 @@
 - Animation navbar now updates correctly when a new model is loaded [#4441](https://github.com/BabylonJS/Babylon.js/issues/4441) ([RaananW](https://github.com/RaananW))
 - Non-normalized meshes didn't center and focus correctly ([RaananW](https://github.com/RaananW))
 - Meshes with skeletons could have incorrect animations ([RaananW](https://github.com/RaananW))
-- Removed element IDs from viewer's templates to allow more than one viewqer in a single page [#4500](https://github.com/BabylonJS/Babylon.js/issues/4500) ([RaananW](https://github.com/RaananW))
+- Removed element IDs from viewer's templates to allow muitiple viewers in a single page [#4500](https://github.com/BabylonJS/Babylon.js/issues/4500) ([RaananW](https://github.com/RaananW))
+- Viewer is not using Engine.LastCreatedScene anymore, to support multiple viewers in a single page [#4500](https://github.com/BabylonJS/Babylon.js/issues/4500) ([RaananW](https://github.com/RaananW))
 
 ### Loaders
 

gui/src/3D/controls/meshButton3D.ts

@@ -0,0 +1,68 @@
+/// <reference path="../../../../dist/preview release/babylon.d.ts"/>
+
+module BABYLON.GUI {
+    /**
+     * Class used to create an interactable object. It's a 3D button using a mesh coming from the current scene
+     */
+    export class MeshButton3D extends Button3D {
+        /** @hidden */
+        protected _currentMesh: Mesh;
+
+        /**
+         * Creates a new 3D button based on a mesh
+         * @param mesh mesh to become a 3D button
+         * @param name defines the control name
+         */
+        constructor(mesh: Mesh, name?: string) {
+            super(name);
+            this._currentMesh = mesh; 
+
+            /**
+             * Provides a default behavior on hover/out & up/down
+             * Override those function to create your own desired behavior specific to your mesh
+             */
+            this.pointerEnterAnimation = () => {
+                if (!this.mesh) {
+                    return;
+                }
+                this.mesh.scaling.scaleInPlace(1.1);
+            }
+
+            this.pointerOutAnimation = () => {
+                if (!this.mesh) {
+                    return;
+                }
+                this.mesh.scaling.scaleInPlace(1.0 / 1.1);
+            }    
+
+            this.pointerDownAnimation = () => {
+                if (!this.mesh) {
+                    return;
+                }
+                this.mesh.scaling.scaleInPlace(0.95);
+            }
+
+            this.pointerUpAnimation = () => {
+                if (!this.mesh) {
+                    return;
+                }
+                this.mesh.scaling.scaleInPlace(1.0 / 0.95);
+            }                     
+        }
+
+        protected _getTypeName(): string {
+            return "MeshButton3D";
+        }        
+
+        // Mesh association
+        protected _createNode(scene: Scene): TransformNode {
+            this._currentMesh.getChildMeshes().forEach((mesh)=>{
+                mesh.metadata = this;
+            });
+            return this._currentMesh;
+        }
+
+        protected _affectMaterial(mesh: AbstractMesh) {
+        }
+    }
+}

package.json

@@ -9,7 +9,7 @@
     ],
     "name": "babylonjs",
     "description": "Babylon.js is a JavaScript 3D engine based on webgl.",
-    "version": "3.3.0-alpha.7",
+    "version": "3.3.0-alpha.8",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

src/Engine/babylon.engine.ts

@@ -710,7 +710,7 @@
          * Returns the current version of the framework
          */
         public static get Version(): string {
-            return "3.3.0-alpha.7";
+            return "3.3.0-alpha.8";
         }
 
         // Updatable statics so stick with vars here
@@ -4194,7 +4194,7 @@
 
             // determine if a ktx file should be substituted
             var isKTX = false;
-            if (this._textureFormatInUse && !isBase64 && !fallback) {
+            if (this._textureFormatInUse && !isBase64 && !fallback && !buffer) {
                 url = url.substring(0, lastDot) + this._textureFormatInUse;
                 isKTX = true;
             }
@@ -4224,7 +4224,8 @@
                     scene._removePendingData(texture);
                 }
 
-                if (onLoadObserver) {
+                if (onLoadObserver && !isKTX) {
+                    //dont remove the observer if its a ktx file, since the fallback createTexture call will require it.
                     texture.onLoadedObservable.remove(onLoadObserver);
                 }