update from upstream

Playground/frame.js

@@ -1,5 +1,5 @@
 (function () {
-    var snippetUrl = "//babylonjs-api.azurewebsites.net/api/snippet";
+    var snippetUrl = "https://babylonjs-api.azurewebsites.net/api/snippet";
     var currentSnippetToken;
     var engine;
     var fpsLabel = document.getElementById("fpsLabel");

Tools/Gulp/gulp-addModuleExports.js

@@ -10,19 +10,24 @@ module.exports = function (varName) {
           '};\n';
 
         var extendsAddition =
-        'var __extends = (this && this.__extends) || function (d, b) {\n' +
-          'for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];\n' +
-          'function __() { this.constructor = d; }\n' +
-          '__.prototype = b.prototype;\n' +
-          'd.prototype = new __();\n' +
-        '};\n';
+        `var __extends = (this && this.__extends) || (function () {
+            var extendStatics = Object.setPrototypeOf ||
+                ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+                function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            return function (d, b) {
+                extendStatics(d, b);
+                function __() { this.constructor = d; }
+                d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+            };
+        })();
+        `;
 
         var decorateAddition =
-        'var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n' +
-            'var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n' +
-            'if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);\n' +
-            'else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n' +
-            'return c > 3 && r && Object.defineProperty(target, key, r), r;\n' +
+        'var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n' +
+            'var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n' +
+            'if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);\n' +
+            'else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n' +
+            'return c > 3 && r && Object.defineProperty(target, key, r), r;\n' +
         '};\n';
 
         if (file.isNull()) {

Tools/Gulp/gulpfile.js

@@ -31,7 +31,7 @@ var includeShadersStream;
 var shadersStream;
 var workersStream;
 
-var extendsSearchRegex = /var\s__extends[\s\S]+?\};/g;
+var extendsSearchRegex = /var\s__extends[\s\S]+?\}\)\(\);/g;
 var decorateSearchRegex = /var\s__decorate[\s\S]+?\};/g;
 
 /**

Tools/Gulp/package.json

@@ -1,6 +1,6 @@
 {
   "name": "BabylonJS",
-  "version": "2.5.0",
+  "version": "3.0.0",
   "description": "Babylon.js is a 3D engine based on webgl and javascript",
   "main": "",
   "repository": { "url": "https://github.com/BabylonJS/Babylon.js/" },
@@ -8,10 +8,10 @@
   "license": "(Apache-2.0)",
   "devDependencies": {
     "gulp": "^3.8.11",
-    "gulp-uglify": "^2.0.1",
+    "gulp-uglify": "^2.1.2",
     "gulp-sourcemaps": "~1.9.1",
-    "typescript": "~2.1.4",
-    "gulp-typescript": "^3.1.5",
+    "typescript": "~2.2.2",
+    "gulp-typescript": "^3.1.6",
     "through2": "~0.6.5",
     "gulp-util": "~3.0.4",
     "gulp-concat": "~2.5.2",

dist/preview release/inspector/babylon.inspector.css

@@ -8,6 +8,7 @@
   display: flex;
   font-size: 0.9em;
   font-family: "Inconsolata", sans-serif;
+  background-color: #242424;
   /**
  * A tool contained in the tree panel (available for each item of the tree)
  */

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

@@ -24,7 +24,15 @@ declare module INSPECTOR {
          * If the parameter 'popup' is false, the inspector is created as a right panel on the main window.
          * If the parameter 'popup' is true, the inspector is created in another popup.
          */
-        constructor(scene: BABYLON.Scene, popup?: boolean, initialTab?: number, parentElement?: HTMLElement);
+        constructor(scene: BABYLON.Scene, popup?: boolean, initialTab?: number, parentElement?: HTMLElement, newColors?: {
+            backgroundColor?: string;
+            backgroundColorLighter?: string;
+            backgroundColorLighter2?: string;
+            backgroundColorLighter3?: string;
+            color?: string;
+            colorTop?: string;
+            colorBot?: string;
+        });
         /**
          * If the given element has a position 'asbolute' or 'relative',
          * returns the first parent of the given element that has a position 'relative' or 'absolute'.
@@ -157,6 +165,96 @@ declare module INSPECTOR {
             type: typeof BABYLON.PBRMaterial;
             properties: string[];
         };
+        'Canvas2D': {
+            type: typeof BABYLON.Canvas2D;
+        };
+        'Canvas2DEngineBoundData': {
+            type: typeof BABYLON.Canvas2DEngineBoundData;
+        };
+        'Ellipse2D': {
+            type: typeof BABYLON.Ellipse2D;
+        };
+        'Ellipse2DInstanceData': {
+            type: typeof BABYLON.Ellipse2DInstanceData;
+        };
+        'Ellipse2DRenderCache': {
+            type: typeof BABYLON.Ellipse2DRenderCache;
+        };
+        'Group2D': {
+            type: typeof BABYLON.Group2D;
+        };
+        'IntersectInfo2D': {
+            type: typeof BABYLON.IntersectInfo2D;
+        };
+        'Lines2D': {
+            type: typeof BABYLON.Lines2D;
+        };
+        'Lines2DInstanceData': {
+            type: typeof BABYLON.Lines2DInstanceData;
+        };
+        'Lines2DRenderCache': {
+            type: typeof BABYLON.Lines2DRenderCache;
+        };
+        'PrepareRender2DContext': {
+            type: typeof BABYLON.PrepareRender2DContext;
+        };
+        'Prim2DBase': {
+            type: typeof BABYLON.Prim2DBase;
+        };
+        'Prim2DClassInfo': {
+            type: typeof BABYLON.Prim2DClassInfo;
+        };
+        'Prim2DPropInfo': {
+            type: typeof BABYLON.Prim2DPropInfo;
+        };
+        'Rectangle2D': {
+            type: typeof BABYLON.Rectangle2D;
+        };
+        'Rectangle2DInstanceData': {
+            type: typeof BABYLON.Rectangle2DInstanceData;
+        };
+        'Rectangle2DRenderCache': {
+            type: typeof BABYLON.Rectangle2DRenderCache;
+        };
+        'Render2DContext': {
+            type: typeof BABYLON.Render2DContext;
+        };
+        'RenderablePrim2D': {
+            type: typeof BABYLON.RenderablePrim2D;
+        };
+        'ScreenSpaceCanvas2D': {
+            type: typeof BABYLON.ScreenSpaceCanvas2D;
+        };
+        'Shape2D': {
+            type: typeof BABYLON.Shape2D;
+        };
+        'Shape2DInstanceData': {
+            type: typeof BABYLON.Shape2DInstanceData;
+        };
+        'Sprite2D': {
+            type: typeof BABYLON.Sprite2D;
+        };
+        'Sprite2DInstanceData': {
+            type: typeof BABYLON.Sprite2DInstanceData;
+        };
+        'Sprite2DRenderCache': {
+            type: typeof BABYLON.Sprite2DRenderCache;
+        };
+        'Text2D': {
+            type: typeof BABYLON.Text2D;
+        };
+        'Text2DInstanceData': {
+            type: typeof BABYLON.Text2DInstanceData;
+        };
+        'Text2DRenderCache': {
+            type: typeof BABYLON.Text2DRenderCache;
+        };
+        'WorldSpaceCanvas2D': {
+            type: typeof BABYLON.WorldSpaceCanvas2D;
+        };
+        'WorldSpaceCanvas2DNode': {
+            type: typeof BABYLON.WorldSpaceCanvas2DNode;
+        };
     };
 }
 

dist/preview release/loaders/babylon.glTFFileLoader.d.ts

@@ -326,7 +326,7 @@ declare module BABYLON {
     */
     class GLTFFileLoaderBase {
         static CreateRuntime(parsedData: any, scene: Scene, rootUrl: string): IGLTFRuntime;
-        static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void): void;
+        static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): void;
         static LoadTextureBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void): void;
         static CreateTextureAsync(gltfRuntime: IGLTFRuntime, id: string, buffer: ArrayBufferView, onSuccess: (texture: Texture) => void, onError: () => void): void;
         static LoadShaderStringAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (shaderString: string) => void, onError: () => void): void;
@@ -355,13 +355,13 @@ declare module BABYLON {
         /**
         * Import meshes
         */
-        importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onSuccess?: (meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[]) => void, onError?: () => void): boolean;
+        importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onSuccess?: (meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[]) => void, onError?: () => void, onProgress?: () => void): boolean;
         /**
         * Load scene
         */
-        loadAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onSuccess: () => void, onError: () => void): boolean;
+        loadAsync(scene: Scene, data: string, rootUrl: string, onSuccess: () => void, onError: () => void): boolean;
         private _loadShadersAsync(gltfRuntime, onload);
-        private _loadBuffersAsync(gltfRuntime, onload);
+        private _loadBuffersAsync(gltfRuntime, onload, onProgress?);
         private _createNodes(gltfRuntime);
     }
 }
@@ -446,7 +446,7 @@ declare module BABYLON {
         * Defines an override for loading the runtime
         * Return true to stop further extensions from loading the runtime
         */
-        loadRuntimeAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onSuccess: (gltfRuntime: IGLTFRuntime) => void, onError: () => void): boolean;
+        loadRuntimeAsync(scene: Scene, data: string, rootUrl: string, onSuccess: (gltfRuntime: IGLTFRuntime) => void, onError: () => void): boolean;
         /**
          * Defines an onverride for creating gltf runtime
          * Return true to stop further extensions from creating the runtime
@@ -456,7 +456,7 @@ declare module BABYLON {
         * Defines an override for loading buffers
         * Return true to stop further extensions from loading this buffer
         */
-        loadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void): boolean;
+        loadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): boolean;
         /**
         * Defines an override for loading texture buffers
         * Return true to stop further extensions from loading this texture data
@@ -477,9 +477,9 @@ declare module BABYLON {
         * Return true to stop further extensions from loading this material
         */
         loadMaterialAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (material: Material) => void, onError: () => void): boolean;
-        static LoadRuntimeAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onSuccess: (gltfRuntime: IGLTFRuntime) => void, onError: () => void): void;
+        static LoadRuntimeAsync(scene: Scene, data: string, rootUrl: string, onSuccess: (gltfRuntime: IGLTFRuntime) => void, onError: () => void): void;
         static LoadRuntimeExtensionsAsync(gltfRuntime: IGLTFRuntime, onSuccess: () => void, onError: () => void): void;
-        static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (bufferView: ArrayBufferView) => void, onError: () => void): void;
+        static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (bufferView: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): void;
         static LoadTextureAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (texture: Texture) => void, onError: () => void): void;
         static LoadShaderStringAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (shaderData: string) => void, onError: () => void): void;
         static LoadMaterialAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (material: Material) => void, onError: () => void): void;

dist/preview release/loaders/babylon.glTFFileLoader.js

@@ -602,6 +602,7 @@ var BABYLON;
                 var tempVertexData = new BABYLON.VertexData();
                 var primitive = mesh.primitives[i];
                 if (primitive.mode !== 4) {
+                    // continue;
                 }
                 var attributes = primitive.attributes;
                 var accessor = null;
@@ -692,6 +693,7 @@ var BABYLON;
             }
             for (var i = 0; i < mesh.primitives.length; i++) {
                 if (mesh.primitives[i].mode !== 4) {
+                    //continue;
                 }
                 var subMesh = new BABYLON.SubMesh(index, verticesStarts[index], verticesCounts[index], indexStarts[index], indexCounts[index], newMesh, newMesh, true);
                 index++;
@@ -1152,13 +1154,13 @@ var BABYLON;
             }
             return gltfRuntime;
         };
-        GLTFFileLoaderBase.LoadBufferAsync = function (gltfRuntime, id, onSuccess, onError) {
+        GLTFFileLoaderBase.LoadBufferAsync = function (gltfRuntime, id, onSuccess, onError, onProgress) {
             var buffer = gltfRuntime.buffers[id];
             if (BABYLON.GLTFUtils.IsBase64(buffer.uri)) {
                 setTimeout(function () { return onSuccess(new Uint8Array(BABYLON.GLTFUtils.DecodeBase64(buffer.uri))); });
             }
             else {
-                BABYLON.Tools.LoadFile(gltfRuntime.rootUrl + buffer.uri, function (data) { return onSuccess(new Uint8Array(data)); }, null, null, true, onError);
+                BABYLON.Tools.LoadFile(gltfRuntime.rootUrl + buffer.uri, function (data) { return onSuccess(new Uint8Array(data)); }, onProgress, null, true, onError);
             }
         };
         GLTFFileLoaderBase.LoadTextureBufferAsync = function (gltfRuntime, id, onSuccess, onError) {
@@ -1364,7 +1366,7 @@ var BABYLON;
         /**
         * Import meshes
         */
-        GLTFFileLoader.prototype.importMeshAsync = function (meshesNames, scene, data, rootUrl, onSuccess, onError) {
+        GLTFFileLoader.prototype.importMeshAsync = function (meshesNames, scene, data, rootUrl, onSuccess, onError, onProgress) {
             var _this = this;
             scene.useRightHandedSystem = true;
             var gltfRuntime = BABYLON.GLTFFileLoaderExtension.LoadRuntimeAsync(scene, data, rootUrl, function (gltfRuntime) {
@@ -1408,7 +1410,7 @@ var BABYLON;
                             onSuccess(meshes, null, skeletons);
                         }
                     });
-                });
+                }, onProgress);
                 if (GLTFFileLoader.IncrementalLoading && onSuccess) {
                     onSuccess(meshes, null, skeletons);
                 }
@@ -1473,7 +1475,7 @@ var BABYLON;
             }
         };
         ;
-        GLTFFileLoader.prototype._loadBuffersAsync = function (gltfRuntime, onload) {
+        GLTFFileLoader.prototype._loadBuffersAsync = function (gltfRuntime, onload, onProgress) {
             var hasBuffers = false;
             var processBuffer = function (buf, buffer) {
                 BABYLON.GLTFFileLoaderExtension.LoadBufferAsync(gltfRuntime, buf, function (bufferView) {
@@ -1825,7 +1827,7 @@ var BABYLON;
         * Defines an override for loading buffers
         * Return true to stop further extensions from loading this buffer
         */
-        GLTFFileLoaderExtension.prototype.loadBufferAsync = function (gltfRuntime, id, onSuccess, onError) {
+        GLTFFileLoaderExtension.prototype.loadBufferAsync = function (gltfRuntime, id, onSuccess, onError, onProgress) {
             return false;
         };
         /**
@@ -1877,11 +1879,11 @@ var BABYLON;
                 });
             });
         };
-        GLTFFileLoaderExtension.LoadBufferAsync = function (gltfRuntime, id, onSuccess, onError) {
+        GLTFFileLoaderExtension.LoadBufferAsync = function (gltfRuntime, id, onSuccess, onError, onProgress) {
             GLTFFileLoaderExtension.ApplyExtensions(function (loaderExtension) {
-                return loaderExtension.loadBufferAsync(gltfRuntime, id, onSuccess, onError);
+                return loaderExtension.loadBufferAsync(gltfRuntime, id, onSuccess, onError, onProgress);
             }, function () {
-                BABYLON.GLTFFileLoaderBase.LoadBufferAsync(gltfRuntime, id, onSuccess, onError);
+                BABYLON.GLTFFileLoaderBase.LoadBufferAsync(gltfRuntime, id, onSuccess, onError, onProgress);
             });
         };
         GLTFFileLoaderExtension.LoadTextureAsync = function (gltfRuntime, id, onSuccess, onError) {
@@ -1932,11 +1934,16 @@ var BABYLON;
 //# sourceMappingURL=babylon.glTFFileLoaderExtension.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var BinaryExtensionBufferName = "binary_glTF";
@@ -2076,11 +2083,16 @@ var BABYLON;
 //# sourceMappingURL=babylon.glTFBinaryExtension.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     ;

dist/preview release/loaders/babylon.objFileLoader.js

@@ -83,6 +83,8 @@ var BABYLON;
                     else if (key === "d") {
                         //d is dissolve for current material. It mean alpha for BABYLON
                         material.alpha = value;
+                        //Texture
+                        //This part can be improved by adding the possible options of texture
                     }
                     else if (key === "map_ka") {
                         // ambient texture map with a loaded image
@@ -99,6 +101,13 @@ var BABYLON;
                         material.specularTexture = MTLFileLoader._getTexture(rootUrl, value, scene);
                     }
                     else if (key === "map_ns") {
+                        //Specular
+                        //Specular highlight component
+                        //We must first get the folder of the image
+                        //
+                        //Not supported by BABYLON
+                        //
+                        //    continue;
                     }
                     else if (key === "map_bump") {
                         //The bump texture
@@ -107,33 +116,46 @@ var BABYLON;
                     else if (key === "map_d") {
                         // The dissolve of the material
                         material.opacityTexture = MTLFileLoader._getTexture(rootUrl, value, scene);
+                        //Options for illumination
                     }
                     else if (key === "illum") {
                         //Illumination
                         if (value === "0") {
+                            //That mean Kd == Kd
                         }
                         else if (value === "1") {
+                            //Color on and Ambient on
                         }
                         else if (value === "2") {
+                            //Highlight on
                         }
                         else if (value === "3") {
+                            //Reflection on and Ray trace on
                         }
                         else if (value === "4") {
+                            //Transparency: Glass on, Reflection: Ray trace on
                         }
                         else if (value === "5") {
+                            //Reflection: Fresnel on and Ray trace on
                         }
                         else if (value === "6") {
+                            //Transparency: Refraction on, Reflection: Fresnel off and Ray trace on
                         }
                         else if (value === "7") {
+                            //Transparency: Refraction on, Reflection: Fresnel on and Ray trace on
                         }
                         else if (value === "8") {
+                            //Reflection on and Ray trace off
                         }
                         else if (value === "9") {
+                            //Transparency: Glass on, Reflection: Ray trace off
                         }
                         else if (value === "10") {
+                            //Casts shadows onto invisible surfaces
                         }
                     }
                     else {
+                        // console.log("Unhandled expression at line : " + i +'\n' + "with value : " + line);
                     }
                 }
                 //At the end of the file, add the last material
@@ -517,6 +539,7 @@ var BABYLON;
                 //Comment or newLine
                 if (line.length === 0 || line.charAt(0) === '#') {
                     continue;
+                    //Get information about one position possible for the vertices
                 }
                 else if ((result = this.vertexPattern.exec(line)) !== null) {
                     //Create a Vector3 with the position x, y, z
@@ -538,6 +561,8 @@ var BABYLON;
                     // ["vt 0.1 0.2 0.3", "0.1", "0.2"]
                     //Add the Vector in the list of uvs
                     uvs.push(new BABYLON.Vector2(parseFloat(result[1]), parseFloat(result[2])));
+                    //Identify patterns of faces
+                    //Face could be defined in different type of pattern
                 }
                 else if ((result = this.facePattern3.exec(line)) !== null) {
                     //Value of result:
@@ -566,6 +591,8 @@ var BABYLON;
                     //Set the data for this face
                     setDataForCurrentFaceWithPattern1(result[1].trim().split(" "), // ["1", "2", "3"]
                     1);
+                    //Define a mesh or an object
+                    //Each time this keyword is analysed, create a new Object with all data for creating a babylonMesh
                 }
                 else if (this.group.test(line) || this.obj.test(line)) {
                     //Create a new mesh corresponding to the name of the group.
@@ -587,6 +614,7 @@ var BABYLON;
                     hasMeshes = true;
                     isFirstMaterial = true;
                     increment = 1;
+                    //Keyword for applying a material
                 }
                 else if (this.usemtl.test(line)) {
                     //Get the name of the material
@@ -616,12 +644,17 @@ var BABYLON;
                         meshesFromObj[meshesFromObj.length - 1].materialName = materialNameFromObj;
                         isFirstMaterial = false;
                     }
+                    //Keyword for loading the mtl file
                 }
                 else if (this.mtllib.test(line)) {
                     //Get the name of mtl file
                     fileToLoad = line.substring(7).trim();
+                    //Apply smoothing
                 }
                 else if (this.smooth.test(line)) {
+                    // smooth shading => apply smoothing
+                    //Toda  y I don't know it work with babylon and with obj.
+                    //With the obj file  an integer is set
                 }
                 else {
                     //If there is another possibility

dist/preview release/materialsLibrary/babylon.customMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var CustomShaderHelper = (function () {

dist/preview release/materialsLibrary/babylon.fireMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.furMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.gradientMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -47,10 +52,10 @@ var BABYLON;
             _this.SHADOW2 = false;
             _this.SHADOW3 = false;
             _this.SHADOWS = false;
-            _this.SHADOWVSM0 = false;
-            _this.SHADOWVSM1 = false;
-            _this.SHADOWVSM2 = false;
-            _this.SHADOWVSM3 = false;
+            _this.SHADOWESM0 = false;
+            _this.SHADOWESM1 = false;
+            _this.SHADOWESM2 = false;
+            _this.SHADOWESM3 = false;
             _this.SHADOWPCF0 = false;
             _this.SHADOWPCF1 = false;
             _this.SHADOWPCF2 = false;

dist/preview release/materialsLibrary/babylon.gridMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.lavaMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -46,10 +51,10 @@ var BABYLON;
             _this.SHADOW2 = false;
             _this.SHADOW3 = false;
             _this.SHADOWS = false;
-            _this.SHADOWVSM0 = false;
-            _this.SHADOWVSM1 = false;
-            _this.SHADOWVSM2 = false;
-            _this.SHADOWVSM3 = false;
+            _this.SHADOWESM0 = false;
+            _this.SHADOWESM1 = false;
+            _this.SHADOWESM2 = false;
+            _this.SHADOWESM3 = false;
             _this.SHADOWPCF0 = false;
             _this.SHADOWPCF1 = false;
             _this.SHADOWPCF2 = false;

dist/preview release/materialsLibrary/babylon.normalMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -46,10 +51,10 @@ var BABYLON;
             _this.SHADOW2 = false;
             _this.SHADOW3 = false;
             _this.SHADOWS = false;
-            _this.SHADOWVSM0 = false;
-            _this.SHADOWVSM1 = false;
-            _this.SHADOWVSM2 = false;
-            _this.SHADOWVSM3 = false;
+            _this.SHADOWESM0 = false;
+            _this.SHADOWESM1 = false;
+            _this.SHADOWESM2 = false;
+            _this.SHADOWESM3 = false;
             _this.SHADOWPCF0 = false;
             _this.SHADOWPCF1 = false;
             _this.SHADOWPCF2 = false;

dist/preview release/materialsLibrary/babylon.shadowOnlyMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.simpleMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.skyMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.terrainMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.triPlanarMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/materialsLibrary/babylon.waterMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/postProcessesLibrary/babylon.asciiArtPostProcess.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/postProcessesLibrary/babylon.digitalRainPostProcess.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

dist/preview release/proceduralTexturesLibrary/babylon.brickProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var BrickProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.cloudProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var CloudProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.fireProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var FireProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.grassProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var GrassProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.marbleProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var MarbleProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.normalMapProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var NormalMapProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.roadProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var RoadProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.starfieldProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var StarfieldProceduralTexture = (function (_super) {

dist/preview release/proceduralTexturesLibrary/babylon.woodProceduralTexture.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var WoodProceduralTexture = (function (_super) {

dist/preview release/serializers/babylon.objSerializer.js

@@ -64,9 +64,15 @@ var BABYLON;
             }
             if (m.diffuseTexture) {
                 output.push("  map_Kd " + uvscale + m.diffuseTexture.name);
+                //TODO: alpha testing, opacity in diffuse texture alpha channel (diffuseTexture.hasAlpha -> map_d)
             }
             if (m.specularTexture) {
                 output.push("  map_Ks " + uvscale + m.specularTexture.name);
+                /* TODO: glossiness = specular highlight component is in alpha channel of specularTexture. (???)
+                if (m.useGlossinessFromSpecularMapAlpha)  {
+                    output.push("  map_Ns "+uvscale + m.specularTexture.name);
+                }
+                */
             }
             /* TODO: emissive texture not in .MAT format (???)
             if (m.emissiveTexture) {

dist/preview release/what's new.md

@@ -5,7 +5,7 @@
 ### Major updates
  - WebGL2 context support. WebGL2 is now used instead of WebGL 1 when available. [More info here](http://doc.babylonjs.com/overviews/webgl2) ([deltakosh](https://github.com/deltakosh))
  - Complete WebVR 1.1 support including controllers for HTC Vive and Occulus. [More info here](http://doc.babylonjs.com/overviews/webvr_camera) ([raanan](https://github.com/raananw))
- - Added support for Exponential Shadow maps to replace Variance Shadow maps. [more info here](http://www.babylonjs-playground.com/debug.html#1CXNXC#3) - [Demo](http://www.babylonjs.com/Demos/AdvancedShadows/) ([deltakosh](https://github.com/deltakosh))
+ - Added support for Exponential Shadow maps to replace Variance Shadow maps. [more info here](http://www.babylonjs-playground.com/debug.html#1CXNXC#3) - [Demo](http://www.babylonjs.com/Demos/AdvancedShadows/) - [Demo](http://www.babylonjs-playground.com/#1CXNXC#4) ([deltakosh](https://github.com/deltakosh))
  - Support for [Vertex Array Objects](https://www.opengl.org/registry/specs/ARB/vertex_array_object.txt) ([deltakosh](https://github.com/deltakosh))
  - Support for multisample render targets. [Demo](http://www.babylonjs-playground.com/#12MKMN) ([deltakosh](https://github.com/deltakosh))
  - New Unity 5 Editor Toolkit. Complete pipeline integration [Doc](TODO) - ([MackeyK24](https://github.com/MackeyK24))

inspector/index.html

@@ -1,79 +1,55 @@
 <!DOCTYPE html>
 <html>
+
 <head>
     <title>Inspector - test</title>
-    <meta charset='utf-8'/>
+    <meta charset='utf-8' />
     <meta name="viewport" content="width=device-width, user-scalable=no">
 
     <!--Babylon-->
-	<script src="../tools/DevLoader/BabylonLoader.js"></script>
+    <script src="../tools/DevLoader/BabylonLoader.js"></script>
 
     <style>
-        
-        html, body {
+        html,
+        body {
             width: 100%;
-            height:100%;
-            margin:0;
-            padding:0;
-            overflow:hidden;
-            font-family:sans-serif;
-        }
-
-        /* First try : PG-like */
-        /*#game-canvas {
-            width:75%;
-            height:100%; 
-            top:0;
-            left:0;
+            height: 100%;
+            padding: 0;
+            margin: 0
         }
-        .fakeToolbar {
-            height:150px;
-            background-color: #333;
-        }
-        .mini {
-            display:flex;
-            height:calc(100% - 150px);
+        
+        #wrapper {
+            width: 100%;
+            height: 100%;
+            display: flex;
+            overflow: hidden;
         }
-        .fakeBarAgain {
-            width:50%;
-            background-color: #333;
-        }*/
         
-        /*Second : sandbox like*/
-        #game-canvas {
-            position:absolute;
-            width:100%;
-            height:100%; 
-            top:0;
+        canvas {
+            width: 75%;
         }
-        .fakeFooter {
-            position:absolute;
-            width:100%;
-            height:50px;
-            background-color: #333;
-            bottom: 0;
+        
+        #inspector {
+            width: 25%;
         }
-
     </style>
 
 </head>
+
 <body>
-    
-    <!-- First try : PG-like 
-    <div class="fakeToolbar"></div>
-    <div class="mini">
-        <div class="fakeBarAgain"></div>
-        <canvas id="game-canvas"></canvas> 
-    </div>-->
-    <!--Second try : Sandbox-like -->
-    <canvas id="game-canvas"></canvas>
-    <div class="fakeFooter"></div>
+
+    <div id="wrapper">
+        <canvas id='game-canvas'></canvas>
+        <div id="inspector"></div>
+    </div>
+
 
     <!--Starting the game-->
     <script>
-        BABYLONDEVTOOLS.Loader.require("test/index.js").load(function() {
+        BABYLONDEVTOOLS.Loader.require("test/index.js").load(function () {
             new Test('game-canvas');
-	    });
-	</script>
+        });
+    </script>
 </body>
+
 </html>

inspector/sass/defines.scss

@@ -3,6 +3,11 @@
 
 $font               : 'Inconsolata', sans-serif;
 
+// ------------- //
+// If you update these colors, you should also 
+// replace them in the class Inspector as well, 
+// as it's used for custom themes
+// ------------- //
 
 $color              : #ccc;
 $background         : #242424;

inspector/sass/main.scss

@@ -18,6 +18,7 @@
   display:flex;
   font-size:0.9em;
   font-family     : $font;
+  background-color: $background;
 
   // The panel containing the two subpanel : tree and details
   .insp-right-panel {

inspector/src/Inspector.ts

@@ -30,7 +30,15 @@ module INSPECTOR {
          * If the parameter 'popup' is false, the inspector is created as a right panel on the main window.
          * If the parameter 'popup' is true, the inspector is created in another popup.
          */
-        constructor(scene: BABYLON.Scene, popup?: boolean, initialTab?: number, parentElement?: HTMLElement) {
+        constructor(scene: BABYLON.Scene, popup?: boolean, initialTab?: number, parentElement?: HTMLElement, newColors?: {
+            backgroundColor?: string,
+            backgroundColorLighter?: string,
+            backgroundColorLighter2?: string,
+            backgroundColorLighter3?: string,
+            color?: string,
+            colorTop?: string,
+            colorBot?: string
+        }) {
 
             //get Tabbar initialTab
             this._initialTab = initialTab;
@@ -87,96 +95,93 @@ module INSPECTOR {
 
                 };
 
-                // Create c2di wrapper
-                this._c2diwrapper = Helpers.CreateDiv('insp-wrapper');
-
-                // copy style from canvas to wrapper
-                for (let prop in this._canvasStyle) {
-                    this._c2diwrapper.style[prop] = this._canvasStyle[prop];
-                }
-
-                // Convert wrapper size in % (because getComputedStyle returns px only)
-                let widthPx = parseFloat(canvasComputedStyle.width.substr(0, canvasComputedStyle.width.length - 2)) || 0;
-                let heightPx = parseFloat(canvasComputedStyle.height.substr(0, canvasComputedStyle.height.length - 2)) || 0;
+                if (this._parentElement) {
+                    // Build the inspector wrapper
+                    this._c2diwrapper = Helpers.CreateDiv('insp-wrapper', this._parentElement);
+                    this._c2diwrapper.style.width = '100%';
+                    this._c2diwrapper.style.height = '100%';
+                    this._c2diwrapper.style.paddingLeft = '5px';
+
+                    // add inspector     
+                    let inspector = Helpers.CreateDiv('insp-right-panel', this._c2diwrapper);
+                    inspector.style.width = '100%';
+                    inspector.style.height = '100%';
+                    // and build it in the popup  
+                    this._buildInspector(inspector);
+                } else {
+                    // Create c2di wrapper
+                    this._c2diwrapper = Helpers.CreateDiv('insp-wrapper');
 
-                // If the canvas position is absolute, restrain the wrapper width to the window width + left positionning
-                if (canvasComputedStyle.position === "absolute" || canvasComputedStyle.position === "relative") {
-                    // compute only left as it takes predominance if right is also specified (and it will be for the wrapper)
-                    let leftPx = parseFloat(canvasComputedStyle.left.substr(0, canvasComputedStyle.left.length - 2)) || 0;
-                    if (widthPx + leftPx >= Inspector.WINDOW.innerWidth) {
-                        this._c2diwrapper.style.maxWidth = `${widthPx - leftPx}px`;
+                    // copy style from canvas to wrapper
+                    for (let prop in this._canvasStyle) {
+                        this._c2diwrapper.style[prop] = this._canvasStyle[prop];
                     }
-                }
-
-                // Check if the parent of the canvas is the body page. If yes, the size ratio is computed
-                let parent = this._getRelativeParent(canvas);
 
-                let parentWidthPx = parent.clientWidth;
-                let parentHeightPx = parent.clientHeight;
+                    // Convert wrapper size in % (because getComputedStyle returns px only)
+                    let widthPx = parseFloat(canvasComputedStyle.width.substr(0, canvasComputedStyle.width.length - 2)) || 0;
+                    let heightPx = parseFloat(canvasComputedStyle.height.substr(0, canvasComputedStyle.height.length - 2)) || 0;
 
-                let pWidth = widthPx / parentWidthPx * 100;
-                let pheight = heightPx / parentHeightPx * 100;
-
-                this._c2diwrapper.style.width = pWidth + "%";
-                this._c2diwrapper.style.height = pheight + "%";
-
-                // reset canvas style
-                canvas.style.position = "static";
-                canvas.style.width = "100%";
-                canvas.style.height = "100%";
-                canvas.style.paddingBottom = "0";
-                canvas.style.paddingLeft = "0";
-                canvas.style.paddingTop = "0";
-                canvas.style.paddingRight = "0";
-
-                canvas.style.margin = "0";
-                canvas.style.marginBottom = "0";
-                canvas.style.marginLeft = "0";
-                canvas.style.marginTop = "0";
-                canvas.style.marginRight = "0";
-
-
-                // Replace canvas with the wrapper...
-                // if (this._parentElement) {
-                //     canvasParent.replaceChild(this._parentElement, canvas);
-                //     this._parentElement.appendChild(canvas);
-                // }
-                // else {
-                canvasParent.replaceChild(this._c2diwrapper, canvas);
-                // ... and add canvas to the wrapper
-                this._c2diwrapper.appendChild(canvas);
-                // }
-
-
-
-                // add inspector
-                let inspector;
-                if (this._parentElement) {
-                    this._c2diwrapper.appendChild(this._parentElement);
-                    inspector = Helpers.CreateDiv('insp-right-panel', this._parentElement);
-                    inspector.style.width = '100%';
-                    inspector.style.height = '100%';
-                }
-                else {
-                    inspector = Helpers.CreateDiv('insp-right-panel', this._c2diwrapper);
-                }
+                    // If the canvas position is absolute, restrain the wrapper width to the window width + left positionning
+                    if (canvasComputedStyle.position === "absolute" || canvasComputedStyle.position === "relative") {
+                        // compute only left as it takes predominance if right is also specified (and it will be for the wrapper)
+                        let leftPx = parseFloat(canvasComputedStyle.left.substr(0, canvasComputedStyle.left.length - 2)) || 0;
+                        if (widthPx + leftPx >= Inspector.WINDOW.innerWidth) {
+                            this._c2diwrapper.style.maxWidth = `${widthPx - leftPx}px`;
+                        }
+                    }
 
-                // Add split bar
-                if (!this._parentElement) {
-                    Split([canvas, inspector], {
-                        direction: 'horizontal',
-                        sizes: [75, 25],
-                        onDrag: () => {
-                            Helpers.SEND_EVENT('resize');
-                            if (this._tabbar) {
-                                this._tabbar.updateWidth()
+                    // Check if the parent of the canvas is the body page. If yes, the size ratio is computed
+                    let parent = this._getRelativeParent(canvas);
+
+                    let parentWidthPx = parent.clientWidth;
+                    let parentHeightPx = parent.clientHeight;
+
+                    let pWidth = widthPx / parentWidthPx * 100;
+                    let pheight = heightPx / parentHeightPx * 100;
+
+                    this._c2diwrapper.style.width = pWidth + "%";
+                    this._c2diwrapper.style.height = pheight + "%";
+
+                    // reset canvas style
+                    canvas.style.position = "static";
+                    canvas.style.width = "100%";
+                    canvas.style.height = "100%";
+                    canvas.style.paddingBottom = "0";
+                    canvas.style.paddingLeft = "0";
+                    canvas.style.paddingTop = "0";
+                    canvas.style.paddingRight = "0";
+
+                    canvas.style.margin = "0";
+                    canvas.style.marginBottom = "0";
+                    canvas.style.marginLeft = "0";
+                    canvas.style.marginTop = "0";
+                    canvas.style.marginRight = "0";
+
+                    // Replace canvas with the wrapper...
+                    canvasParent.replaceChild(this._c2diwrapper, canvas);
+                    // ... and add canvas to the wrapper
+                    this._c2diwrapper.appendChild(canvas);
+
+                    // add inspector
+                    let inspector = Helpers.CreateDiv('insp-right-panel', this._c2diwrapper);
+
+                    // Add split bar
+                    if (!this._parentElement) {
+                        Split([canvas, inspector], {
+                            direction: 'horizontal',
+                            sizes: [75, 25],
+                            onDrag: () => {
+                                Helpers.SEND_EVENT('resize');
+                                if (this._tabbar) {
+                                    this._tabbar.updateWidth()
+                                }
                             }
-                        }
-                    });
-                }
+                        });
+                    }
 
-                // Build the inspector
-                this._buildInspector(inspector);
+                    // Build the inspector
+                    this._buildInspector(inspector);
+                }
                 // Send resize event to the window
                 Helpers.SEND_EVENT('resize');
                 this._tabbar.updateWidth();
@@ -186,6 +191,36 @@ module INSPECTOR {
             if (!Helpers.IsBrowserEdge()) {
                 this.refresh();
             }
+
+            // Check custom css colors
+            if (newColors) {
+
+                let bColor = newColors.backgroundColor || '#242424';
+                let bColorl1 = newColors.backgroundColorLighter || '#2c2c2c';
+                let bColorl2 = newColors.backgroundColorLighter2 || '#383838';
+                let bColorl3 = newColors.backgroundColorLighter3 || '#454545';
+
+                let color = newColors.color || '#ccc';
+                let colorTop = newColors.colorTop || '#f29766';
+                let colorBot = newColors.colorBot || '#5db0d7';
+
+                let styles = Inspector.DOCUMENT.querySelectorAll('style');
+                for (let s = 0; s < styles.length; s++) {
+                    let style = styles[s];
+
+                    if (style.innerHTML.indexOf('insp-wrapper') != -1) {
+
+                        styles[s].innerHTML = styles[s].innerHTML
+                            .replace(/#242424/g, bColor) // background color
+                            .replace(/#2c2c2c/g, bColorl1) // background-lighter
+                            .replace(/#383838/g, bColorl2) // background-lighter2
+                            .replace(/#454545/g, bColorl3) // background-lighter3
+                            .replace(/#ccc/g, color) // color
+                            .replace(/#f29766/g, colorTop) // color-top
+                            .replace(/#5db0d7/g, colorBot) // color-bot
+                    }
+                }
+            }
         }
 
         /**

inspector/src/adapters/Canvas2DAdapter.ts

@@ -1,29 +1,29 @@
 module INSPECTOR {
-    
-    export class Canvas2DAdapter 
-        extends Adapter 
+
+    export class Canvas2DAdapter
+        extends Adapter
         implements IToolVisible, IToolDebug {
-        
-        constructor(obj:any) {
+
+        constructor(obj: any) {
             super(obj);
         }
-        
+
         /** Returns the name displayed in the tree */
-        public id() : string {
+        public id(): string {
             let str = '';
             if (this._obj.id) {
                 str = this._obj.id;
             } // otherwise nothing displayed        
             return str;
         }
-        
+
         /** Returns the type of this object - displayed in the tree */
-        public type() : string{
+        public type(): string {
             return Helpers.GET_TYPE(this._obj);
         }
-        
+
         /** Returns the list of properties to be displayed for this adapter */
-        public getProperties() : Array<PropertyLine> {
+        public getProperties(): Array<PropertyLine> {
             let propertiesLines = [];
             if (this._obj.propDic) {
                 let dico = this._obj.propDic as BABYLON.StringDictionary<BABYLON.Prim2DPropInfo>;
@@ -31,42 +31,42 @@ module INSPECTOR {
                     let property = new Property(name, this.actualObject);
                     propertiesLines.push(new PropertyLine(property));
                 });
-            }            
+            }
             // TODO REMOVE THIS WHEN PROPERTIES WILL BE DECORATED
             let toAddDirty = [
-                'actualZOffset', 'isSizeAuto', 'layoutArea', 'layoutAreaPos', 'contentArea', 
-                'marginOffset', 'paddingOffset', 'isPickable', 'isContainer', 'boundingInfo', 
-                'levelBoundingInfo', 'isSizedByContent', 'isPositionAuto', 'actualScale', 'layoutBoundingInfo', 
-                '_cachedTexture'];
+                'actualZOffset', 'isSizeAuto', 'layoutArea', 'layoutAreaPos', 'contentArea',
+                'marginOffset', 'paddingOffset', 'isPickable', 'isContainer', 'boundingInfo',
+                'levelBoundingInfo', 'isSizedByContent', 'isPositionAuto', 'actualScale', 'layoutBoundingInfo',
+                '_cachedTexture', 'actualOpacity'];
             for (let dirty of toAddDirty) {
                 let infos = new Property(dirty, this.actualObject);
                 propertiesLines.push(new PropertyLine(infos));
             }
-            return propertiesLines; 
+            return propertiesLines;
         }
 
-        public getTools() : Array<AbstractTreeTool> {
+        public getTools(): Array<AbstractTreeTool> {
             let tools = [];
             tools.push(new Checkbox(this));
-            tools.push(new DebugArea(this));   
+            tools.push(new DebugArea(this));
             return tools;
         }
 
         /// TOOLS ///
-        public setVisible(b:boolean) {
+        public setVisible(b: boolean) {
             this._obj.levelVisible = b;
         }
-        public isVisible():boolean{
+        public isVisible(): boolean {
             return this._obj.levelVisible;
         }
         /** Overrides super */
-        public debug(b:boolean) {
+        public debug(b: boolean) {
             this._obj["displayDebugAreas"] = b;
         }
         /** Overrides super.highlight */
-        public highlight(b:boolean) {
+        public highlight(b: boolean) {
         }
-        
-        
+
+
     }
 }

inspector/src/helpers/Helpers.ts

@@ -1,15 +1,15 @@
 module INSPECTOR {
     export class Helpers {
-        
-        
+
+
         /** 
          * Returns the type of the given object. First
          * uses getClassName. If nothing is returned, used the type of the constructor
          */
-        public static GET_TYPE(obj:any) : string{
+        public static GET_TYPE(obj: any): string {
             if (obj != null && obj != undefined) {
                 let classname = BABYLON.Tools.getClassName(obj);
-                if (!classname || classname === 'object'){
+                if (!classname || classname === 'object') {
                     classname = obj.constructor.name;
                     // classname is undefined in IE11
                     if (!classname) {
@@ -25,22 +25,22 @@ module INSPECTOR {
                 return 'type_not_defined';
             }
         }
-        
+
         /**
          * Check if some properties are defined for the given type.
          */
-        private static _CheckIfTypeExists(type:string) {
+        private static _CheckIfTypeExists(type: string) {
             let properties = PROPERTIES[type];
             if (properties) {
                 return true;
-            } 
+            }
             return false;
         }
-        
+
         /**
          * Returns true if the user browser is edge.
          */
-        public static IsBrowserEdge() : boolean {
+        public static IsBrowserEdge(): boolean {
             //Detect if we are running on a faulty buggy OS.
             var regexp = /Edge/
             return regexp.test(navigator.userAgent);
@@ -51,7 +51,7 @@ module INSPECTOR {
          * is in PROPERTIES constant.
          * Returns 'Undefined' if no type exists for this object
          */
-        private static _GetTypeFor(obj:any) {
+        private static _GetTypeFor(obj: any) {
             for (let type in PROPERTIES) {
                 let typeBlock = PROPERTIES[type];
                 if (typeBlock.type) {
@@ -70,9 +70,9 @@ module INSPECTOR {
             var s = f && ((fn.name && ['', fn.name]) || fn.toString().match(/function ([^\(]+)/));
             return (!f && 'not a function') || (s && s[1] || 'anonymous');
         }
-        
+
         /** Send the event which name is given in parameter to the window */
-        public static SEND_EVENT(eventName:string){
+        public static SEND_EVENT(eventName: string) {
             let event;
             if (Inspector.DOCUMENT.createEvent) {
                 event = Inspector.DOCUMENT.createEvent('HTMLEvents');
@@ -82,25 +82,25 @@ module INSPECTOR {
             }
             window.dispatchEvent(event);
         }
-        
+
         /** Returns the given number with 2 decimal number max if a decimal part exists */
-        public static Trunc(nb) :number {
-            if(Math.round(nb) !== nb) {
+        public static Trunc(nb): number {
+            if (Math.round(nb) !== nb) {
                 return nb.toFixed(2);
             }
             return nb;
         };
-        
+
         /**
          * Useful function used to create a div
          */
-        public static CreateDiv(className?:string, parent?: HTMLElement) : HTMLElement{
+        public static CreateDiv(className?: string, parent?: HTMLElement): HTMLElement {
             return Helpers.CreateElement('div', className, parent);
         }
-        
-        public static CreateElement(element:string, className?:string, parent?: HTMLElement) : HTMLElement{
+
+        public static CreateElement(element: string, className?: string, parent?: HTMLElement): HTMLElement {
             let elem = Inspector.DOCUMENT.createElement(element);
-            
+
             if (className) {
                 elem.className = className;
             }
@@ -109,12 +109,12 @@ module INSPECTOR {
             }
             return elem;
         }
-        
+
         /**
          * Removes all children of the given div.
          */
-        public static CleanDiv(div:HTMLElement) {
-            while ( div.firstChild ) {
+        public static CleanDiv(div: HTMLElement) {
+            while (div.firstChild) {
                 div.removeChild(div.firstChild);
             }
         }
@@ -122,7 +122,7 @@ module INSPECTOR {
         /**
          * Returns the true value of the given CSS Attribute from the given element (in percentage or in pixel, as it was specified in the css)
          */
-        public static Css(elem:HTMLElement, cssAttribute:string) : string{
+        public static Css(elem: HTMLElement, cssAttribute: string): string {
             let clone = elem.cloneNode(true) as HTMLElement;
             let div = Helpers.CreateDiv('', Inspector.DOCUMENT.body);
             div.style.display = 'none';
@@ -131,17 +131,17 @@ module INSPECTOR {
             div.parentNode.removeChild(div);
             return value;
         }
-        
+
         public static LoadScript() {
             BABYLON.Tools.LoadFile("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.7.0/highlight.min.js", (elem) => {
                 let script = Helpers.CreateElement('script', '', Inspector.DOCUMENT.body);
-                script.textContent = elem;                
-                
+                script.textContent = elem;
+
                 // Load glsl detection
                 BABYLON.Tools.LoadFile("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.7.0/languages/glsl.min.js", (elem) => {
                     let script = Helpers.CreateElement('script', '', Inspector.DOCUMENT.body);
-                    script.textContent = elem;                    
-                    
+                    script.textContent = elem;
+
                     // Load css style
                     BABYLON.Tools.LoadFile("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.7.0/styles/zenburn.min.css", (elem) => {
                         let style = Helpers.CreateElement('style', '', Inspector.DOCUMENT.body);
@@ -149,19 +149,19 @@ module INSPECTOR {
                     });
                 }, null, null, null, () => {
                     console.log("erreur");
-                });      
-                
+                });
+
             }, null, null, null, () => {
                 console.log("erreur");
             });
-            
+
         }
 
         public static IsSystemName(name: string): boolean {
-            if (name==null) {
+            if (name == null) {
                 return false;
             }
-            return name.indexOf("###")===0 && name.lastIndexOf("###")===(name.length-3);
+            return name.indexOf("###") === 0 && name.lastIndexOf("###") === (name.length - 3);
         }
     }
 }

inspector/src/properties.ts

@@ -315,8 +315,97 @@ module INSPECTOR {
                 'cameraColorGradingTexture',
                 'cameraColorCurves'
             ]
+        },
+        'Canvas2D': {
+            type: BABYLON.Canvas2D
+        },
+        'Canvas2DEngineBoundData': {
+            type: BABYLON.Canvas2DEngineBoundData
+        },
+        'Ellipse2D': {
+            type: BABYLON.Ellipse2D
+        },
+        'Ellipse2DInstanceData': {
+            type: BABYLON.Ellipse2DInstanceData
+        },
+        'Ellipse2DRenderCache': {
+            type: BABYLON.Ellipse2DRenderCache
+        },
+        'Group2D': {
+            type: BABYLON.Group2D
+        },
+        'IntersectInfo2D': {
+            type: BABYLON.IntersectInfo2D
+        },
+        'Lines2D': {
+            type: BABYLON.Lines2D
+        },
+        'Lines2DInstanceData': {
+            type: BABYLON.Lines2DInstanceData
+        },
+        'Lines2DRenderCache': {
+            type: BABYLON.Lines2DRenderCache
+        },
+        'PrepareRender2DContext': {
+            type: BABYLON.PrepareRender2DContext
+        },
+        'Prim2DBase': {
+            type: BABYLON.Prim2DBase
+        },
+        'Prim2DClassInfo': {
+            type: BABYLON.Prim2DClassInfo
+        },
+        'Prim2DPropInfo': {
+            type: BABYLON.Prim2DPropInfo
+        },
+        'Rectangle2D': {
+            type: BABYLON.Rectangle2D
+        },
+        'Rectangle2DInstanceData': {
+            type: BABYLON.Rectangle2DInstanceData
+        },
+        'Rectangle2DRenderCache': {
+            type: BABYLON.Rectangle2DRenderCache
+        },
+        'Render2DContext': {
+            type: BABYLON.Render2DContext
+        },
+        'RenderablePrim2D': {
+            type: BABYLON.RenderablePrim2D
+        },
+        'ScreenSpaceCanvas2D': {
+            type: BABYLON.ScreenSpaceCanvas2D
+        },
+        'Shape2D': {
+            type: BABYLON.Shape2D
+        },
+        'Shape2DInstanceData': {
+            type: BABYLON.Shape2DInstanceData
+        },
+        'Sprite2D': {
+            type: BABYLON.Sprite2D
+        },
+        'Sprite2DInstanceData': {
+            type: BABYLON.Sprite2DInstanceData
+        },
+        'Sprite2DRenderCache': {
+            type: BABYLON.Sprite2DRenderCache
+        },
+        'Text2D': {
+            type: BABYLON.Text2D
+        },
+        'Text2DInstanceData': {
+            type: BABYLON.Text2DInstanceData
+        },
+        'Text2DRenderCache': {
+            type: BABYLON.Text2DRenderCache
+        },
+        'WorldSpaceCanvas2D': {
+            type: BABYLON.WorldSpaceCanvas2D
+        },
+        'WorldSpaceCanvas2DNode': {
+            type: BABYLON.WorldSpaceCanvas2DNode
         }
-
     }
 
 }

inspector/test/index.js

@@ -16,7 +16,17 @@ var Test = (function () {
     Test.prototype._run = function () {
         var _this = this;
         this._initScene();
-        this.scene.debugLayer.show({ popup: false, initialTab: 4 });
+        this.scene.debugLayer.show({
+            popup: false,
+            parentElement: document.getElementById('inspector'),
+            newColors: {
+                backgroundColor: '#eee',
+                backgroundColorLighter: '#fff',
+                backgroundColorLighter2: '#fff',
+                backgroundColorLighter3: '#fff',
+                color: '#333'
+            }
+        });
         this.scene.executeWhenReady(function () {
             _this._initGame();
             _this.engine.runRenderLoop(function () {

loaders/src/glTF/babylon.glTFFileLoader.ts

@@ -934,7 +934,7 @@ module BABYLON {
                 var translation = node.translation || [0, 0, 0];
                 var rotation = node.rotation || [0, 0, 0, 1];
                 var scale = node.scale || [1, 1, 1];
-                configureNode(lastNode, Vector3.FromArray(translation), Quaternion.FromArray(rotation), Vector3.FromArray(scale));
+                configureNode(lastNode, Vector3.FromArray(translation), Quaternion.FromArray(rotation), Vector3.FromArray(scale));
             }
 
             lastNode.updateCache(true);
@@ -1293,14 +1293,14 @@ module BABYLON {
             return gltfRuntime;
         }
 
-        public static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void): void {
+        public static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): void {
             var buffer: IGLTFBuffer = gltfRuntime.buffers[id];
 
             if (GLTFUtils.IsBase64(buffer.uri)) {
                 setTimeout(() => onSuccess(new Uint8Array(GLTFUtils.DecodeBase64(buffer.uri))));
             }
             else {
-                Tools.LoadFile(gltfRuntime.rootUrl + buffer.uri, data => onSuccess(new Uint8Array(data)), null, null, true, onError);
+                Tools.LoadFile(gltfRuntime.rootUrl + buffer.uri, data => onSuccess(new Uint8Array(data)), onProgress, null, true, onError);
             }
         }
 
@@ -1560,7 +1560,7 @@ module BABYLON {
         /**
         * Import meshes
         */
-        public importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onSuccess?: (meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[]) => void, onError?: () => void): boolean {
+        public importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onSuccess?: (meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[]) => void, onError?: () => void, onProgress?: () => void): boolean {
             scene.useRightHandedSystem = true;
 
             var gltfRuntime = GLTFFileLoaderExtension.LoadRuntimeAsync(scene, data, rootUrl, gltfRuntime => {
@@ -1613,7 +1613,8 @@ module BABYLON {
                             onSuccess(meshes, null, skeletons);
                         }
                     });
-                });
+                },
+                onProgress);
 
                 if (GLTFFileLoader.IncrementalLoading && onSuccess) {
                     onSuccess(meshes, null, skeletons);
@@ -1626,7 +1627,7 @@ module BABYLON {
         /**
         * Load scene
         */
-        public loadAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onSuccess: () => void, onError: () => void): boolean {
+        public loadAsync(scene: Scene, data: string, rootUrl: string, onSuccess: () => void, onError: () => void): boolean {
             scene.useRightHandedSystem = true;
 
             GLTFFileLoaderExtension.LoadRuntimeAsync(scene, data, rootUrl, gltfRuntime => {
@@ -1692,7 +1693,7 @@ module BABYLON {
             }
         };
 
-        private _loadBuffersAsync(gltfRuntime: IGLTFRuntime, onload: () => void): void {
+        private _loadBuffersAsync(gltfRuntime: IGLTFRuntime, onload: () => void, onProgress?: () => void): void {
             var hasBuffers = false;
 
             var processBuffer = (buf: string, buffer: IGLTFBuffer) => {

loaders/src/glTF/babylon.glTFFileLoaderExtension.ts

@@ -32,7 +32,7 @@ module BABYLON {
         * Defines an override for loading buffers
         * Return true to stop further extensions from loading this buffer
         */
-        public loadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void): boolean {
+        public loadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (buffer: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): boolean {
             return false;
         }
 
@@ -92,11 +92,11 @@ module BABYLON {
             });
         }
 
-        public static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (bufferView: ArrayBufferView) => void, onError: () => void): void {
+        public static LoadBufferAsync(gltfRuntime: IGLTFRuntime, id: string, onSuccess: (bufferView: ArrayBufferView) => void, onError: () => void, onProgress?: () => void): void {
             GLTFFileLoaderExtension.ApplyExtensions(loaderExtension => {
-                return loaderExtension.loadBufferAsync(gltfRuntime, id, onSuccess, onError);
+                return loaderExtension.loadBufferAsync(gltfRuntime, id, onSuccess, onError, onProgress);
             }, () => {
-                GLTFFileLoaderBase.LoadBufferAsync(gltfRuntime, id, onSuccess, onError);
+                GLTFFileLoaderBase.LoadBufferAsync(gltfRuntime, id, onSuccess, onError, onProgress);
             });
         }
 

materialsLibrary/src/custom/babylon.customMaterial.js

@@ -1,9 +1,14 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-var __extends = (this && this.__extends) || function (d, b) {
-    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var BABYLON;
 (function (BABYLON) {
     var CustomShaderHelper = (function () {

src/Debug/babylon.debugLayer.ts

@@ -14,12 +14,25 @@ module BABYLON {
         }
 
         /** Creates the inspector window. */
-        private _createInspector(config: { popup?: boolean, initialTab?: number, parentElement?: HTMLElement } = {}) {
+        private _createInspector(config: {
+            popup?: boolean,
+            initialTab?: number,
+            parentElement?: HTMLElement,
+            newColors?: {
+                backgroundColor?: string,
+                backgroundColorLighter?: string,
+                backgroundColorLighter2?: string,
+                backgroundColorLighter3?: string,
+                color?: string,
+                colorTop?: string,
+                colorBot?: string
+            }
+        } = {}) {
             let popup = config.popup || false;
             let initialTab = config.initialTab || 0;
             let parentElement = config.parentElement || null;
             if (!this._inspector) {
-                this._inspector = new INSPECTOR.Inspector(this._scene, popup, initialTab, parentElement);
+                this._inspector = new INSPECTOR.Inspector(this._scene, popup, initialTab, parentElement, config.newColors);
             } // else nothing to do,; instance is already existing
         }
 
@@ -37,7 +50,20 @@ module BABYLON {
             }
         }
 
-        public show(config: { popup?: boolean, initialTab?: number, parentElement?: HTMLElement } = {}) {
+        public show(config: {
+            popup?: boolean,
+            initialTab?: number,
+            parentElement?: HTMLElement,
+            newColors?: {
+                backgroundColor?: string,
+                backgroundColorLighter?: string,
+                backgroundColorLighter2?: string,
+                backgroundColorLighter3?: string,
+                color?: string,
+                colorTop?: string,
+                colorBot?: string
+            }
+        } = {}) {
             if (typeof INSPECTOR == 'undefined') {
                 // Load inspector and add it to the DOM
                 Tools.LoadScript(DebugLayer.InspectorURL, this._createInspector.bind(this, config));