Merge remote-tracking branch 'BabylonJS/master'

Exporters/3ds Max/BabylonExport.Entities/BabylonPBRMetallicRoughnessMaterial.cs

@@ -5,6 +5,14 @@ namespace BabylonExport.Entities
     [DataContract]
     public class BabylonPBRMetallicRoughnessMaterial : BabylonMaterial
     {
+        public enum TransparencyMode
+        {
+            OPAQUE = 0,
+            ALPHATEST = 1,
+            ALPHABLEND = 2,
+            ALPHATESTANDBLEND = 3
+        }
+
         [DataMember]
         public string customType { get; private set; }
 
@@ -51,7 +59,7 @@ namespace BabylonExport.Entities
         public float occlusionStrength { get; set; }
 
         [DataMember]
-        public BabylonTexture occlusionTexture { get; set; }
+        public BabylonTexture occlusionTexture { get; set; } // ignored
 
         [DataMember]
         public float alphaCutOff { get; set; }
@@ -60,7 +68,7 @@ namespace BabylonExport.Entities
         public int transparencyMode { get; set; }
 
         [DataMember]
-        public bool doubleSided { get; set; }
+        public bool doubleSided { get; set; } // ignored
 
         public BabylonPBRMetallicRoughnessMaterial() : base()
         {
@@ -70,7 +78,7 @@ namespace BabylonExport.Entities
             emissiveColor = new[] { 0f, 0f, 0f };
             occlusionStrength = 1.0f;
             alphaCutOff = 0.4f;
-            transparencyMode = 0;
+            transparencyMode = (int)TransparencyMode.OPAQUE;
         }
     }
 }

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.GLTFExporter.AbstractMesh.cs

@@ -31,9 +31,6 @@ namespace Max2Babylon
 
             // Transform
             gltfNode.translation = babylonAbstractMesh.position;
-            // TODO - Choose between this method and the extra root node
-            // Switch from left to right handed coordinate system
-            //gltfNode.translation[0] *= -1;
             if (babylonAbstractMesh.rotationQuaternion != null)
             {
                 gltfNode.rotation = babylonAbstractMesh.rotationQuaternion;

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.GLTFExporter.Camera.cs

@@ -5,7 +5,6 @@ namespace Max2Babylon
 {
     partial class BabylonExporter
     {
-        // TODO - Test if ok with a gltf viewer working with custom camera (babylon loader/sandbox doesn't load them)
         private GLTFCamera ExportCamera(BabylonCamera babylonCamera, GLTF gltf, GLTFNode gltfParentNode)
         {
             RaiseMessage("GLTFExporter.Camera | Export camera named: " + babylonCamera.name, 1);
@@ -37,8 +36,6 @@ namespace Max2Babylon
 
             // Transform
             gltfNode.translation = babylonCamera.position;
-            // Switch from left to right handed coordinate system
-            //gltfNode.translation[0] *= -1;
             if (babylonCamera.rotationQuaternion != null)
             {
                 gltfNode.rotation = babylonCamera.rotationQuaternion;
@@ -85,8 +82,8 @@ namespace Max2Babylon
             {
                 case (BabylonCamera.CameraMode.ORTHOGRAPHIC_CAMERA):
                     var gltfCameraOrthographic = new GLTFCameraOrthographic();
-                    gltfCameraOrthographic.xmag = 1; // TODO - How to retreive value from babylon? xmag:The floating-point horizontal magnification of the view
-                    gltfCameraOrthographic.ymag = 1; // TODO - How to retreive value from babylon? ymag:The floating-point vertical magnification of the view
+                    gltfCameraOrthographic.xmag = 1; // Do not bother about it - still mandatory
+                    gltfCameraOrthographic.ymag = 1; // Do not bother about it - still mandatory
                     gltfCameraOrthographic.zfar = babylonCamera.maxZ;
                     gltfCameraOrthographic.znear = babylonCamera.minZ;
 
@@ -95,8 +92,8 @@ namespace Max2Babylon
                     break;
                 case (BabylonCamera.CameraMode.PERSPECTIVE_CAMERA):
                     var gltfCameraPerspective = new GLTFCameraPerspective();
-                    gltfCameraPerspective.aspectRatio = null; // 0.8f; // TODO - How to retreive value from babylon? The aspect ratio in babylon is computed based on the engine rather than set on a camera (aspectRatio = _gl.drawingBufferWidth / _gl.drawingBufferHeight)
-                    gltfCameraPerspective.yfov = babylonCamera.fov; // WARNING - Babylon camera fov mode is assumed to be vertical (FOVMODE_VERTICAL_FIXED)
+                    gltfCameraPerspective.aspectRatio = null; // Do not bother about it - use default glTF value
+                    gltfCameraPerspective.yfov = babylonCamera.fov; // Babylon camera fov mode is assumed to be vertical (FOVMODE_VERTICAL_FIXED)
                     gltfCameraPerspective.zfar = babylonCamera.maxZ;
                     gltfCameraPerspective.znear = babylonCamera.minZ;
 

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.GLTFExporter.Light.cs

@@ -36,8 +36,6 @@ namespace Max2Babylon
 
             // Transform
             gltfNode.translation = babylonLight.position;
-            // Switch from left to right handed coordinate system
-            //gltfNode.translation[0] *= -1;
             // No rotation defined for babylon light. Use identity instead.
             gltfNode.rotation = new float[4] { 0, 0, 0, 1 };
             // No scaling defined for babylon light. Use identity instead.

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.GLTFExporter.Material.cs

@@ -353,12 +353,14 @@ namespace Max2Babylon
                 // --- Global ---
 
                 // Base color
+                // TODO - Unclear if alpha must be retreived from 'alpha' property of BABYLON.Material
+                // or from alpha channel of 'baseColor' of BABYLON.PBRMetallicRoughnessMaterial
                 gltfPbrMetallicRoughness.baseColorFactor = new float[4]
                 {
                     babylonPBRMetallicRoughnessMaterial.baseColor[0],
                     babylonPBRMetallicRoughnessMaterial.baseColor[1],
                     babylonPBRMetallicRoughnessMaterial.baseColor[2],
-                    1.0f // TODO - alpha
+                    babylonPBRMetallicRoughnessMaterial.alpha
                 };
                 gltfPbrMetallicRoughness.baseColorTexture = ExportTexture(babylonPBRMetallicRoughnessMaterial.baseTexture, gltf);
 
@@ -375,33 +377,44 @@ namespace Max2Babylon
 
         private void getAlphaMode(BabylonStandardMaterial babylonMaterial, out string alphaMode, out float? alphaCutoff)
         {
-            if ((babylonMaterial.diffuseTexture != null && babylonMaterial.diffuseTexture.hasAlpha) ||
+            if (babylonMaterial.alpha != 1.0f ||
+                (babylonMaterial.diffuseTexture != null && babylonMaterial.diffuseTexture.hasAlpha) ||
                  babylonMaterial.opacityTexture != null)
             {
-                // TODO - Babylon standard material is assumed to useAlphaFromDiffuseTexture. If not, the alpha mode is a mask.
+                // Babylon standard material is assumed to useAlphaFromDiffuseTexture. If not, the alpha mode is a mask.
                 alphaMode = GLTFMaterial.AlphaMode.BLEND.ToString();
             }
             else
             {
-                // glTF alpha mode default value is "OPAQUE"
-                alphaMode = null; // GLTFMaterial.AlphaMode.OPAQUE.ToString();
+                alphaMode = null;  // glTF alpha mode default value is "OPAQUE"
             }
             alphaCutoff = null;
         }
 
         private void getAlphaMode(BabylonPBRMetallicRoughnessMaterial babylonMaterial, out string alphaMode, out float? alphaCutoff)
         {
-            if (babylonMaterial.baseTexture != null && babylonMaterial.baseTexture.hasAlpha)
-            {
-                // TODO - Babylon standard material is assumed to useAlphaFromDiffuseTexture. If not, the alpha mode is a mask.
-                alphaMode = GLTFMaterial.AlphaMode.BLEND.ToString();
-            }
-            else
+            alphaMode = null;
+            alphaCutoff = null;
+            switch (babylonMaterial.transparencyMode)
             {
-                // glTF alpha mode default value is "OPAQUE"
-                alphaMode = null; // GLTFMaterial.AlphaMode.OPAQUE.ToString();
+                case (int)BabylonPBRMetallicRoughnessMaterial.TransparencyMode.OPAQUE:
+                    alphaMode = null; // glTF alpha mode default value is "OPAQUE"
+                    break;
+                case (int)BabylonPBRMetallicRoughnessMaterial.TransparencyMode.ALPHABLEND:
+                    alphaMode = GLTFMaterial.AlphaMode.BLEND.ToString();
+                    break;
+                case (int)BabylonPBRMetallicRoughnessMaterial.TransparencyMode.ALPHATEST:
+                    alphaCutoff = babylonMaterial.alphaCutOff;
+                    alphaMode = GLTFMaterial.AlphaMode.MASK.ToString();
+                    break;
+                case (int)BabylonPBRMetallicRoughnessMaterial.TransparencyMode.ALPHATESTANDBLEND:
+                    RaiseWarning("GLTFExporter.Material | Alpha test and blend mode is not supported in glTF. Alpha blend is used instead.", 3);
+                    alphaMode = GLTFMaterial.AlphaMode.BLEND.ToString();
+                    break;
+                default:
+                    RaiseWarning("GLTFExporter.Material | Unsupported transparency mode: " + babylonMaterial.transparencyMode, 3);
+                    break;
             }
-            alphaCutoff = null;
         }
 
         BabylonColor3 dielectricSpecular = new BabylonColor3(0.04f, 0.04f, 0.04f);

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.GLTFExporter.cs

@@ -17,7 +17,7 @@ namespace Max2Babylon
 
         private List<BabylonNode> babylonNodes;
 
-        public void ExportGltf(BabylonScene babylonScene, string outputFile, bool generateBinary, bool exportGltfImagesAsBinary)
+        public void ExportGltf(BabylonScene babylonScene, string outputFile, bool generateBinary)
         {
             RaiseMessage("GLTFExporter | Export outputFile=" + outputFile + " generateBinary=" + generateBinary);
             RaiseMessage("GLTFExporter | Exportation started", Color.Blue);
@@ -73,10 +73,8 @@ namespace Max2Babylon
                 ReportProgressChanged((int)progression);
                 CheckCancelled();
             });
-
-            // TODO - Choose between this method and the reverse of X axis
+            
             // Switch from left to right handed coordinate system
-            RaiseMessage("GLTFExporter | Exporting root node");
             var tmpNodesList = new List<int>(scene.NodesList);
             var rootNode = new BabylonMesh
             {
@@ -85,7 +83,7 @@ namespace Max2Babylon
                 scaling = new float[] { 1, 1, -1 },
                 idGroupInstance = -1
             };
-            scene.NodesList.Clear();
+            scene.NodesList.Clear(); // Only root node is listed in node list
             GLTFNode gltfRootNode = ExportAbstractMesh(rootNode, gltf, null);
             gltfRootNode.ChildrenList.AddRange(tmpNodesList);
 
@@ -97,11 +95,6 @@ namespace Max2Babylon
                 CheckCancelled();
             };
             RaiseMessage(string.Format("GLTFExporter | Nb materials exported: {0}", gltf.MaterialsList.Count), Color.Gray, 1);
-            
-            if (exportGltfImagesAsBinary)
-            {
-                SwitchImagesFromUriToBinary(gltf);
-            }
 
             // Cast lists to arrays
             gltf.Prepare();
@@ -145,27 +138,17 @@ namespace Max2Babylon
                 {
                     gltfBuffer.uri = null;
                 }
-                // Switch images to binary if not already done
-                // TODO - make it optional
-                if (!exportGltfImagesAsBinary)
+                // Switch images to binary
+                var imageBufferViews = SwitchImagesFromUriToBinary(gltf);
+                imageBufferViews.ForEach(imageBufferView =>
                 {
-                    var imageBufferViews = SwitchImagesFromUriToBinary(gltf);
-                    imageBufferViews.ForEach(imageBufferView =>
-                    {
-                        imageBufferView.Buffer.bytesList.AddRange(imageBufferView.bytesList);
-                    });
-                }
+                    imageBufferView.Buffer.bytesList.AddRange(imageBufferView.bytesList);
+                });
                 gltf.Prepare();
                 // Serialize gltf data to JSON string then convert it to bytes
                 byte[] chunkDataJson = Encoding.ASCII.GetBytes(gltfToJson(gltf));
                 // JSON chunk must be padded with trailing Space chars (0x20) to satisfy alignment requirements 
-                var nbSpaceToAdd = chunkDataJson.Length % 4 == 0 ? 0 : (4 - chunkDataJson.Length % 4);
-                var chunkDataJsonList = new List<byte>(chunkDataJson);
-                for (int i = 0; i < nbSpaceToAdd; i++)
-                {
-                    chunkDataJsonList.Add(0x20);
-                }
-                chunkDataJson = chunkDataJsonList.ToArray();
+                chunkDataJson = padChunk(chunkDataJson, 4, 0x20);
                 UInt32 chunkLengthJson = (UInt32)chunkDataJson.Length;
                 length += chunkLengthJson + 8; // 8 = JSON chunk header length
                 
@@ -352,14 +335,8 @@ namespace Max2Babylon
                         image.Save(m, imageFormat);
                         byte[] imageBytes = m.ToArray();
 
-                        // JSON chunk must be padded with trailing Space chars (0x20) to satisfy alignment requirements 
-                        var nbSpaceToAdd = imageBytes.Length % 4 == 0 ? 0 : (4 - imageBytes.Length % 4);
-                        var imageBytesList = new List<byte>(imageBytes);
-                        for (int i = 0; i < nbSpaceToAdd; i++)
-                        {
-                            imageBytesList.Add(0x00);
-                        }
-                        imageBytes = imageBytesList.ToArray();
+                        // Chunk must be padded with trailing zeros (0x00) to satisfy alignment requirements
+                        imageBytes = padChunk(imageBytes, 4, 0x00);
 
                         // BufferView - Image
                         var buffer = gltf.buffer;
@@ -387,5 +364,17 @@ namespace Max2Babylon
             }
             return imageBufferViews;
         }
+
+        private byte[] padChunk(byte[] chunk, int padding, byte trailingChar)
+        {
+            var chunkModuloPadding = chunk.Length % padding;
+            var nbCharacterToAdd = chunkModuloPadding == 0 ? 0 : (padding - chunkModuloPadding);
+            var chunkList = new List<byte>(chunk);
+            for (int i = 0; i < nbCharacterToAdd; i++)
+            {
+                chunkList.Add(trailingChar);
+            }
+            return chunkList.ToArray();
+        }
     }
 }

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.Material.cs

@@ -214,9 +214,20 @@ namespace Max2Babylon
 
                 // --- Global ---
 
-                babylonMaterial.alpha = 1.0f - materialNode.MaxMaterial.GetXParency(0, false);
+                // Alpha
+                // ---
+                // TODO - Unclear if alpha must be stored within 'alpha' property of BABYLON.Material
+                // or within alpha channel of 'baseColor' of BABYLON.PBRMetallicRoughnessMaterial
+                // ---
+                // TODO - XParency seems computed from several parameters
+                // 'Transparency' property is one of them
+                // Which value to use?
+                var alphaFromXParency = 1.0f - materialNode.MaxMaterial.GetXParency(0, false);
+                var alphaFromPropertyContainer = 1.0f - propertyContainer.GetFloatProperty(17);
+                RaiseMessage("alphaFromXParency=" + alphaFromXParency, 2);
+                RaiseMessage("alphaFromPropertyContainer=" + alphaFromPropertyContainer, 2);
+                babylonMaterial.alpha = alphaFromXParency;
 
-                // TODO - Add alpha
                 babylonMaterial.baseColor = materialNode.MaxMaterial.GetDiffuse(0, false).ToArray();
 
                 babylonMaterial.metallic = propertyContainer.GetFloatProperty(6);
@@ -233,22 +244,17 @@ namespace Max2Babylon
                                                 ? materialNode.MaxMaterial.GetSelfIllumColor(0, false).ToArray()
                                                 : materialNode.MaxMaterial.GetDiffuse(0, false).Scale(materialNode.MaxMaterial.GetSelfIllum(0, false));
 
-                // TODO - occlusionStrength - use default? ignored?
-
-                // TODO - alphaCutOff - use default?
-
-                // TODO - transparencyMode - private or public ?
-
-                // TODO - doubleSided - use default?
-
                 // --- Textures ---
+                
+                babylonMaterial.baseTexture = ExportBaseColorAlphaTexture(materialNode, babylonScene, name);
 
-                // TODO - Add alpha
-                babylonMaterial.baseTexture = ExportPBRTexture(materialNode, 1, babylonScene);
+                if (babylonMaterial.alpha != 1.0f || (babylonMaterial.baseTexture != null && babylonMaterial.baseTexture.hasAlpha))
+                {
+                    babylonMaterial.transparencyMode = (int)BabylonPBRMetallicRoughnessMaterial.TransparencyMode.ALPHABLEND;
+                }
 
                 babylonMaterial.metallicRoughnessTexture = ExportMetallicRoughnessTexture(materialNode, babylonMaterial.metallic, babylonMaterial.roughness, babylonScene, name);
-
-                // TODO - environmentTexture - as simple as that?
+                
                 babylonMaterial.environmentTexture = ExportPBRTexture(materialNode, 3, babylonScene);
 
                 var normalMapAmount = propertyContainer.GetFloatProperty(91);
@@ -256,8 +262,16 @@ namespace Max2Babylon
                 
                 babylonMaterial.emissiveTexture = ExportPBRTexture(materialNode, 17, babylonScene);
                 
-                // TODO - occlusionTexture - ignored?
+                // Constraints
+                if (babylonMaterial.baseTexture != null)
+                {
+                    babylonMaterial.baseColor = new[] { 1.0f, 1.0f, 1.0f };
+                }
 
+                if (babylonMaterial.emissiveTexture != null)
+                {
+                    babylonMaterial.emissiveColor = new float[] { 0, 0, 0 };
+                }
 
                 babylonScene.MaterialsList.Add(babylonMaterial);
             }

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.Texture.cs

@@ -47,29 +47,118 @@ namespace Max2Babylon
             return null;
         }
 
-        private BabylonTexture ExportMetallicRoughnessTexture(IIGameMaterial materialNode, float metallic, float roughness, BabylonScene babylonScene, string materialName)
+        private BabylonTexture ExportBaseColorAlphaTexture(IIGameMaterial materialNode, BabylonScene babylonScene, string materialName)
         {
-            ITexmap metallicTexMap = _getTexMap(materialNode, 5);
-            ITexmap roughnessTexMap = _getTexMap(materialNode, 4);
+            ITexmap baseColorTexMap = _getTexMap(materialNode, 1);
+            ITexmap alphaTexMap = _getTexMap(materialNode, 9); // Transparency weight map
+
+            // --- Babylon texture ---
 
-            if (metallicTexMap == null && roughnessTexMap == null)
+            var baseColorTexture = _getBitmapTex(baseColorTexMap);
+            var alphaTexture = _getBitmapTex(alphaTexMap);
+
+            // Use one as a reference for UVs parameters
+            var texture = baseColorTexture != null ? baseColorTexture : alphaTexture;
+            if (texture == null)
             {
                 return null;
             }
 
-            // Use one as a reference for UVs parameters
-            var referenceTexMap = metallicTexMap != null ? metallicTexMap : roughnessTexMap;
+            var hasAlpha = alphaTexMap != null || (baseColorTexture != null && baseColorTexture.AlphaSource == 0); // Alpha source is 'Image Alpha'
+            
+            var babylonTexture = new BabylonTexture
+            {
+                name = materialName + "_baseColor" + (hasAlpha ? ".png" : ".jpg") // TODO - unsafe name, may conflict with another texture name
+            };
 
+            // Level
+            babylonTexture.level = 1.0f;
 
-            // --- Babylon texture ---
+            // Alpha
+            babylonTexture.hasAlpha = hasAlpha;
+            babylonTexture.getAlphaFromRGB = false;
 
-            if (referenceTexMap.GetParamBlock(0) == null || referenceTexMap.GetParamBlock(0).Owner == null)
+            // UVs
+            var uvGen = _exportUV(texture, babylonTexture);
+
+            // Is cube
+            _exportIsCube(texture, babylonTexture, false);
+
+
+            // --- Merge baseColor and alpha maps ---
+
+            // Load bitmaps
+            var baseColorBitmap = _loadTexture(baseColorTexMap);
+            var alphaBitmap = _loadTexture(alphaTexMap);
+
+            // Retreive dimensions
+            int width = 0;
+            int height = 0;
+            var haveSameDimensions = _getMinimalBitmapDimensions(out width, out height, baseColorBitmap, alphaBitmap);
+            if (!haveSameDimensions)
             {
-                return null;
+                RaiseWarning("Base color and transparency color maps should have same dimensions", 2);
             }
 
-            var texture = referenceTexMap.GetParamBlock(0).Owner as IBitmapTex;
+            var getAlphaFromRGB = false;
+            if (alphaTexture != null)
+            {
+                getAlphaFromRGB = (alphaTexture.AlphaSource == 2) || (alphaTexture.AlphaSource == 3); // 'RGB intensity' or 'None (Opaque)'
+            }
 
+            // Create baseColor+alpha map
+            Bitmap baseColorAlphaBitmap = new Bitmap(width, height);
+            for (int x = 0; x < width; x++)
+            {
+                for (int y = 0; y < height; y++)
+                {
+                    var baseColor = baseColorBitmap != null ? baseColorBitmap.GetPixel(x, y) : Color.FromArgb(255, 255, 255);
+
+                    Color baseColorAlpha;
+                    if (babylonTexture.hasAlpha)
+                    {
+                        if (alphaBitmap != null)
+                        {
+                            // Retreive alpha from alpha texture
+                            var alphaColor = alphaBitmap.GetPixel(x, y);
+                            var alpha = getAlphaFromRGB ? alphaColor.R : alphaColor.A;
+                            baseColorAlpha = Color.FromArgb(alpha, baseColor);
+                        }
+                        else
+                        {
+                            // Use all channels from base color
+                            baseColorAlpha = baseColor;
+                        }
+                    }
+                    else
+                    {
+                        // Only use RGB channels from base color
+                        baseColorAlpha = Color.FromArgb(baseColor.R, baseColor.G, baseColor.B);
+                    }
+                    baseColorAlphaBitmap.SetPixel(x, y, baseColorAlpha);
+                }
+            }
+
+            // Write bitmap
+            var absolutePath = Path.Combine(babylonScene.OutputPath, babylonTexture.name);
+            RaiseMessage($"Texture | write image '{babylonTexture.name}'", 2);
+            baseColorAlphaBitmap.Save(absolutePath);
+
+            return babylonTexture;
+        }
+
+        private BabylonTexture ExportMetallicRoughnessTexture(IIGameMaterial materialNode, float metallic, float roughness, BabylonScene babylonScene, string materialName)
+        {
+            ITexmap metallicTexMap = _getTexMap(materialNode, 5);
+            ITexmap roughnessTexMap = _getTexMap(materialNode, 4);
+
+            // --- Babylon texture ---
+            
+            var metallicTexture = _getBitmapTex(metallicTexMap);
+            var roughnessTexture = _getBitmapTex(roughnessTexMap);
+
+            // Use one as a reference for UVs parameters
+            var texture = metallicTexture != null ? metallicTexture : roughnessTexture;
             if (texture == null)
             {
                 return null;
@@ -170,12 +259,12 @@ namespace Max2Babylon
             if (forceAlpha)
             {
                 babylonTexture.hasAlpha = true;
-                babylonTexture.getAlphaFromRGB = (texture.AlphaSource == 2) || (texture.AlphaSource == 3);
+                babylonTexture.getAlphaFromRGB = (texture.AlphaSource == 2) || (texture.AlphaSource == 3); // 'RGB intensity' or 'None (Opaque)'
             }
             else
             {
-                babylonTexture.hasAlpha = (texture.AlphaSource != 3);
-                babylonTexture.getAlphaFromRGB = (texture.AlphaSource == 2);
+                babylonTexture.hasAlpha = (texture.AlphaSource != 3); // Not 'None (Opaque)'
+                babylonTexture.getAlphaFromRGB = (texture.AlphaSource == 2); // 'RGB intensity'
             }
 
             // UVs
@@ -408,6 +497,16 @@ namespace Max2Babylon
         // --------- Utils ---------
         // -------------------------
 
+        private IBitmapTex _getBitmapTex(ITexmap texMap)
+        {
+            if (texMap == null || texMap.GetParamBlock(0) == null || texMap.GetParamBlock(0).Owner == null)
+            {
+                return null;
+            }
+
+            return texMap.GetParamBlock(0).Owner as IBitmapTex;
+        }
+
         private ITexmap _getTexMap(IIGameMaterial materialNode, int index)
         {
             ITexmap texMap = null;

Exporters/3ds Max/Max2Babylon/Exporter/BabylonExporter.cs

@@ -77,7 +77,7 @@ namespace Max2Babylon
             }
         }
 
-        public async Task ExportAsync(string outputFile, bool generateManifest, bool onlySelected, bool generateBinary, bool exportGltf, bool exportGltfImagesAsBinary, Form callerForm)
+        public async Task ExportAsync(string outputFile, bool generateManifest, bool onlySelected, bool generateBinary, bool exportGltf, Form callerForm)
         {
             var gameConversionManger = Loader.Global.ConversionManager;
             gameConversionManger.CoordSystem = Autodesk.Max.IGameConversionManager.CoordSystem.D3d;
@@ -298,7 +298,7 @@ namespace Max2Babylon
             // Export glTF
             if (exportGltf)
             {
-                ExportGltf(babylonScene, outputFile, generateBinary, exportGltfImagesAsBinary);
+                ExportGltf(babylonScene, outputFile, generateBinary);
             }
 
             watch.Stop();

Exporters/3ds Max/Max2Babylon/Forms/ExporterForm.Designer.cs

@@ -48,7 +48,6 @@
             this.butExportAndRun = new System.Windows.Forms.Button();
             this.butClose = new System.Windows.Forms.Button();
             this.chkGltf = new System.Windows.Forms.CheckBox();
-            this.chkGltfImagesAsBinary = new System.Windows.Forms.CheckBox();
             ((System.ComponentModel.ISupportInitialize)(this.pictureBox2)).BeginInit();
             this.groupBox1.SuspendLayout();
             this.SuspendLayout();
@@ -181,7 +180,6 @@
             // 
             this.groupBox1.Anchor = ((System.Windows.Forms.AnchorStyles)(((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Left) 
             | System.Windows.Forms.AnchorStyles.Right)));
-            this.groupBox1.Controls.Add(this.chkGltfImagesAsBinary);
             this.groupBox1.Controls.Add(this.chkBinary);
             this.groupBox1.Controls.Add(this.chkOnlySelected);
             this.groupBox1.Controls.Add(this.chkAutoSave);
@@ -279,18 +277,6 @@
             this.chkGltf.UseVisualStyleBackColor = true;
             this.chkGltf.CheckedChanged += new System.EventHandler(this.chkGltf_CheckedChanged);
             // 
-            // chkGltfImageAsBinary
-            // 
-            this.chkGltfImagesAsBinary.AutoSize = true;
-            this.chkGltfImagesAsBinary.FlatStyle = System.Windows.Forms.FlatStyle.Flat;
-            this.chkGltfImagesAsBinary.Location = new System.Drawing.Point(166, 127);
-            this.chkGltfImagesAsBinary.Name = "chkGltfImagesAsBinary";
-            this.chkGltfImagesAsBinary.Size = new System.Drawing.Size(158, 17);
-            this.chkGltfImagesAsBinary.TabIndex = 18;
-            this.chkGltfImagesAsBinary.Text = "Export glTF images as binary";
-            this.chkGltfImagesAsBinary.UseVisualStyleBackColor = true;
-            this.chkGltfImagesAsBinary.CheckedChanged += new System.EventHandler(this.checkGltfImagesAsBinary_CheckedChanged);
-            // 
             // ExporterForm
             // 
             this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
@@ -344,6 +330,5 @@
         private System.Windows.Forms.Button butClose;
         private System.Windows.Forms.CheckBox chkBinary;
         private System.Windows.Forms.CheckBox chkGltf;
-        private System.Windows.Forms.CheckBox chkGltfImagesAsBinary;
     }
 }

Exporters/3ds Max/Max2Babylon/Forms/ExporterForm.cs

@@ -33,7 +33,6 @@ namespace Max2Babylon
             Tools.PrepareCheckBox(chkOnlySelected, Loader.Core.RootNode, "babylonjs_onlySelected");
             Tools.PrepareCheckBox(chkBinary, Loader.Core.RootNode, "babylonjs_binary");
             Tools.PrepareCheckBox(chkGltf, Loader.Core.RootNode, "babylonjs_exportGltf");
-            Tools.PrepareCheckBox(chkGltfImagesAsBinary, Loader.Core.RootNode, "babylonjs_exportGltfImagesAsBinary");
         }
 
         private void butBrowse_Click(object sender, EventArgs e)
@@ -58,7 +57,6 @@ namespace Max2Babylon
             Tools.UpdateCheckBox(chkOnlySelected, Loader.Core.RootNode, "babylonjs_onlySelected");
             Tools.UpdateCheckBox(chkBinary, Loader.Core.RootNode, "babylonjs_binary");
             Tools.UpdateCheckBox(chkGltf, Loader.Core.RootNode, "babylonjs_exportGltf");
-            Tools.UpdateCheckBox(chkGltfImagesAsBinary, Loader.Core.RootNode, "babylonjs_exportGltfImagesAsBinary");
 
             Loader.Core.RootNode.SetLocalData(txtFilename.Text);
 
@@ -125,7 +123,7 @@ namespace Max2Babylon
                 exporter.AutoSave3dsMaxFile = chkAutoSave.Checked;
                 exporter.ExportHiddenObjects = chkHidden.Checked;
                 exporter.CopyTexturesToOutput = chkCopyTextures.Checked;
-                await exporter.ExportAsync(txtFilename.Text, chkManifest.Checked, chkOnlySelected.Checked, chkBinary.Checked, chkGltf.Checked, chkGltfImagesAsBinary.Checked, this);
+                await exporter.ExportAsync(txtFilename.Text, chkManifest.Checked, chkOnlySelected.Checked, chkBinary.Checked, chkGltf.Checked, this);
             }
             catch (OperationCanceledException)
             {
@@ -234,10 +232,5 @@ namespace Max2Babylon
         {
 
         }
-
-        private void checkGltfImagesAsBinary_CheckedChanged(object sender, EventArgs e)
-        {
-
-        }
     }
 }

Playground/js/index.js

@@ -153,8 +153,10 @@
                                 index = parseInt(query);
                                 if (!isNaN(index)) {
                                     loadScriptFromIndex(index);
-                                } else {
+                                } else if (query.indexOf("=") === -1) {
                                     loadScript("scripts/" + query + ".js", query);
+                                } else {
+                                    loadScript("scripts/basic scene.js", "Basic scene");
                                 }
                             } else {
                                 loadScript("scripts/basic scene.js", "Basic scene");

Playground/scripts/scripts.txt

@@ -27,4 +27,5 @@ volumetric Light Scattering
 refraction and Reflection
 pbr
 instanced bones
-pointer events handling
+pointer events handling
+webvr

Playground/scripts/webvr.js

@@ -0,0 +1,35 @@
+var createScene = function () {
+
+    // This creates a basic Babylon Scene object (non-mesh)
+    var scene = new BABYLON.Scene(engine);
+    scene.createDefaultVRExperience();
+
+    // This creates a light, aiming 0,1,0 - to the sky (non-mesh)
+    var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);
+
+    // Default intensity is 1. Let's dim the light a small amount
+    light.intensity = 0.7;
+
+    // Create some spheres at the default eye level (2m)
+    createSphereBox(scene, 2, 2);
+    createSphereBox(scene, 3, 2);
+        
+    // Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
+    var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);
+
+    return scene;
+};
+
+function createSphereBox(scene, distance, height) {    
+    createSphere(scene,  distance, height,  distance);
+    createSphere(scene,  distance, height, -distance);
+    createSphere(scene, -distance, height,  distance);
+    createSphere(scene, -distance, height, -distance);    
+}
+function createSphere(scene, x, y, z) {
+    // Our built-in 'sphere' shape. Params: name, subdivs, size, scene
+    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 4, 0.4, scene);
+    sphere.position.x = x;
+    sphere.position.y = y;
+    sphere.position.z = z;
+}

Tools/Gulp/gulp-addDtsExport.js

@@ -1,12 +1,24 @@
 var gutil = require('gulp-util');
 var through = require('through2');
 
-module.exports = function (varName) {
+module.exports = function (varName, moduleName, subModule, extendsRoot) {
     return through.obj(function (file, enc, cb) {
 
+        let exportText = "BABYLON";
+        if (subModule && !extendsRoot) {
+            exportText += '.' + varName;
+        }
+
         var moduleExportsAddition =
-            'export = ' + varName + ';\n' +
-            'export as namespace ' + varName + ';\n\n';
+            `${subModule ? '/// <reference types="babylonjs"/>' : ''}
+
+declare module '${moduleName}' { 
+    export = ${exportText}; 
+}
+`;
+
+        //'export = ' + (subModule ? 'BABYLON.' : '') + varName + ';\n';// +
+        //'export as namespace ' + varName + ';\n\n';
 
 
         if (file.isNull()) {

Tools/Gulp/gulp-addModuleExports.js

@@ -1,16 +1,39 @@
 var gutil = require('gulp-util');
 var through = require('through2');
 
-module.exports = function (varName) {
+module.exports = function (varName, subModule, extendsRoot) {
     return through.obj(function (file, enc, cb) {
 
-        var moduleExportsAddition =
-          '\nif (((typeof window != "undefined" && window.module) || (typeof module != "undefined")) && typeof module.exports != "undefined") {\n' +
-          '    module.exports = ' + varName + ';\n' +
-          '};\n';
+        var optionalRequire = 'var BABYLON = BABYLON || (typeof require !== \'undefined\' && require("babylonjs"));\n'
+
+        function moduleExportAddition(varName) {
+
+            let basicInit = `root["BABYLON"]${(subModule && !extendsRoot) ? '["' + varName + '"]' : ''} = factory();`;
+            /*if (extendsRoot) {
+                basicInit = `__extends(root["BABYLON"], factory()); `
+            }*/
+
+            return `\n\n(function universalModuleDefinition(root, factory) {
+                if (root && root["BABYLON"]) {
+                    return;
+                }
+    if(typeof exports === 'object' && typeof module === 'object')
+        module.exports = factory();
+    else if(typeof define === 'function' && define.amd)
+        define([], factory);
+    else if(typeof exports === 'object')
+        exports["${varName}"] = factory();
+    else {
+        ${basicInit}
+    }
+})(this, function() {
+    return BABYLON${(subModule && !extendsRoot) ? '.' + varName : ''};
+});
+`;
+        }
 
         var extendsAddition =
-        `var __extends = (this && this.__extends) || (function () {
+            `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]; };
@@ -23,12 +46,12 @@ module.exports = function (varName) {
         `;
 
         var decorateAddition =
-        'var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\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';
+            '};\n';
 
         if (file.isNull()) {
             cb(null, file);
@@ -41,7 +64,8 @@ module.exports = function (varName) {
         }
 
         try {
-            file.contents = new Buffer(decorateAddition.concat(new Buffer(extendsAddition.concat(String(file.contents)).concat(moduleExportsAddition))));
+            let pretext = subModule ? optionalRequire : '';
+            file.contents = new Buffer(pretext.concat(decorateAddition).concat(new Buffer(extendsAddition.concat(String(file.contents)).concat(moduleExportAddition(varName)))));
             this.push(file);
 
         } catch (err) {

Tools/Gulp/gulpfile.js

@@ -234,7 +234,7 @@ gulp.task('typescript-compile', function () {
             .pipe(gulp.dest(config.build.outputDirectory)),
         tsResult.dts
             .pipe(concat(config.build.declarationModuleFilename))
-            .pipe(addDtsExport("BABYLON"))
+            .pipe(addDtsExport("BABYLON", "babylonjs"))
             .pipe(gulp.dest(config.build.outputDirectory)),
         tsResult.js
             .pipe(sourcemaps.write("./",
@@ -256,7 +256,47 @@ var buildExternalLibraries = function (settings) {
         return buildExternalLibrary(library, settings, false);
     });
 
-    return merge2(tasks);
+    let mergedTasks = merge2(tasks);
+
+    if (settings.build.buildAsModule) {
+        mergedTasks.on('end', function () {
+            //generate js file list
+            let files = settings.libraries.filter(function (lib) {
+                return !lib.doNotIncludeInBundle;
+            }).map(function (lib) {
+                return config.build.outputDirectory + settings.build.distOutputDirectory + lib.output;
+            });
+
+            var outputDirectory = config.build.outputDirectory + settings.build.distOutputDirectory;
+
+            let srcTask = gulp.src(files)
+                .pipe(concat(settings.build.outputFilename + '.js'))
+                .pipe(replace(extendsSearchRegex, ""))
+                .pipe(replace(decorateSearchRegex, ""))
+                .pipe(replace(referenceSearchRegex, ""))
+                .pipe(addModuleExports(settings.build.moduleDeclaration, true, settings.build.extendsRoot))
+                .pipe(gulp.dest(outputDirectory))
+                .pipe(cleants())
+                .pipe(rename({ extname: ".min.js" }))
+                .pipe(uglify())
+                .pipe(optimisejs())
+                .pipe(gulp.dest(outputDirectory));
+
+            let dtsFiles = files.map(function (filename) {
+                return filename.replace(".js", ".d.ts");
+            });
+
+            let dtsTask = gulp.src(dtsFiles)
+                .pipe(concat(settings.build.outputFilename + '.module.d.ts'))
+                .pipe(replace(referenceSearchRegex, ""))
+                .pipe(addDtsExport(settings.build.moduleDeclaration, settings.build.moduleName, true, settings.build.extendsRoot))
+                .pipe(gulp.dest(outputDirectory));
+
+            return merge2([srcTask, dtsTask]);
+        });
+    }
+
+    return mergedTasks;
 }
 
 var buildExternalLibrary = function (library, settings, watch) {
@@ -274,13 +314,13 @@ var buildExternalLibrary = function (library, settings, watch) {
         .pipe(appendSrcToVariable("BABYLON.Effect.ShadersStore", shadersName, library.output + '.fx'))
         .pipe(gulp.dest(settings.build.srcOutputDirectory));
 
-    var dev = tsProcess.js.pipe(sourcemaps.write("./", {
-        includeContent: false,
-        sourceRoot: (filePath) => {
-            return '';
-        }
-    }))
-        .pipe(gulp.dest(settings.build.srcOutputDirectory));
+    var dev = tsProcess.js
+        .pipe(sourcemaps.write("./", {
+            includeContent: false,
+            sourceRoot: (filePath) => {
+                return '';
+            }
+        })).pipe(gulp.dest(settings.build.srcOutputDirectory));
 
     var outputDirectory = config.build.outputDirectory + settings.build.distOutputDirectory;
     var css = gulp.src(library.sassFiles || [])
@@ -292,29 +332,39 @@ var buildExternalLibrary = function (library, settings, watch) {
         return merge2([shader, includeShader, dev, css]);
     }
     else {
-        if (library.bundle) {
+        /*if (library.bundle) {
             // Don't remove extends and decorate functions
             var code = merge2([tsProcess.js, shader, includeShader])
-                .pipe(concat(library.output))
-                .pipe(gulp.dest(outputDirectory))
+                .pipe(concat(library.output));
+
+            if (library.buildAsModule) {
+                code = code.pipe(addModuleExports(library.moduleDeclaration, true))
+            }
+
+            code.pipe(gulp.dest(outputDirectory))
                 .pipe(cleants())
                 .pipe(rename({ extname: ".min.js" }))
                 .pipe(uglify())
                 .pipe(optimisejs())
                 .pipe(gulp.dest(outputDirectory));
-        } else {
-            var code = merge2([tsProcess.js, shader, includeShader])
-                .pipe(concat(library.output))
-                .pipe(gulp.dest(outputDirectory))
-                .pipe(cleants())
-                .pipe(replace(extendsSearchRegex, ""))
+        } else {*/
+        var code = merge2([tsProcess.js, shader, includeShader])
+            .pipe(concat(library.output))
+
+        if (library.buildAsModule) {
+            code = code.pipe(replace(extendsSearchRegex, ""))
                 .pipe(replace(decorateSearchRegex, ""))
-                .pipe(rename({ extname: ".min.js" }))
-                .pipe(uglify())
-                .pipe(optimisejs())
-                .pipe(gulp.dest(outputDirectory));
+                .pipe(addModuleExports(library.moduleDeclaration, true, library.extendsRoot))
         }
 
+        code = code.pipe(gulp.dest(outputDirectory))
+            .pipe(cleants())
+            .pipe(rename({ extname: ".min.js" }))
+            .pipe(uglify())
+            .pipe(optimisejs())
+            .pipe(gulp.dest(outputDirectory));
+        /*}*/
+
         var dts = tsProcess.dts
             .pipe(concat(library.output))
             .pipe(replace(referenceSearchRegex, ""))
@@ -325,10 +375,11 @@ var buildExternalLibrary = function (library, settings, watch) {
 
         if (library.buildAsModule) {
             var dts2 = tsProcess.dts
-            .pipe(concat(library.output))
-            .pipe(addDtsExport(library.moduleDeclaration))
-            .pipe(rename({ extname: ".module.d.ts" }))
-            .pipe(gulp.dest(outputDirectory));
+                .pipe(concat(library.output))
+                .pipe(replace(referenceSearchRegex, ""))
+                .pipe(addDtsExport(library.moduleDeclaration, library.moduleName, true, library.extendsRoot))
+                .pipe(rename({ extname: ".module.d.ts" }))
+                .pipe(gulp.dest(outputDirectory));
             waitAll = merge2([dev, code, css, dts, dts2]);
         } else {
             waitAll = merge2([dev, code, css, dts]);
@@ -447,6 +498,7 @@ gulp.task('deployLocalDev', function () {
  */
 gulp.task('webserver', function () {
     gulp.src('../../.').pipe(webserver({
+        host: '0.0.0.0',
         port: 1338,
         livereload: false
     }));

Tools/Publisher/index.js

@@ -0,0 +1,62 @@
+let prompt = require('prompt');
+let shelljs = require('shelljs');
+let fs = require('fs');
+
+let basePath = '../../dist/preview release';
+
+// This can be changed when we have a new major release.
+let minimumDependency = '>=3.1.0-alpha';
+
+let packages = [
+    {
+        name: 'core',
+        path: '../../'
+    },
+    {
+        name: 'gui',
+        path: basePath + '/gui/'
+    },
+    {
+        name: 'materials',
+        path: basePath + '/materialsLibrary/'
+    },
+    {
+        name: 'postProcess',
+        path: basePath + '/postProcessesLibrary/'
+    },
+    {
+        name: 'loaders',
+        path: basePath + '/loaders/'
+    },
+    {
+        name: 'serializers',
+        path: basePath + '/serializers/'
+    },
+    {
+        name: 'proceduralTextures',
+        path: basePath + '/proceduralTexturesLibrary/'
+    }
+];
+
+//check if logged in
+let loginCheck = shelljs.exec('npm whoami');
+
+if (loginCheck.code === 0) {
+    prompt.start();
+
+    prompt.get(['version'], function (err, result) {
+        let version = result.version;
+        packages.forEach((package) => {
+            let packageJson = require(package.path + 'package.json');
+            packageJson.version = version;
+            if (packageJson.peerDependencies) packageJson.peerDependencies.babylonjs = minimumDependency;
+            fs.writeFileSync(package.path + 'package.json', JSON.stringify(packageJson, null, 4));
+            console.log('Publishing ' + package.name + " from " + package.path);
+            //publish the respected package
+            shelljs.exec('npm publish \"' + package.path + "\"");
+        });
+    });
+} else {
+    console.log('not logged in.');
+}
+

Tools/Publisher/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "banylonjs-publisher",
+  "version": "1.0.0",
+  "description": "Publishing babylon's packages automatically",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "Raanan Weber",
+  "license": "ISC",
+  "dependencies": {
+    "prompt": "^1.0.0",
+    "shelljs": "^0.7.8"
+  }
+}

dist/preview release/Oimo.js

@@ -1882,12 +1882,12 @@ OIMO.Mat33.prototype = {
     },
     mul: function (m1, m2) {
         var te = this.elements, tm1 = m1.elements, tm2 = m2.elements,
-        a0 = tm1[0], a3 = tm1[3], a6 = tm1[6],
-        a1 = tm1[1], a4 = tm1[4], a7 = tm1[7],
-        a2 = tm1[2], a5 = tm1[5], a8 = tm1[8],
-        b0 = tm2[0], b3 = tm2[3], b6 = tm2[6],
-        b1 = tm2[1], b4 = tm2[4], b7 = tm2[7],
-        b2 = tm2[2], b5 = tm2[5], b8 = tm2[8];
+            a0 = tm1[0], a3 = tm1[3], a6 = tm1[6],
+            a1 = tm1[1], a4 = tm1[4], a7 = tm1[7],
+            a2 = tm1[2], a5 = tm1[5], a8 = tm1[8],
+            b0 = tm2[0], b3 = tm2[3], b6 = tm2[6],
+            b1 = tm2[1], b4 = tm2[4], b7 = tm2[7],
+            b2 = tm2[2], b5 = tm2[5], b8 = tm2[8];
         te[0] = a0 * b0 + a1 * b3 + a2 * b6;
         te[1] = a0 * b1 + a1 * b4 + a2 * b7;
         te[2] = a0 * b2 + a1 * b5 + a2 * b8;
@@ -1968,10 +1968,10 @@ OIMO.Mat33.prototype = {
     },
     setQuat: function (q) {
         var te = this.elements,
-        x2 = 2 * q.x, y2 = 2 * q.y, z2 = 2 * q.z,
-        xx = q.x * x2, yy = q.y * y2, zz = q.z * z2,
-        xy = q.x * y2, yz = q.y * z2, xz = q.x * z2,
-        sx = q.s * x2, sy = q.s * y2, sz = q.s * z2;
+            x2 = 2 * q.x, y2 = 2 * q.y, z2 = 2 * q.z,
+            xx = q.x * x2, yy = q.y * y2, zz = q.z * z2,
+            xy = q.x * y2, yz = q.y * z2, xz = q.x * z2,
+            sx = q.s * x2, sy = q.s * y2, sz = q.s * z2;
 
         te[0] = 1 - yy - zz;
         te[1] = xy - sz;
@@ -1986,13 +1986,13 @@ OIMO.Mat33.prototype = {
     },
     invert: function (m) {
         var te = this.elements, tm = m.elements,
-        a0 = tm[0], a3 = tm[3], a6 = tm[6],
-        a1 = tm[1], a4 = tm[4], a7 = tm[7],
-        a2 = tm[2], a5 = tm[5], a8 = tm[8],
-        b01 = a4 * a8 - a7 * a5,
-        b11 = a7 * a2 - a1 * a8,
-        b21 = a1 * a5 - a4 * a2,
-        dt = a0 * (b01) + a3 * (b11) + a6 * (b21);
+            a0 = tm[0], a3 = tm[3], a6 = tm[6],
+            a1 = tm[1], a4 = tm[4], a7 = tm[7],
+            a2 = tm[2], a5 = tm[5], a8 = tm[8],
+            b01 = a4 * a8 - a7 * a5,
+            b11 = a7 * a2 - a1 * a8,
+            b21 = a1 * a5 - a4 * a2,
+            dt = a0 * (b01) + a3 * (b11) + a6 * (b21);
 
         if (dt != 0) { dt = 1.0 / dt; }
         te[0] = dt * b01;//(a4*a8 - a5*a7);
@@ -2051,9 +2051,9 @@ OIMO.Mat33.prototype = {
     toString: function () {
         var te = this.elements;
         var text =
-        "Mat33|" + te[0].toFixed(4) + ", " + te[1].toFixed(4) + ", " + te[2].toFixed(4) + "|\n" +
-        "     |" + te[3].toFixed(4) + ", " + te[4].toFixed(4) + ", " + te[5].toFixed(4) + "|\n" +
-        "     |" + te[6].toFixed(4) + ", " + te[7].toFixed(4) + ", " + te[8].toFixed(4) + "|";
+            "Mat33|" + te[0].toFixed(4) + ", " + te[1].toFixed(4) + ", " + te[2].toFixed(4) + "|\n" +
+            "     |" + te[3].toFixed(4) + ", " + te[4].toFixed(4) + ", " + te[5].toFixed(4) + "|\n" +
+            "     |" + te[6].toFixed(4) + ", " + te[7].toFixed(4) + ", " + te[8].toFixed(4) + "|";
         return text;
     },
 
@@ -2203,7 +2203,7 @@ OIMO.Quat.prototype = {
     },
     mul: function (q1, q2) {
         var ax = q1.x, ay = q1.y, az = q1.z, as = q1.s,
-        bx = q2.x, by = q2.y, bz = q2.z, bs = q2.s;
+            bx = q2.x, by = q2.y, bz = q2.z, bs = q2.s;
         this.x = ax * bs + as * bx + ay * bz - az * by;
         this.y = ay * bs + as * by + az * bx - ax * bz;
         this.z = az * bs + as * bz + ax * by - ay * bx;
@@ -2424,7 +2424,7 @@ OIMO.Vec3.prototype = {
     },*/
     cross: function (v1, v2) {
         var ax = v1.x, ay = v1.y, az = v1.z,
-        bx = v2.x, by = v2.y, bz = v2.z;
+            bx = v2.x, by = v2.y, bz = v2.z;
         this.x = ay * bz - az * by;
         this.y = az * bx - ax * bz;
         this.z = ax * by - ay * bx;
@@ -3766,7 +3766,7 @@ OIMO.SliderJoint.prototype.preSolve = function (timeStep, invTimeStep) {
         nx * (angAxis1Y * angAxis2Z - angAxis1Z * angAxis2Y) +
         ny * (angAxis1Z * angAxis2X - angAxis1X * angAxis2Z) +
         nz * (angAxis1X * angAxis2Y - angAxis1Y * angAxis2X) < 0
-        ) {
+    ) {
         this.rotationalLimitMotor.angle = -this.acosClamp(angAxis1X * angAxis2X + angAxis1Y * angAxis2Y + angAxis1Z * angAxis2Z);
     } else {
         this.rotationalLimitMotor.angle = this.acosClamp(angAxis1X * angAxis2X + angAxis1Y * angAxis2Y + angAxis1Z * angAxis2Z);
@@ -4654,9 +4654,9 @@ OIMO.Rotational3Constraint.prototype = {
         this.k22 += this.cfm3;
 
         var inv = 1 / (
-        this.k00 * (this.k11 * this.k22 - this.k21 * this.k12) +
-        this.k10 * (this.k21 * this.k02 - this.k01 * this.k22) +
-        this.k20 * (this.k01 * this.k12 - this.k11 * this.k02)
+            this.k00 * (this.k11 * this.k22 - this.k21 * this.k12) +
+            this.k10 * (this.k21 * this.k02 - this.k01 * this.k22) +
+            this.k20 * (this.k01 * this.k12 - this.k11 * this.k02)
         );
         this.d00 = (this.k11 * this.k22 - this.k12 * this.k21) * inv;
         this.d01 = (this.k02 * this.k21 - this.k01 * this.k22) * inv;
@@ -5580,9 +5580,9 @@ OIMO.Translational3Constraint.prototype = {
         this.k22 += this.cfm3;
 
         var inv = 1 / (
-        this.k00 * (this.k11 * this.k22 - this.k21 * this.k12) +
-        this.k10 * (this.k21 * this.k02 - this.k01 * this.k22) +
-        this.k20 * (this.k01 * this.k12 - this.k11 * this.k02)
+            this.k00 * (this.k11 * this.k22 - this.k21 * this.k12) +
+            this.k10 * (this.k21 * this.k02 - this.k01 * this.k22) +
+            this.k20 * (this.k01 * this.k12 - this.k11 * this.k02)
         );
         this.d00 = (this.k11 * this.k22 - this.k12 * this.k21) * inv;
         this.d01 = (this.k02 * this.k21 - this.k01 * this.k22) * inv;
@@ -5956,7 +5956,7 @@ OIMO.TranslationalConstraint.prototype = {
         this.a2y = this.t2x * this.i2e10 + this.t2y * this.i2e11 + this.t2z * this.i2e12;
         this.a2z = this.t2x * this.i2e20 + this.t2y * this.i2e21 + this.t2z * this.i2e22;
         this.motorDenom =
-        this.m1 + this.m2 +
+            this.m1 + this.m2 +
             this.ax * (this.a1y * this.r1z - this.a1z * this.r1y + this.a2y * this.r2z - this.a2z * this.r2y) +
             this.ay * (this.a1z * this.r1x - this.a1x * this.r1z + this.a2z * this.r2x - this.a2x * this.r2z) +
             this.az * (this.a1x * this.r1y - this.a1y * this.r1x + this.a2x * this.r2y - this.a2y * this.r2x);
@@ -6613,18 +6613,18 @@ OIMO.ContactConstraint.prototype.solve = function () {
         var rvY = lv2y - lv1y;
         var rvZ = lv2z - lv1z;
         rvn =
-        rvX * c.tanX + rvY * c.tanY + rvZ * c.tanZ +
-        av2x * c.tanT2X + av2y * c.tanT2Y + av2z * c.tanT2Z -
-        av1x * c.tanT1X - av1y * c.tanT1Y - av1z * c.tanT1Z
-        ;
+            rvX * c.tanX + rvY * c.tanY + rvZ * c.tanZ +
+            av2x * c.tanT2X + av2y * c.tanT2Y + av2z * c.tanT2Z -
+            av1x * c.tanT1X - av1y * c.tanT1Y - av1z * c.tanT1Z
+            ;
         oldImp1 = tanImp;
         newImp1 = rvn * c.tanDen;
         tanImp += newImp1;
         rvn =
-        rvX * c.binX + rvY * c.binY + rvZ * c.binZ +
-        av2x * c.binT2X + av2y * c.binT2Y + av2z * c.binT2Z -
-        av1x * c.binT1X - av1y * c.binT1Y - av1z * c.binT1Z
-        ;
+            rvX * c.binX + rvY * c.binY + rvZ * c.binZ +
+            av2x * c.binT2X + av2y * c.binT2Y + av2z * c.binT2Z -
+            av1x * c.binT1X - av1y * c.binT1Y - av1z * c.binT1Z
+            ;
         oldImp2 = binImp;
         newImp2 = rvn * c.binDen;
         binImp += newImp2;
@@ -6654,9 +6654,9 @@ OIMO.ContactConstraint.prototype.solve = function () {
 
         // restitution part
         rvn =
-        (lv2x - lv1x) * c.norX + (lv2y - lv1y) * c.norY + (lv2z - lv1z) * c.norZ +
-        av2x * c.norT2X + av2y * c.norT2Y + av2z * c.norT2Z -
-        av1x * c.norT1X - av1y * c.norT1Y - av1z * c.norT1Z;
+            (lv2x - lv1x) * c.norX + (lv2y - lv1y) * c.norY + (lv2z - lv1z) * c.norZ +
+            av2x * c.norT2X + av2y * c.norT2Y + av2z * c.norT2Z -
+            av1x * c.norT1X - av1y * c.norT1Y - av1z * c.norT1Z;
 
         oldImp1 = norImp;
         newImp1 = (rvn - c.norTar) * c.norDen;
@@ -7329,10 +7329,10 @@ OIMO.TetraShape = function (config, p1, p2, p3, p4) {
     // Vertices and faces of tetra
     this.verts = [p1, p2, p3, p4];
     this.faces = [
-      mtri(0, 1, 2),
-      mtri(1, 2, 3),
-      mtri(2, 3, 4),
-      mtri(4, 0, 1),
+        mtri(0, 1, 2),
+        mtri(1, 2, 3),
+        mtri(2, 3, 4),
+        mtri(4, 0, 1),
     ];
 };
 OIMO.TetraShape.prototype = Object.create(OIMO.Shape.prototype);
@@ -9207,14 +9207,14 @@ OIMO.BoxCylinderCollisionDetector.prototype.getSep = function (c1, c2, sep, pos,
                 return false;
             }
             if (
-            (v4y * v1z - v4z * v1y) * v0x +
-            (v4z * v1x - v4x * v1z) * v0y +
-            (v4x * v1y - v4y * v1x) * v0z < 0
+                (v4y * v1z - v4z * v1y) * v0x +
+                (v4z * v1x - v4x * v1z) * v0y +
+                (v4x * v1y - v4y * v1x) * v0z < 0
             ) {
                 if (
-                (v4y * v2z - v4z * v2y) * v0x +
-                (v4z * v2x - v4x * v2z) * v0y +
-                (v4x * v2y - v4y * v2x) * v0z < 0
+                    (v4y * v2z - v4z * v2y) * v0x +
+                    (v4z * v2x - v4x * v2z) * v0y +
+                    (v4x * v2y - v4y * v2x) * v0z < 0
                 ) {
                     v1x = v4x;
                     v1y = v4y;
@@ -9238,9 +9238,9 @@ OIMO.BoxCylinderCollisionDetector.prototype.getSep = function (c1, c2, sep, pos,
                 }
             } else {
                 if (
-                (v4y * v3z - v4z * v3y) * v0x +
-                (v4z * v3x - v4x * v3z) * v0y +
-                (v4x * v3y - v4y * v3x) * v0z < 0
+                    (v4y * v3z - v4z * v3y) * v0x +
+                    (v4z * v3x - v4x * v3z) * v0y +
+                    (v4x * v3y - v4y * v3x) * v0z < 0
                 ) {
                     v2x = v4x;
                     v2y = v4y;
@@ -10239,14 +10239,14 @@ OIMO.CylinderCylinderCollisionDetector.prototype.getSep = function (c1, c2, sep,
                 return false;
             }
             if (
-            (v4y * v1z - v4z * v1y) * v0x +
-            (v4z * v1x - v4x * v1z) * v0y +
-            (v4x * v1y - v4y * v1x) * v0z < 0
+                (v4y * v1z - v4z * v1y) * v0x +
+                (v4z * v1x - v4x * v1z) * v0y +
+                (v4x * v1y - v4y * v1x) * v0z < 0
             ) {
                 if (
-                (v4y * v2z - v4z * v2y) * v0x +
-                (v4z * v2x - v4x * v2z) * v0y +
-                (v4x * v2y - v4y * v2x) * v0z < 0
+                    (v4y * v2z - v4z * v2y) * v0x +
+                    (v4z * v2x - v4x * v2z) * v0y +
+                    (v4x * v2y - v4y * v2x) * v0z < 0
                 ) {
                     v1x = v4x;
                     v1y = v4y;
@@ -10270,9 +10270,9 @@ OIMO.CylinderCylinderCollisionDetector.prototype.getSep = function (c1, c2, sep,
                 }
             } else {
                 if (
-                (v4y * v3z - v4z * v3y) * v0x +
-                (v4z * v3x - v4x * v3z) * v0y +
-                (v4x * v3y - v4y * v3x) * v0z < 0
+                    (v4y * v3z - v4z * v3y) * v0x +
+                    (v4z * v3x - v4x * v3z) * v0y +
+                    (v4x * v3y - v4y * v3x) * v0z < 0
                 ) {
                     v2x = v4x;
                     v2y = v4y;
@@ -10932,9 +10932,9 @@ OIMO.TetraTetraCollisionDetector.prototype.detectCollision = function (tet1, tet
             j3 = vs2[fs[i].c];
 
             if (
-              tricheck(pt(vec.x, vec.y), pt(j1.x, j1.y), pt(j2.x, j2.y), pt(j3.x, j3.y)) &&
-              tricheck(pt(vec.x, vec.z), pt(j1.x, j1.z), pt(j2.x, j2.z), pt(j3.x, j3.z)) &&
-              tricheck(pt(vec.z, vec.y), pt(j1.z, j1.y), pt(j2.z, j2.y), pt(j3.z, j3.y))
+                tricheck(pt(vec.x, vec.y), pt(j1.x, j1.y), pt(j2.x, j2.y), pt(j3.x, j3.y)) &&
+                tricheck(pt(vec.x, vec.z), pt(j1.x, j1.z), pt(j2.x, j2.z), pt(j3.x, j3.z)) &&
+                tricheck(pt(vec.z, vec.y), pt(j1.z, j1.y), pt(j2.z, j2.y), pt(j3.z, j3.y))
             )
                 ts++;
 
@@ -11518,15 +11518,15 @@ OIMO.SAPBroadPhase = function () {
     this.numElementsS = 0;
     // dynamic proxies
     this.axesD = [
-       new OIMO.SAPAxis(),
-       new OIMO.SAPAxis(),
-       new OIMO.SAPAxis()
+        new OIMO.SAPAxis(),
+        new OIMO.SAPAxis(),
+        new OIMO.SAPAxis()
     ];
     // static or sleeping proxies
     this.axesS = [
-       new OIMO.SAPAxis(),
-       new OIMO.SAPAxis(),
-       new OIMO.SAPAxis()
+        new OIMO.SAPAxis(),
+        new OIMO.SAPAxis(),
+        new OIMO.SAPAxis()
     ];
 
     this.index1 = 0;
@@ -12510,3 +12510,20 @@ OIMO.World.prototype.add = function (obj) {
     }
 }
 
+//UMD simplified
+
+var root = this;
+
+if (!root['OIMO']) {
+    if (typeof exports === 'object' && typeof module === 'object')
+        module.exports = OIMO;
+    else if (typeof define === 'function' && define.amd)
+        define([], function () {
+            return OIMO;
+        });
+    else if (typeof exports === 'object')
+        exports["OIMO"] = OIMO;
+    else {
+        root["OIMO"] = OIMO;
+    }
+}

dist/preview release/babylon.d.ts

@@ -84,6 +84,10 @@ declare module BABYLON {
         lockstepMaxSteps?: number;
         doNotHandleContextLost?: boolean;
     }
+    interface IDisplayChangedEventArgs {
+        vrDisplay: any;
+        vrSupported: boolean;
+    }
     /**
      * The engine class is responsible for interfacing with all lower-level APIs such as WebGL and Audio.
      */
@@ -206,9 +210,12 @@ declare module BABYLON {
          * Observable event triggered each time the canvas receives pointerout event
          */
         onCanvasPointerOutObservable: Observable<Engine>;
-        vrDisplaysPromise: any;
-        private _vrDisplays;
-        private _vrDisplayEnabled;
+        /**
+         * Observable event triggered before each texture is initialized
+         */
+        onBeforeTextureInitObservable: Observable<Texture>;
+        private _vrDisplay;
+        private _vrSupported;
         private _oldSize;
         private _oldHardwareScaleFactor;
         private _vrExclusivePointerMode;
@@ -235,6 +242,12 @@ declare module BABYLON {
         private _onPointerLockChange;
         private _onVRDisplayPointerRestricted;
         private _onVRDisplayPointerUnrestricted;
+        private _onVrDisplayConnect;
+        private _onVrDisplayDisconnect;
+        private _onVrDisplayPresentChange;
+        onVRDisplayChangedObservable: Observable<IDisplayChangedEventArgs>;
+        onVRRequestPresentComplete: Observable<boolean>;
+        onVRRequestPresentStart: Observable<Engine>;
         private _hardwareScalingLevel;
         private _caps;
         private _pointerLockRequested;
@@ -420,13 +433,16 @@ declare module BABYLON {
          * @param {number} height - the new canvas' height
          */
         setSize(width: number, height: number): void;
-        isVRDevicePresent(callback: (result: boolean) => void): void;
-        getVRDevice(name: string, callback: (device: any) => void): void;
-        initWebVR(): void;
-        enableVR(vrDevice: any): void;
+        isVRDevicePresent(): boolean;
+        getVRDevice(): any;
+        initWebVR(): Observable<{
+            vrDisplay: any;
+            vrSupported: any;
+        }>;
+        enableVR(): void;
         disableVR(): void;
         private _onVRFullScreenTriggered;
-        private _getVRDisplays();
+        private _getVRDisplays(callback);
         bindFramebuffer(texture: InternalTexture, faceIndex?: number, requiredWidth?: number, requiredHeight?: number, forceFullscreenViewport?: boolean): void;
         private bindUnboundFramebuffer(framebuffer);
         unBindFramebuffer(texture: InternalTexture, disableGenerateMipMaps?: boolean, onBeforeUnbind?: () => void): void;
@@ -2264,6 +2280,7 @@ declare module BABYLON {
         private _child;
         private _condition;
         private _triggerParameter;
+        onBeforeExecuteObservable: Observable<Action>;
         constructor(triggerOptions: any, condition?: Condition);
         _prepare(): void;
         getTriggerParameter(): any;
@@ -2585,6 +2602,7 @@ declare module BABYLON {
         private _target;
         private _effectiveTarget;
         private _property;
+        onInterpolationDoneObservable: Observable<InterpolateValueAction>;
         constructor(triggerOptions: any, target: any, propertyPath: string, value: any, duration?: number, condition?: Condition, stopOtherAnimations?: boolean, onInterpolationDone?: () => void);
         _prepare(): void;
         execute(): void;
@@ -4423,6 +4441,134 @@ declare module BABYLON {
     }
 }
 
+declare module BABYLON.Debug {
+    class AxesViewer {
+        private _xline;
+        private _yline;
+        private _zline;
+        private _xmesh;
+        private _ymesh;
+        private _zmesh;
+        scene: Scene;
+        scaleLines: number;
+        constructor(scene: Scene, scaleLines?: number);
+        update(position: Vector3, xaxis: Vector3, yaxis: Vector3, zaxis: Vector3): void;
+        dispose(): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    class BoneAxesViewer extends Debug.AxesViewer {
+        mesh: Mesh;
+        bone: Bone;
+        pos: Vector3;
+        xaxis: Vector3;
+        yaxis: Vector3;
+        zaxis: Vector3;
+        constructor(scene: Scene, bone: Bone, mesh: Mesh, scaleLines?: number);
+        update(): void;
+        dispose(): void;
+    }
+}
+
+declare module BABYLON {
+    class DebugLayer {
+        private _scene;
+        static InspectorURL: string;
+        private _inspector;
+        constructor(scene: Scene);
+        /** Creates the inspector window. */
+        private _createInspector(config?);
+        isVisible(): boolean;
+        hide(): void;
+        show(config?: {
+            popup?: boolean;
+            initialTab?: number;
+            parentElement?: HTMLElement;
+            newColors?: {
+                backgroundColor?: string;
+                backgroundColorLighter?: string;
+                backgroundColorLighter2?: string;
+                backgroundColorLighter3?: string;
+                color?: string;
+                colorTop?: string;
+                colorBot?: string;
+            };
+        }): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    class PhysicsViewer {
+        protected _impostors: Array<PhysicsImpostor>;
+        protected _meshes: Array<AbstractMesh>;
+        protected _scene: Scene;
+        protected _numMeshes: number;
+        protected _physicsEnginePlugin: IPhysicsEnginePlugin;
+        private _renderFunction;
+        private _debugBoxMesh;
+        private _debugSphereMesh;
+        private _debugMaterial;
+        constructor(scene: Scene);
+        protected _updateDebugMeshes(): void;
+        showImpostor(impostor: PhysicsImpostor): void;
+        hideImpostor(impostor: PhysicsImpostor): void;
+        private _getDebugMaterial(scene);
+        private _getDebugBoxMesh(scene);
+        private _getDebugSphereMesh(scene);
+        private _getDebugMesh(impostor, scene);
+        dispose(): void;
+    }
+}
+
+declare module BABYLON {
+    class RayHelper {
+        ray: Ray;
+        private _renderPoints;
+        private _renderLine;
+        private _renderFunction;
+        private _scene;
+        private _updateToMeshFunction;
+        private _attachedToMesh;
+        private _meshSpaceDirection;
+        private _meshSpaceOrigin;
+        static CreateAndShow(ray: Ray, scene: Scene, color: Color3): RayHelper;
+        constructor(ray: Ray);
+        show(scene: Scene, color: Color3): void;
+        hide(): void;
+        private _render();
+        attachToMesh(mesh: AbstractMesh, meshSpaceDirection?: Vector3, meshSpaceOrigin?: Vector3, length?: number): void;
+        detachFromMesh(): void;
+        private _updateToMesh();
+        dispose(): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    /**
+    * Demo available here: http://www.babylonjs-playground.com/#1BZJVJ#8
+    */
+    class SkeletonViewer {
+        skeleton: Skeleton;
+        mesh: AbstractMesh;
+        autoUpdateBonesMatrices: boolean;
+        renderingGroupId: number;
+        color: Color3;
+        private _scene;
+        private _debugLines;
+        private _debugMesh;
+        private _isEnabled;
+        private _renderFunction;
+        constructor(skeleton: Skeleton, mesh: AbstractMesh, scene: Scene, autoUpdateBonesMatrices?: boolean, renderingGroupId?: number);
+        isEnabled: boolean;
+        private _getBonePosition(position, bone, meshMat, x?, y?, z?);
+        private _getLinesForBonesWithLength(bones, meshMat);
+        private _getLinesForBonesNoLength(bones, meshMat);
+        update(): void;
+        dispose(): void;
+    }
+}
+
 declare module BABYLON {
     class KeyboardEventTypes {
         static _KEYDOWN: number;
@@ -4487,158 +4633,6 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
-    class StickValues {
-        x: any;
-        y: any;
-        constructor(x: any, y: any);
-    }
-    interface GamepadButtonChanges {
-        changed: boolean;
-        pressChanged: boolean;
-        touchChanged: boolean;
-        valueChanged: boolean;
-    }
-    class Gamepad {
-        id: string;
-        index: number;
-        browserGamepad: any;
-        type: number;
-        private _leftStick;
-        private _rightStick;
-        _isConnected: boolean;
-        private _leftStickAxisX;
-        private _leftStickAxisY;
-        private _rightStickAxisX;
-        private _rightStickAxisY;
-        private _onleftstickchanged;
-        private _onrightstickchanged;
-        static GAMEPAD: number;
-        static GENERIC: number;
-        static XBOX: number;
-        static POSE_ENABLED: number;
-        readonly isConnected: boolean;
-        constructor(id: string, index: number, browserGamepad: any, leftStickX?: number, leftStickY?: number, rightStickX?: number, rightStickY?: number);
-        onleftstickchanged(callback: (values: StickValues) => void): void;
-        onrightstickchanged(callback: (values: StickValues) => void): void;
-        leftStick: StickValues;
-        rightStick: StickValues;
-        update(): void;
-        dispose(): void;
-    }
-    class GenericPad extends Gamepad {
-        private _buttons;
-        private _onbuttondown;
-        private _onbuttonup;
-        onButtonDownObservable: Observable<number>;
-        onButtonUpObservable: Observable<number>;
-        onbuttondown(callback: (buttonPressed: number) => void): void;
-        onbuttonup(callback: (buttonReleased: number) => void): void;
-        constructor(id: string, index: number, browserGamepad: any);
-        private _setButtonValue(newValue, currentValue, buttonIndex);
-        update(): void;
-    }
-}
-
-declare module BABYLON {
-    class GamepadManager {
-        private _babylonGamepads;
-        private _oneGamepadConnected;
-        private _isMonitoring;
-        private _gamepadEventSupported;
-        private _gamepadSupport;
-        onGamepadConnectedObservable: Observable<Gamepad>;
-        onGamepadDisconnectedObservable: Observable<Gamepad>;
-        private _onGamepadConnectedEvent;
-        private _onGamepadDisconnectedEvent;
-        constructor();
-        readonly gamepads: Gamepad[];
-        getGamepadByType(type?: number): Gamepad;
-        dispose(): void;
-        private _addNewGamepad(gamepad);
-        private _startMonitoringGamepads();
-        private _stopMonitoringGamepads();
-        private _checkGamepadsStatus();
-        private _updateGamepadObjects();
-    }
-}
-
-declare module BABYLON {
-    enum Xbox360Button {
-        A = 0,
-        B = 1,
-        X = 2,
-        Y = 3,
-        Start = 4,
-        Back = 5,
-        LB = 6,
-        RB = 7,
-        LeftStick = 8,
-        RightStick = 9,
-    }
-    enum Xbox360Dpad {
-        Up = 0,
-        Down = 1,
-        Left = 2,
-        Right = 3,
-    }
-    class Xbox360Pad extends Gamepad {
-        private _leftTrigger;
-        private _rightTrigger;
-        private _onlefttriggerchanged;
-        private _onrighttriggerchanged;
-        private _onbuttondown;
-        private _onbuttonup;
-        private _ondpaddown;
-        private _ondpadup;
-        onButtonDownObservable: Observable<Xbox360Button>;
-        onButtonUpObservable: Observable<Xbox360Button>;
-        onPadDownObservable: Observable<Xbox360Dpad>;
-        onPadUpObservable: Observable<Xbox360Dpad>;
-        private _buttonA;
-        private _buttonB;
-        private _buttonX;
-        private _buttonY;
-        private _buttonBack;
-        private _buttonStart;
-        private _buttonLB;
-        private _buttonRB;
-        private _buttonLeftStick;
-        private _buttonRightStick;
-        private _dPadUp;
-        private _dPadDown;
-        private _dPadLeft;
-        private _dPadRight;
-        private _isXboxOnePad;
-        constructor(id: string, index: number, gamepad: any, xboxOne?: boolean);
-        onlefttriggerchanged(callback: (value: number) => void): void;
-        onrighttriggerchanged(callback: (value: number) => void): void;
-        leftTrigger: number;
-        rightTrigger: number;
-        onbuttondown(callback: (buttonPressed: Xbox360Button) => void): void;
-        onbuttonup(callback: (buttonReleased: Xbox360Button) => void): void;
-        ondpaddown(callback: (dPadPressed: Xbox360Dpad) => void): void;
-        ondpadup(callback: (dPadReleased: Xbox360Dpad) => void): void;
-        private _setButtonValue(newValue, currentValue, buttonType);
-        private _setDPadValue(newValue, currentValue, buttonType);
-        buttonA: number;
-        buttonB: number;
-        buttonX: number;
-        buttonY: number;
-        buttonStart: number;
-        buttonBack: number;
-        buttonLB: number;
-        buttonRB: number;
-        buttonLeftStick: number;
-        buttonRightStick: number;
-        dPadUp: number;
-        dPadDown: number;
-        dPadLeft: number;
-        dPadRight: number;
-        update(): void;
-    }
-}
-
-declare module BABYLON {
     /**
      * Highlight layer options. This helps customizing the behaviour
      * of the highlight layer.
@@ -4944,6 +4938,158 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
+    class StickValues {
+        x: any;
+        y: any;
+        constructor(x: any, y: any);
+    }
+    interface GamepadButtonChanges {
+        changed: boolean;
+        pressChanged: boolean;
+        touchChanged: boolean;
+        valueChanged: boolean;
+    }
+    class Gamepad {
+        id: string;
+        index: number;
+        browserGamepad: any;
+        type: number;
+        private _leftStick;
+        private _rightStick;
+        _isConnected: boolean;
+        private _leftStickAxisX;
+        private _leftStickAxisY;
+        private _rightStickAxisX;
+        private _rightStickAxisY;
+        private _onleftstickchanged;
+        private _onrightstickchanged;
+        static GAMEPAD: number;
+        static GENERIC: number;
+        static XBOX: number;
+        static POSE_ENABLED: number;
+        readonly isConnected: boolean;
+        constructor(id: string, index: number, browserGamepad: any, leftStickX?: number, leftStickY?: number, rightStickX?: number, rightStickY?: number);
+        onleftstickchanged(callback: (values: StickValues) => void): void;
+        onrightstickchanged(callback: (values: StickValues) => void): void;
+        leftStick: StickValues;
+        rightStick: StickValues;
+        update(): void;
+        dispose(): void;
+    }
+    class GenericPad extends Gamepad {
+        private _buttons;
+        private _onbuttondown;
+        private _onbuttonup;
+        onButtonDownObservable: Observable<number>;
+        onButtonUpObservable: Observable<number>;
+        onbuttondown(callback: (buttonPressed: number) => void): void;
+        onbuttonup(callback: (buttonReleased: number) => void): void;
+        constructor(id: string, index: number, browserGamepad: any);
+        private _setButtonValue(newValue, currentValue, buttonIndex);
+        update(): void;
+    }
+}
+
+declare module BABYLON {
+    class GamepadManager {
+        private _babylonGamepads;
+        private _oneGamepadConnected;
+        private _isMonitoring;
+        private _gamepadEventSupported;
+        private _gamepadSupport;
+        onGamepadConnectedObservable: Observable<Gamepad>;
+        onGamepadDisconnectedObservable: Observable<Gamepad>;
+        private _onGamepadConnectedEvent;
+        private _onGamepadDisconnectedEvent;
+        constructor();
+        readonly gamepads: Gamepad[];
+        getGamepadByType(type?: number): Gamepad;
+        dispose(): void;
+        private _addNewGamepad(gamepad);
+        private _startMonitoringGamepads();
+        private _stopMonitoringGamepads();
+        private _checkGamepadsStatus();
+        private _updateGamepadObjects();
+    }
+}
+
+declare module BABYLON {
+    enum Xbox360Button {
+        A = 0,
+        B = 1,
+        X = 2,
+        Y = 3,
+        Start = 4,
+        Back = 5,
+        LB = 6,
+        RB = 7,
+        LeftStick = 8,
+        RightStick = 9,
+    }
+    enum Xbox360Dpad {
+        Up = 0,
+        Down = 1,
+        Left = 2,
+        Right = 3,
+    }
+    class Xbox360Pad extends Gamepad {
+        private _leftTrigger;
+        private _rightTrigger;
+        private _onlefttriggerchanged;
+        private _onrighttriggerchanged;
+        private _onbuttondown;
+        private _onbuttonup;
+        private _ondpaddown;
+        private _ondpadup;
+        onButtonDownObservable: Observable<Xbox360Button>;
+        onButtonUpObservable: Observable<Xbox360Button>;
+        onPadDownObservable: Observable<Xbox360Dpad>;
+        onPadUpObservable: Observable<Xbox360Dpad>;
+        private _buttonA;
+        private _buttonB;
+        private _buttonX;
+        private _buttonY;
+        private _buttonBack;
+        private _buttonStart;
+        private _buttonLB;
+        private _buttonRB;
+        private _buttonLeftStick;
+        private _buttonRightStick;
+        private _dPadUp;
+        private _dPadDown;
+        private _dPadLeft;
+        private _dPadRight;
+        private _isXboxOnePad;
+        constructor(id: string, index: number, gamepad: any, xboxOne?: boolean);
+        onlefttriggerchanged(callback: (value: number) => void): void;
+        onrighttriggerchanged(callback: (value: number) => void): void;
+        leftTrigger: number;
+        rightTrigger: number;
+        onbuttondown(callback: (buttonPressed: Xbox360Button) => void): void;
+        onbuttonup(callback: (buttonReleased: Xbox360Button) => void): void;
+        ondpaddown(callback: (dPadPressed: Xbox360Dpad) => void): void;
+        ondpadup(callback: (dPadReleased: Xbox360Dpad) => void): void;
+        private _setButtonValue(newValue, currentValue, buttonType);
+        private _setDPadValue(newValue, currentValue, buttonType);
+        buttonA: number;
+        buttonB: number;
+        buttonX: number;
+        buttonY: number;
+        buttonStart: number;
+        buttonBack: number;
+        buttonLB: number;
+        buttonRB: number;
+        buttonLeftStick: number;
+        buttonRightStick: number;
+        dPadUp: number;
+        dPadDown: number;
+        dPadLeft: number;
+        dPadRight: number;
+        update(): void;
+    }
+}
+
+declare module BABYLON {
     class DirectionalLight extends ShadowLight {
         private _shadowFrustumSize;
         /**
@@ -6232,8 +6378,11 @@ declare module BABYLON {
         */
         onUnBindObservable: Observable<Material>;
         alphaMode: number;
+        private _needDepthPrePass;
         needDepthPrePass: boolean;
         disableDepthWrite: boolean;
+        forceDepthWrite: boolean;
+        separateCullingPass: boolean;
         private _fogEnabled;
         fogEnabled: boolean;
         pointSize: number;
@@ -9097,21 +9246,85 @@ declare module BABYLON {
         static getSphericalPolynomialFromHarmonics(harmonics: SphericalHarmonics): SphericalPolynomial;
         scale(scale: number): void;
     }
-    class SphericalHarmonics {
-        L00: Vector3;
-        L1_1: Vector3;
-        L10: Vector3;
-        L11: Vector3;
-        L2_2: Vector3;
-        L2_1: Vector3;
-        L20: Vector3;
-        L21: Vector3;
-        L22: Vector3;
-        addLight(direction: Vector3, color: Color3, deltaSolidAngle: number): void;
-        scale(scale: number): void;
-        convertIncidentRadianceToIrradiance(): void;
-        convertIrradianceToLambertianRadiance(): void;
-        static getsphericalHarmonicsFromPolynomial(polynomial: SphericalPolynomial): SphericalHarmonics;
+    class SphericalHarmonics {
+        L00: Vector3;
+        L1_1: Vector3;
+        L10: Vector3;
+        L11: Vector3;
+        L2_2: Vector3;
+        L2_1: Vector3;
+        L20: Vector3;
+        L21: Vector3;
+        L22: Vector3;
+        addLight(direction: Vector3, color: Color3, deltaSolidAngle: number): void;
+        scale(scale: number): void;
+        convertIncidentRadianceToIrradiance(): void;
+        convertIrradianceToLambertianRadiance(): void;
+        static getsphericalHarmonicsFromPolynomial(polynomial: SphericalPolynomial): SphericalHarmonics;
+    }
+}
+
+declare module BABYLON {
+    class MorphTarget {
+        name: string;
+        animations: Animation[];
+        private _positions;
+        private _normals;
+        private _tangents;
+        private _influence;
+        onInfluenceChanged: Observable<boolean>;
+        influence: number;
+        constructor(name: string, influence?: number);
+        readonly hasNormals: boolean;
+        readonly hasTangents: boolean;
+        setPositions(data: Float32Array | number[]): void;
+        getPositions(): Float32Array;
+        setNormals(data: Float32Array | number[]): void;
+        getNormals(): Float32Array;
+        setTangents(data: Float32Array | number[]): void;
+        getTangents(): Float32Array;
+        /**
+         * Serializes the current target into a Serialization object.
+         * Returns the serialized object.
+         */
+        serialize(): any;
+        static Parse(serializationObject: any): MorphTarget;
+        static FromMesh(mesh: AbstractMesh, name?: string, influence?: number): MorphTarget;
+    }
+}
+
+declare module BABYLON {
+    class MorphTargetManager {
+        private _targets;
+        private _targetObservable;
+        private _activeTargets;
+        private _scene;
+        private _influences;
+        private _supportsNormals;
+        private _supportsTangents;
+        private _vertexCount;
+        private _uniqueId;
+        private _tempInfluences;
+        constructor(scene?: Scene);
+        readonly uniqueId: number;
+        readonly vertexCount: number;
+        readonly supportsNormals: boolean;
+        readonly supportsTangents: boolean;
+        readonly numTargets: number;
+        readonly numInfluencers: number;
+        readonly influences: Float32Array;
+        getActiveTarget(index: number): MorphTarget;
+        getTarget(index: number): MorphTarget;
+        addTarget(target: MorphTarget): void;
+        removeTarget(target: MorphTarget): void;
+        /**
+         * Serializes the current manager into a Serialization object.
+         * Returns the serialized object.
+         */
+        serialize(): any;
+        private _onInfluenceChanged(needUpdate);
+        private _syncActiveTargets(needUpdate);
+        static Parse(serializationObject: any, scene: Scene): MorphTargetManager;
     }
 }
 
@@ -12543,70 +12756,6 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
-    class MorphTarget {
-        name: string;
-        animations: Animation[];
-        private _positions;
-        private _normals;
-        private _tangents;
-        private _influence;
-        onInfluenceChanged: Observable<boolean>;
-        influence: number;
-        constructor(name: string, influence?: number);
-        readonly hasNormals: boolean;
-        readonly hasTangents: boolean;
-        setPositions(data: Float32Array | number[]): void;
-        getPositions(): Float32Array;
-        setNormals(data: Float32Array | number[]): void;
-        getNormals(): Float32Array;
-        setTangents(data: Float32Array | number[]): void;
-        getTangents(): Float32Array;
-        /**
-         * Serializes the current target into a Serialization object.
-         * Returns the serialized object.
-         */
-        serialize(): any;
-        static Parse(serializationObject: any): MorphTarget;
-        static FromMesh(mesh: AbstractMesh, name?: string, influence?: number): MorphTarget;
-    }
-}
-
-declare module BABYLON {
-    class MorphTargetManager {
-        private _targets;
-        private _targetObservable;
-        private _activeTargets;
-        private _scene;
-        private _influences;
-        private _supportsNormals;
-        private _supportsTangents;
-        private _vertexCount;
-        private _uniqueId;
-        private _tempInfluences;
-        constructor(scene?: Scene);
-        readonly uniqueId: number;
-        readonly vertexCount: number;
-        readonly supportsNormals: boolean;
-        readonly supportsTangents: boolean;
-        readonly numTargets: number;
-        readonly numInfluencers: number;
-        readonly influences: Float32Array;
-        getActiveTarget(index: number): MorphTarget;
-        getTarget(index: number): MorphTarget;
-        addTarget(target: MorphTarget): void;
-        removeTarget(target: MorphTarget): void;
-        /**
-         * Serializes the current manager into a Serialization object.
-         * Returns the serialized object.
-         */
-        serialize(): any;
-        private _onInfluenceChanged(needUpdate);
-        private _syncActiveTargets(needUpdate);
-        static Parse(serializationObject: any, scene: Scene): MorphTargetManager;
-    }
-}
-
-declare module BABYLON {
     class GPUParticleSystem implements IDisposable, IParticleSystem {
         name: string;
         id: string;
@@ -13233,10 +13382,11 @@ declare module BABYLON {
         getBoundingInfo?(): BoundingInfo;
         computeWorldMatrix?(force: boolean): void;
         getWorldMatrix?(): Matrix;
-        getChildMeshes?(): Array<AbstractMesh>;
+        getChildMeshes?(directDecendantsOnly?: boolean): Array<AbstractMesh>;
         getVerticesData?(kind: string): Array<number> | Float32Array;
         getIndices?(): IndicesArray;
         getScene?(): Scene;
+        getAbsolutePosition(): Vector3;
     }
     class PhysicsImpostor {
         object: IPhysicsEnabledObject;
@@ -14425,134 +14575,6 @@ declare module BABYLON {
     }
 }
 
-declare module BABYLON.Debug {
-    class AxesViewer {
-        private _xline;
-        private _yline;
-        private _zline;
-        private _xmesh;
-        private _ymesh;
-        private _zmesh;
-        scene: Scene;
-        scaleLines: number;
-        constructor(scene: Scene, scaleLines?: number);
-        update(position: Vector3, xaxis: Vector3, yaxis: Vector3, zaxis: Vector3): void;
-        dispose(): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    class BoneAxesViewer extends Debug.AxesViewer {
-        mesh: Mesh;
-        bone: Bone;
-        pos: Vector3;
-        xaxis: Vector3;
-        yaxis: Vector3;
-        zaxis: Vector3;
-        constructor(scene: Scene, bone: Bone, mesh: Mesh, scaleLines?: number);
-        update(): void;
-        dispose(): void;
-    }
-}
-
-declare module BABYLON {
-    class DebugLayer {
-        private _scene;
-        static InspectorURL: string;
-        private _inspector;
-        constructor(scene: Scene);
-        /** Creates the inspector window. */
-        private _createInspector(config?);
-        isVisible(): boolean;
-        hide(): void;
-        show(config?: {
-            popup?: boolean;
-            initialTab?: number;
-            parentElement?: HTMLElement;
-            newColors?: {
-                backgroundColor?: string;
-                backgroundColorLighter?: string;
-                backgroundColorLighter2?: string;
-                backgroundColorLighter3?: string;
-                color?: string;
-                colorTop?: string;
-                colorBot?: string;
-            };
-        }): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    class PhysicsViewer {
-        protected _impostors: Array<PhysicsImpostor>;
-        protected _meshes: Array<AbstractMesh>;
-        protected _scene: Scene;
-        protected _numMeshes: number;
-        protected _physicsEnginePlugin: IPhysicsEnginePlugin;
-        private _renderFunction;
-        private _debugBoxMesh;
-        private _debugSphereMesh;
-        private _debugMaterial;
-        constructor(scene: Scene);
-        protected _updateDebugMeshes(): void;
-        showImpostor(impostor: PhysicsImpostor): void;
-        hideImpostor(impostor: PhysicsImpostor): void;
-        private _getDebugMaterial(scene);
-        private _getDebugBoxMesh(scene);
-        private _getDebugSphereMesh(scene);
-        private _getDebugMesh(impostor, scene);
-        dispose(): void;
-    }
-}
-
-declare module BABYLON {
-    class RayHelper {
-        ray: Ray;
-        private _renderPoints;
-        private _renderLine;
-        private _renderFunction;
-        private _scene;
-        private _updateToMeshFunction;
-        private _attachedToMesh;
-        private _meshSpaceDirection;
-        private _meshSpaceOrigin;
-        static CreateAndShow(ray: Ray, scene: Scene, color: Color3): RayHelper;
-        constructor(ray: Ray);
-        show(scene: Scene, color: Color3): void;
-        hide(): void;
-        private _render();
-        attachToMesh(mesh: AbstractMesh, meshSpaceDirection?: Vector3, meshSpaceOrigin?: Vector3, length?: number): void;
-        detachFromMesh(): void;
-        private _updateToMesh();
-        dispose(): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    /**
-    * Demo available here: http://www.babylonjs-playground.com/#1BZJVJ#8
-    */
-    class SkeletonViewer {
-        skeleton: Skeleton;
-        mesh: AbstractMesh;
-        autoUpdateBonesMatrices: boolean;
-        renderingGroupId: number;
-        color: Color3;
-        private _scene;
-        private _debugLines;
-        private _debugMesh;
-        private _isEnabled;
-        private _renderFunction;
-        constructor(skeleton: Skeleton, mesh: AbstractMesh, scene: Scene, autoUpdateBonesMatrices?: boolean, renderingGroupId?: number);
-        isEnabled: boolean;
-        private _getBonePosition(position, bone, meshMat, x?, y?, z?);
-        private _getLinesForBonesWithLength(bones, meshMat);
-        private _getLinesForBonesNoLength(bones, meshMat);
-        update(): void;
-        dispose(): void;
-    }
-}
-
 declare module BABYLON.Internals {
     class _AlphaState {
         private _isAlphaBlendDirty;
@@ -15548,6 +15570,13 @@ declare module BABYLON {
         static BaseUrl: string;
         static CorsBehavior: any;
         static UseFallbackTexture: boolean;
+        /**
+         * Use this object to register external classes like custom textures or material
+         * to allow the laoders to instantiate them
+         */
+        static RegisteredExternalClasses: {
+            [key: string]: Object;
+        };
         private static fallbackTexture;
         /**
          * Interpolates between a and b via alpha
@@ -16220,14 +16249,33 @@ declare module BABYLON {
         private _scene;
         private _position;
         private _btnVR;
-        private _webVRsupportedAndReady;
+        private _webVRsupported;
+        private _webVRready;
+        private _webVRrequesting;
+        private _webVRpresenting;
+        private _fullscreenVRpresenting;
         private _canvas;
-        private _isInVRMode;
         private _webVRCamera;
         private _vrDeviceOrientationCamera;
         private _deviceOrientationCamera;
+        private _onKeyDown;
+        private _onVrDisplayPresentChange;
+        private _onVRDisplayChanged;
+        private _onVRRequestPresentStart;
+        private _onVRRequestPresentComplete;
         constructor(scene: Scene, webVROptions?: WebVROptions);
+        private isInVRMode();
+        private onVrDisplayPresentChange();
+        private onVRDisplayChanged(eventArgs);
+        private updateButtonVisibility();
+        /**
+         * Attempt to enter VR. If a headset is connected and ready, will request present on that.
+         * Otherwise, will use the fullscreen API.
+         */
         enterVR(): void;
+        /**
+         * Attempt to exit VR, or fullscreen.
+         */
         exitVR(): void;
         position: Vector3;
         dispose(): void;
@@ -16273,7 +16321,7 @@ declare module BABYLON {
         private webVROptions;
         _vrDevice: any;
         rawPose: DevicePose;
-        private _vrEnabled;
+        private _onVREnabled;
         private _specsVersion;
         private _attached;
         private _oldSize;
@@ -16290,6 +16338,7 @@ declare module BABYLON {
         rigParenting: boolean;
         private _lightOnControllers;
         constructor(name: string, position: Vector3, scene: Scene, webVROptions?: WebVROptions);
+        dispose(): void;
         getControllerByName(name: string): WebVRController;
         private _leftController;
         readonly leftController: WebVRController;
@@ -16390,6 +16439,7 @@ declare module BABYLON {
         pinchPrecision: number;
         panningSensibility: number;
         multiTouchPanning: boolean;
+        multiTouchPanAndZoom: boolean;
         private _isPanClick;
         pinchInwards: boolean;
         private _pointerInput;
@@ -18431,6 +18481,7 @@ declare module BABYLON {
         private _physicsMaterials;
         private _fixedTimeStep;
         private _currentCollisionGroup;
+        BJSCANNON: any;
         constructor(_useDeltaForWorldStep?: boolean, iterations?: number);
         setGravity(gravity: Vector3): void;
         setTimeStep(timeStep: number): void;
@@ -18486,6 +18537,7 @@ declare module BABYLON {
     class OimoJSPlugin implements IPhysicsEnginePlugin {
         world: any;
         name: string;
+        BJSOIMO: any;
         constructor(iterations?: number);
         setGravity(gravity: Vector3): void;
         setTimeStep(timeStep: number): void;

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

@@ -1,6 +1,8 @@
-export = BABYLON;
-export as namespace BABYLON;
 
+
+declare module 'babylonjs' { 
+    export = BABYLON; 
+}
 declare module BABYLON {
     class InstancingAttributeInfo {
         /**
@@ -87,6 +89,10 @@ declare module BABYLON {
         lockstepMaxSteps?: number;
         doNotHandleContextLost?: boolean;
     }
+    interface IDisplayChangedEventArgs {
+        vrDisplay: any;
+        vrSupported: boolean;
+    }
     /**
      * The engine class is responsible for interfacing with all lower-level APIs such as WebGL and Audio.
      */
@@ -209,9 +215,12 @@ declare module BABYLON {
          * Observable event triggered each time the canvas receives pointerout event
          */
         onCanvasPointerOutObservable: Observable<Engine>;
-        vrDisplaysPromise: any;
-        private _vrDisplays;
-        private _vrDisplayEnabled;
+        /**
+         * Observable event triggered before each texture is initialized
+         */
+        onBeforeTextureInitObservable: Observable<Texture>;
+        private _vrDisplay;
+        private _vrSupported;
         private _oldSize;
         private _oldHardwareScaleFactor;
         private _vrExclusivePointerMode;
@@ -238,6 +247,12 @@ declare module BABYLON {
         private _onPointerLockChange;
         private _onVRDisplayPointerRestricted;
         private _onVRDisplayPointerUnrestricted;
+        private _onVrDisplayConnect;
+        private _onVrDisplayDisconnect;
+        private _onVrDisplayPresentChange;
+        onVRDisplayChangedObservable: Observable<IDisplayChangedEventArgs>;
+        onVRRequestPresentComplete: Observable<boolean>;
+        onVRRequestPresentStart: Observable<Engine>;
         private _hardwareScalingLevel;
         private _caps;
         private _pointerLockRequested;
@@ -423,13 +438,16 @@ declare module BABYLON {
          * @param {number} height - the new canvas' height
          */
         setSize(width: number, height: number): void;
-        isVRDevicePresent(callback: (result: boolean) => void): void;
-        getVRDevice(name: string, callback: (device: any) => void): void;
-        initWebVR(): void;
-        enableVR(vrDevice: any): void;
+        isVRDevicePresent(): boolean;
+        getVRDevice(): any;
+        initWebVR(): Observable<{
+            vrDisplay: any;
+            vrSupported: any;
+        }>;
+        enableVR(): void;
         disableVR(): void;
         private _onVRFullScreenTriggered;
-        private _getVRDisplays();
+        private _getVRDisplays(callback);
         bindFramebuffer(texture: InternalTexture, faceIndex?: number, requiredWidth?: number, requiredHeight?: number, forceFullscreenViewport?: boolean): void;
         private bindUnboundFramebuffer(framebuffer);
         unBindFramebuffer(texture: InternalTexture, disableGenerateMipMaps?: boolean, onBeforeUnbind?: () => void): void;
@@ -2267,6 +2285,7 @@ declare module BABYLON {
         private _child;
         private _condition;
         private _triggerParameter;
+        onBeforeExecuteObservable: Observable<Action>;
         constructor(triggerOptions: any, condition?: Condition);
         _prepare(): void;
         getTriggerParameter(): any;
@@ -2588,6 +2607,7 @@ declare module BABYLON {
         private _target;
         private _effectiveTarget;
         private _property;
+        onInterpolationDoneObservable: Observable<InterpolateValueAction>;
         constructor(triggerOptions: any, target: any, propertyPath: string, value: any, duration?: number, condition?: Condition, stopOtherAnimations?: boolean, onInterpolationDone?: () => void);
         _prepare(): void;
         execute(): void;
@@ -4426,6 +4446,134 @@ declare module BABYLON {
     }
 }
 
+declare module BABYLON.Debug {
+    class AxesViewer {
+        private _xline;
+        private _yline;
+        private _zline;
+        private _xmesh;
+        private _ymesh;
+        private _zmesh;
+        scene: Scene;
+        scaleLines: number;
+        constructor(scene: Scene, scaleLines?: number);
+        update(position: Vector3, xaxis: Vector3, yaxis: Vector3, zaxis: Vector3): void;
+        dispose(): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    class BoneAxesViewer extends Debug.AxesViewer {
+        mesh: Mesh;
+        bone: Bone;
+        pos: Vector3;
+        xaxis: Vector3;
+        yaxis: Vector3;
+        zaxis: Vector3;
+        constructor(scene: Scene, bone: Bone, mesh: Mesh, scaleLines?: number);
+        update(): void;
+        dispose(): void;
+    }
+}
+
+declare module BABYLON {
+    class DebugLayer {
+        private _scene;
+        static InspectorURL: string;
+        private _inspector;
+        constructor(scene: Scene);
+        /** Creates the inspector window. */
+        private _createInspector(config?);
+        isVisible(): boolean;
+        hide(): void;
+        show(config?: {
+            popup?: boolean;
+            initialTab?: number;
+            parentElement?: HTMLElement;
+            newColors?: {
+                backgroundColor?: string;
+                backgroundColorLighter?: string;
+                backgroundColorLighter2?: string;
+                backgroundColorLighter3?: string;
+                color?: string;
+                colorTop?: string;
+                colorBot?: string;
+            };
+        }): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    class PhysicsViewer {
+        protected _impostors: Array<PhysicsImpostor>;
+        protected _meshes: Array<AbstractMesh>;
+        protected _scene: Scene;
+        protected _numMeshes: number;
+        protected _physicsEnginePlugin: IPhysicsEnginePlugin;
+        private _renderFunction;
+        private _debugBoxMesh;
+        private _debugSphereMesh;
+        private _debugMaterial;
+        constructor(scene: Scene);
+        protected _updateDebugMeshes(): void;
+        showImpostor(impostor: PhysicsImpostor): void;
+        hideImpostor(impostor: PhysicsImpostor): void;
+        private _getDebugMaterial(scene);
+        private _getDebugBoxMesh(scene);
+        private _getDebugSphereMesh(scene);
+        private _getDebugMesh(impostor, scene);
+        dispose(): void;
+    }
+}
+
+declare module BABYLON {
+    class RayHelper {
+        ray: Ray;
+        private _renderPoints;
+        private _renderLine;
+        private _renderFunction;
+        private _scene;
+        private _updateToMeshFunction;
+        private _attachedToMesh;
+        private _meshSpaceDirection;
+        private _meshSpaceOrigin;
+        static CreateAndShow(ray: Ray, scene: Scene, color: Color3): RayHelper;
+        constructor(ray: Ray);
+        show(scene: Scene, color: Color3): void;
+        hide(): void;
+        private _render();
+        attachToMesh(mesh: AbstractMesh, meshSpaceDirection?: Vector3, meshSpaceOrigin?: Vector3, length?: number): void;
+        detachFromMesh(): void;
+        private _updateToMesh();
+        dispose(): void;
+    }
+}
+
+declare module BABYLON.Debug {
+    /**
+    * Demo available here: http://www.babylonjs-playground.com/#1BZJVJ#8
+    */
+    class SkeletonViewer {
+        skeleton: Skeleton;
+        mesh: AbstractMesh;
+        autoUpdateBonesMatrices: boolean;
+        renderingGroupId: number;
+        color: Color3;
+        private _scene;
+        private _debugLines;
+        private _debugMesh;
+        private _isEnabled;
+        private _renderFunction;
+        constructor(skeleton: Skeleton, mesh: AbstractMesh, scene: Scene, autoUpdateBonesMatrices?: boolean, renderingGroupId?: number);
+        isEnabled: boolean;
+        private _getBonePosition(position, bone, meshMat, x?, y?, z?);
+        private _getLinesForBonesWithLength(bones, meshMat);
+        private _getLinesForBonesNoLength(bones, meshMat);
+        update(): void;
+        dispose(): void;
+    }
+}
+
 declare module BABYLON {
     class KeyboardEventTypes {
         static _KEYDOWN: number;
@@ -4490,158 +4638,6 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
-    class StickValues {
-        x: any;
-        y: any;
-        constructor(x: any, y: any);
-    }
-    interface GamepadButtonChanges {
-        changed: boolean;
-        pressChanged: boolean;
-        touchChanged: boolean;
-        valueChanged: boolean;
-    }
-    class Gamepad {
-        id: string;
-        index: number;
-        browserGamepad: any;
-        type: number;
-        private _leftStick;
-        private _rightStick;
-        _isConnected: boolean;
-        private _leftStickAxisX;
-        private _leftStickAxisY;
-        private _rightStickAxisX;
-        private _rightStickAxisY;
-        private _onleftstickchanged;
-        private _onrightstickchanged;
-        static GAMEPAD: number;
-        static GENERIC: number;
-        static XBOX: number;
-        static POSE_ENABLED: number;
-        readonly isConnected: boolean;
-        constructor(id: string, index: number, browserGamepad: any, leftStickX?: number, leftStickY?: number, rightStickX?: number, rightStickY?: number);
-        onleftstickchanged(callback: (values: StickValues) => void): void;
-        onrightstickchanged(callback: (values: StickValues) => void): void;
-        leftStick: StickValues;
-        rightStick: StickValues;
-        update(): void;
-        dispose(): void;
-    }
-    class GenericPad extends Gamepad {
-        private _buttons;
-        private _onbuttondown;
-        private _onbuttonup;
-        onButtonDownObservable: Observable<number>;
-        onButtonUpObservable: Observable<number>;
-        onbuttondown(callback: (buttonPressed: number) => void): void;
-        onbuttonup(callback: (buttonReleased: number) => void): void;
-        constructor(id: string, index: number, browserGamepad: any);
-        private _setButtonValue(newValue, currentValue, buttonIndex);
-        update(): void;
-    }
-}
-
-declare module BABYLON {
-    class GamepadManager {
-        private _babylonGamepads;
-        private _oneGamepadConnected;
-        private _isMonitoring;
-        private _gamepadEventSupported;
-        private _gamepadSupport;
-        onGamepadConnectedObservable: Observable<Gamepad>;
-        onGamepadDisconnectedObservable: Observable<Gamepad>;
-        private _onGamepadConnectedEvent;
-        private _onGamepadDisconnectedEvent;
-        constructor();
-        readonly gamepads: Gamepad[];
-        getGamepadByType(type?: number): Gamepad;
-        dispose(): void;
-        private _addNewGamepad(gamepad);
-        private _startMonitoringGamepads();
-        private _stopMonitoringGamepads();
-        private _checkGamepadsStatus();
-        private _updateGamepadObjects();
-    }
-}
-
-declare module BABYLON {
-    enum Xbox360Button {
-        A = 0,
-        B = 1,
-        X = 2,
-        Y = 3,
-        Start = 4,
-        Back = 5,
-        LB = 6,
-        RB = 7,
-        LeftStick = 8,
-        RightStick = 9,
-    }
-    enum Xbox360Dpad {
-        Up = 0,
-        Down = 1,
-        Left = 2,
-        Right = 3,
-    }
-    class Xbox360Pad extends Gamepad {
-        private _leftTrigger;
-        private _rightTrigger;
-        private _onlefttriggerchanged;
-        private _onrighttriggerchanged;
-        private _onbuttondown;
-        private _onbuttonup;
-        private _ondpaddown;
-        private _ondpadup;
-        onButtonDownObservable: Observable<Xbox360Button>;
-        onButtonUpObservable: Observable<Xbox360Button>;
-        onPadDownObservable: Observable<Xbox360Dpad>;
-        onPadUpObservable: Observable<Xbox360Dpad>;
-        private _buttonA;
-        private _buttonB;
-        private _buttonX;
-        private _buttonY;
-        private _buttonBack;
-        private _buttonStart;
-        private _buttonLB;
-        private _buttonRB;
-        private _buttonLeftStick;
-        private _buttonRightStick;
-        private _dPadUp;
-        private _dPadDown;
-        private _dPadLeft;
-        private _dPadRight;
-        private _isXboxOnePad;
-        constructor(id: string, index: number, gamepad: any, xboxOne?: boolean);
-        onlefttriggerchanged(callback: (value: number) => void): void;
-        onrighttriggerchanged(callback: (value: number) => void): void;
-        leftTrigger: number;
-        rightTrigger: number;
-        onbuttondown(callback: (buttonPressed: Xbox360Button) => void): void;
-        onbuttonup(callback: (buttonReleased: Xbox360Button) => void): void;
-        ondpaddown(callback: (dPadPressed: Xbox360Dpad) => void): void;
-        ondpadup(callback: (dPadReleased: Xbox360Dpad) => void): void;
-        private _setButtonValue(newValue, currentValue, buttonType);
-        private _setDPadValue(newValue, currentValue, buttonType);
-        buttonA: number;
-        buttonB: number;
-        buttonX: number;
-        buttonY: number;
-        buttonStart: number;
-        buttonBack: number;
-        buttonLB: number;
-        buttonRB: number;
-        buttonLeftStick: number;
-        buttonRightStick: number;
-        dPadUp: number;
-        dPadDown: number;
-        dPadLeft: number;
-        dPadRight: number;
-        update(): void;
-    }
-}
-
-declare module BABYLON {
     /**
      * Highlight layer options. This helps customizing the behaviour
      * of the highlight layer.
@@ -4947,6 +4943,158 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
+    class StickValues {
+        x: any;
+        y: any;
+        constructor(x: any, y: any);
+    }
+    interface GamepadButtonChanges {
+        changed: boolean;
+        pressChanged: boolean;
+        touchChanged: boolean;
+        valueChanged: boolean;
+    }
+    class Gamepad {
+        id: string;
+        index: number;
+        browserGamepad: any;
+        type: number;
+        private _leftStick;
+        private _rightStick;
+        _isConnected: boolean;
+        private _leftStickAxisX;
+        private _leftStickAxisY;
+        private _rightStickAxisX;
+        private _rightStickAxisY;
+        private _onleftstickchanged;
+        private _onrightstickchanged;
+        static GAMEPAD: number;
+        static GENERIC: number;
+        static XBOX: number;
+        static POSE_ENABLED: number;
+        readonly isConnected: boolean;
+        constructor(id: string, index: number, browserGamepad: any, leftStickX?: number, leftStickY?: number, rightStickX?: number, rightStickY?: number);
+        onleftstickchanged(callback: (values: StickValues) => void): void;
+        onrightstickchanged(callback: (values: StickValues) => void): void;
+        leftStick: StickValues;
+        rightStick: StickValues;
+        update(): void;
+        dispose(): void;
+    }
+    class GenericPad extends Gamepad {
+        private _buttons;
+        private _onbuttondown;
+        private _onbuttonup;
+        onButtonDownObservable: Observable<number>;
+        onButtonUpObservable: Observable<number>;
+        onbuttondown(callback: (buttonPressed: number) => void): void;
+        onbuttonup(callback: (buttonReleased: number) => void): void;
+        constructor(id: string, index: number, browserGamepad: any);
+        private _setButtonValue(newValue, currentValue, buttonIndex);
+        update(): void;
+    }
+}
+
+declare module BABYLON {
+    class GamepadManager {
+        private _babylonGamepads;
+        private _oneGamepadConnected;
+        private _isMonitoring;
+        private _gamepadEventSupported;
+        private _gamepadSupport;
+        onGamepadConnectedObservable: Observable<Gamepad>;
+        onGamepadDisconnectedObservable: Observable<Gamepad>;
+        private _onGamepadConnectedEvent;
+        private _onGamepadDisconnectedEvent;
+        constructor();
+        readonly gamepads: Gamepad[];
+        getGamepadByType(type?: number): Gamepad;
+        dispose(): void;
+        private _addNewGamepad(gamepad);
+        private _startMonitoringGamepads();
+        private _stopMonitoringGamepads();
+        private _checkGamepadsStatus();
+        private _updateGamepadObjects();
+    }
+}
+
+declare module BABYLON {
+    enum Xbox360Button {
+        A = 0,
+        B = 1,
+        X = 2,
+        Y = 3,
+        Start = 4,
+        Back = 5,
+        LB = 6,
+        RB = 7,
+        LeftStick = 8,
+        RightStick = 9,
+    }
+    enum Xbox360Dpad {
+        Up = 0,
+        Down = 1,
+        Left = 2,
+        Right = 3,
+    }
+    class Xbox360Pad extends Gamepad {
+        private _leftTrigger;
+        private _rightTrigger;
+        private _onlefttriggerchanged;
+        private _onrighttriggerchanged;
+        private _onbuttondown;
+        private _onbuttonup;
+        private _ondpaddown;
+        private _ondpadup;
+        onButtonDownObservable: Observable<Xbox360Button>;
+        onButtonUpObservable: Observable<Xbox360Button>;
+        onPadDownObservable: Observable<Xbox360Dpad>;
+        onPadUpObservable: Observable<Xbox360Dpad>;
+        private _buttonA;
+        private _buttonB;
+        private _buttonX;
+        private _buttonY;
+        private _buttonBack;
+        private _buttonStart;
+        private _buttonLB;
+        private _buttonRB;
+        private _buttonLeftStick;
+        private _buttonRightStick;
+        private _dPadUp;
+        private _dPadDown;
+        private _dPadLeft;
+        private _dPadRight;
+        private _isXboxOnePad;
+        constructor(id: string, index: number, gamepad: any, xboxOne?: boolean);
+        onlefttriggerchanged(callback: (value: number) => void): void;
+        onrighttriggerchanged(callback: (value: number) => void): void;
+        leftTrigger: number;
+        rightTrigger: number;
+        onbuttondown(callback: (buttonPressed: Xbox360Button) => void): void;
+        onbuttonup(callback: (buttonReleased: Xbox360Button) => void): void;
+        ondpaddown(callback: (dPadPressed: Xbox360Dpad) => void): void;
+        ondpadup(callback: (dPadReleased: Xbox360Dpad) => void): void;
+        private _setButtonValue(newValue, currentValue, buttonType);
+        private _setDPadValue(newValue, currentValue, buttonType);
+        buttonA: number;
+        buttonB: number;
+        buttonX: number;
+        buttonY: number;
+        buttonStart: number;
+        buttonBack: number;
+        buttonLB: number;
+        buttonRB: number;
+        buttonLeftStick: number;
+        buttonRightStick: number;
+        dPadUp: number;
+        dPadDown: number;
+        dPadLeft: number;
+        dPadRight: number;
+        update(): void;
+    }
+}
+
+declare module BABYLON {
     class DirectionalLight extends ShadowLight {
         private _shadowFrustumSize;
         /**
@@ -6235,8 +6383,11 @@ declare module BABYLON {
         */
         onUnBindObservable: Observable<Material>;
         alphaMode: number;
+        private _needDepthPrePass;
         needDepthPrePass: boolean;
         disableDepthWrite: boolean;
+        forceDepthWrite: boolean;
+        separateCullingPass: boolean;
         private _fogEnabled;
         fogEnabled: boolean;
         pointSize: number;
@@ -9100,21 +9251,85 @@ declare module BABYLON {
         static getSphericalPolynomialFromHarmonics(harmonics: SphericalHarmonics): SphericalPolynomial;
         scale(scale: number): void;
     }
-    class SphericalHarmonics {
-        L00: Vector3;
-        L1_1: Vector3;
-        L10: Vector3;
-        L11: Vector3;
-        L2_2: Vector3;
-        L2_1: Vector3;
-        L20: Vector3;
-        L21: Vector3;
-        L22: Vector3;
-        addLight(direction: Vector3, color: Color3, deltaSolidAngle: number): void;
-        scale(scale: number): void;
-        convertIncidentRadianceToIrradiance(): void;
-        convertIrradianceToLambertianRadiance(): void;
-        static getsphericalHarmonicsFromPolynomial(polynomial: SphericalPolynomial): SphericalHarmonics;
+    class SphericalHarmonics {
+        L00: Vector3;
+        L1_1: Vector3;
+        L10: Vector3;
+        L11: Vector3;
+        L2_2: Vector3;
+        L2_1: Vector3;
+        L20: Vector3;
+        L21: Vector3;
+        L22: Vector3;
+        addLight(direction: Vector3, color: Color3, deltaSolidAngle: number): void;
+        scale(scale: number): void;
+        convertIncidentRadianceToIrradiance(): void;
+        convertIrradianceToLambertianRadiance(): void;
+        static getsphericalHarmonicsFromPolynomial(polynomial: SphericalPolynomial): SphericalHarmonics;
+    }
+}
+
+declare module BABYLON {
+    class MorphTarget {
+        name: string;
+        animations: Animation[];
+        private _positions;
+        private _normals;
+        private _tangents;
+        private _influence;
+        onInfluenceChanged: Observable<boolean>;
+        influence: number;
+        constructor(name: string, influence?: number);
+        readonly hasNormals: boolean;
+        readonly hasTangents: boolean;
+        setPositions(data: Float32Array | number[]): void;
+        getPositions(): Float32Array;
+        setNormals(data: Float32Array | number[]): void;
+        getNormals(): Float32Array;
+        setTangents(data: Float32Array | number[]): void;
+        getTangents(): Float32Array;
+        /**
+         * Serializes the current target into a Serialization object.
+         * Returns the serialized object.
+         */
+        serialize(): any;
+        static Parse(serializationObject: any): MorphTarget;
+        static FromMesh(mesh: AbstractMesh, name?: string, influence?: number): MorphTarget;
+    }
+}
+
+declare module BABYLON {
+    class MorphTargetManager {
+        private _targets;
+        private _targetObservable;
+        private _activeTargets;
+        private _scene;
+        private _influences;
+        private _supportsNormals;
+        private _supportsTangents;
+        private _vertexCount;
+        private _uniqueId;
+        private _tempInfluences;
+        constructor(scene?: Scene);
+        readonly uniqueId: number;
+        readonly vertexCount: number;
+        readonly supportsNormals: boolean;
+        readonly supportsTangents: boolean;
+        readonly numTargets: number;
+        readonly numInfluencers: number;
+        readonly influences: Float32Array;
+        getActiveTarget(index: number): MorphTarget;
+        getTarget(index: number): MorphTarget;
+        addTarget(target: MorphTarget): void;
+        removeTarget(target: MorphTarget): void;
+        /**
+         * Serializes the current manager into a Serialization object.
+         * Returns the serialized object.
+         */
+        serialize(): any;
+        private _onInfluenceChanged(needUpdate);
+        private _syncActiveTargets(needUpdate);
+        static Parse(serializationObject: any, scene: Scene): MorphTargetManager;
     }
 }
 
@@ -12546,70 +12761,6 @@ declare module BABYLON {
 }
 
 declare module BABYLON {
-    class MorphTarget {
-        name: string;
-        animations: Animation[];
-        private _positions;
-        private _normals;
-        private _tangents;
-        private _influence;
-        onInfluenceChanged: Observable<boolean>;
-        influence: number;
-        constructor(name: string, influence?: number);
-        readonly hasNormals: boolean;
-        readonly hasTangents: boolean;
-        setPositions(data: Float32Array | number[]): void;
-        getPositions(): Float32Array;
-        setNormals(data: Float32Array | number[]): void;
-        getNormals(): Float32Array;
-        setTangents(data: Float32Array | number[]): void;
-        getTangents(): Float32Array;
-        /**
-         * Serializes the current target into a Serialization object.
-         * Returns the serialized object.
-         */
-        serialize(): any;
-        static Parse(serializationObject: any): MorphTarget;
-        static FromMesh(mesh: AbstractMesh, name?: string, influence?: number): MorphTarget;
-    }
-}
-
-declare module BABYLON {
-    class MorphTargetManager {
-        private _targets;
-        private _targetObservable;
-        private _activeTargets;
-        private _scene;
-        private _influences;
-        private _supportsNormals;
-        private _supportsTangents;
-        private _vertexCount;
-        private _uniqueId;
-        private _tempInfluences;
-        constructor(scene?: Scene);
-        readonly uniqueId: number;
-        readonly vertexCount: number;
-        readonly supportsNormals: boolean;
-        readonly supportsTangents: boolean;
-        readonly numTargets: number;
-        readonly numInfluencers: number;
-        readonly influences: Float32Array;
-        getActiveTarget(index: number): MorphTarget;
-        getTarget(index: number): MorphTarget;
-        addTarget(target: MorphTarget): void;
-        removeTarget(target: MorphTarget): void;
-        /**
-         * Serializes the current manager into a Serialization object.
-         * Returns the serialized object.
-         */
-        serialize(): any;
-        private _onInfluenceChanged(needUpdate);
-        private _syncActiveTargets(needUpdate);
-        static Parse(serializationObject: any, scene: Scene): MorphTargetManager;
-    }
-}
-
-declare module BABYLON {
     class GPUParticleSystem implements IDisposable, IParticleSystem {
         name: string;
         id: string;
@@ -13236,10 +13387,11 @@ declare module BABYLON {
         getBoundingInfo?(): BoundingInfo;
         computeWorldMatrix?(force: boolean): void;
         getWorldMatrix?(): Matrix;
-        getChildMeshes?(): Array<AbstractMesh>;
+        getChildMeshes?(directDecendantsOnly?: boolean): Array<AbstractMesh>;
         getVerticesData?(kind: string): Array<number> | Float32Array;
         getIndices?(): IndicesArray;
         getScene?(): Scene;
+        getAbsolutePosition(): Vector3;
     }
     class PhysicsImpostor {
         object: IPhysicsEnabledObject;
@@ -14428,134 +14580,6 @@ declare module BABYLON {
     }
 }
 
-declare module BABYLON.Debug {
-    class AxesViewer {
-        private _xline;
-        private _yline;
-        private _zline;
-        private _xmesh;
-        private _ymesh;
-        private _zmesh;
-        scene: Scene;
-        scaleLines: number;
-        constructor(scene: Scene, scaleLines?: number);
-        update(position: Vector3, xaxis: Vector3, yaxis: Vector3, zaxis: Vector3): void;
-        dispose(): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    class BoneAxesViewer extends Debug.AxesViewer {
-        mesh: Mesh;
-        bone: Bone;
-        pos: Vector3;
-        xaxis: Vector3;
-        yaxis: Vector3;
-        zaxis: Vector3;
-        constructor(scene: Scene, bone: Bone, mesh: Mesh, scaleLines?: number);
-        update(): void;
-        dispose(): void;
-    }
-}
-
-declare module BABYLON {
-    class DebugLayer {
-        private _scene;
-        static InspectorURL: string;
-        private _inspector;
-        constructor(scene: Scene);
-        /** Creates the inspector window. */
-        private _createInspector(config?);
-        isVisible(): boolean;
-        hide(): void;
-        show(config?: {
-            popup?: boolean;
-            initialTab?: number;
-            parentElement?: HTMLElement;
-            newColors?: {
-                backgroundColor?: string;
-                backgroundColorLighter?: string;
-                backgroundColorLighter2?: string;
-                backgroundColorLighter3?: string;
-                color?: string;
-                colorTop?: string;
-                colorBot?: string;
-            };
-        }): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    class PhysicsViewer {
-        protected _impostors: Array<PhysicsImpostor>;
-        protected _meshes: Array<AbstractMesh>;
-        protected _scene: Scene;
-        protected _numMeshes: number;
-        protected _physicsEnginePlugin: IPhysicsEnginePlugin;
-        private _renderFunction;
-        private _debugBoxMesh;
-        private _debugSphereMesh;
-        private _debugMaterial;
-        constructor(scene: Scene);
-        protected _updateDebugMeshes(): void;
-        showImpostor(impostor: PhysicsImpostor): void;
-        hideImpostor(impostor: PhysicsImpostor): void;
-        private _getDebugMaterial(scene);
-        private _getDebugBoxMesh(scene);
-        private _getDebugSphereMesh(scene);
-        private _getDebugMesh(impostor, scene);
-        dispose(): void;
-    }
-}
-
-declare module BABYLON {
-    class RayHelper {
-        ray: Ray;
-        private _renderPoints;
-        private _renderLine;
-        private _renderFunction;
-        private _scene;
-        private _updateToMeshFunction;
-        private _attachedToMesh;
-        private _meshSpaceDirection;
-        private _meshSpaceOrigin;
-        static CreateAndShow(ray: Ray, scene: Scene, color: Color3): RayHelper;
-        constructor(ray: Ray);
-        show(scene: Scene, color: Color3): void;
-        hide(): void;
-        private _render();
-        attachToMesh(mesh: AbstractMesh, meshSpaceDirection?: Vector3, meshSpaceOrigin?: Vector3, length?: number): void;
-        detachFromMesh(): void;
-        private _updateToMesh();
-        dispose(): void;
-    }
-}
-
-declare module BABYLON.Debug {
-    /**
-    * Demo available here: http://www.babylonjs-playground.com/#1BZJVJ#8
-    */
-    class SkeletonViewer {
-        skeleton: Skeleton;
-        mesh: AbstractMesh;
-        autoUpdateBonesMatrices: boolean;
-        renderingGroupId: number;
-        color: Color3;
-        private _scene;
-        private _debugLines;
-        private _debugMesh;
-        private _isEnabled;
-        private _renderFunction;
-        constructor(skeleton: Skeleton, mesh: AbstractMesh, scene: Scene, autoUpdateBonesMatrices?: boolean, renderingGroupId?: number);
-        isEnabled: boolean;
-        private _getBonePosition(position, bone, meshMat, x?, y?, z?);
-        private _getLinesForBonesWithLength(bones, meshMat);
-        private _getLinesForBonesNoLength(bones, meshMat);
-        update(): void;
-        dispose(): void;
-    }
-}
-
 declare module BABYLON.Internals {
     class _AlphaState {
         private _isAlphaBlendDirty;
@@ -15551,6 +15575,13 @@ declare module BABYLON {
         static BaseUrl: string;
         static CorsBehavior: any;
         static UseFallbackTexture: boolean;
+        /**
+         * Use this object to register external classes like custom textures or material
+         * to allow the laoders to instantiate them
+         */
+        static RegisteredExternalClasses: {
+            [key: string]: Object;
+        };
         private static fallbackTexture;
         /**
          * Interpolates between a and b via alpha
@@ -16223,14 +16254,33 @@ declare module BABYLON {
         private _scene;
         private _position;
         private _btnVR;
-        private _webVRsupportedAndReady;
+        private _webVRsupported;
+        private _webVRready;
+        private _webVRrequesting;
+        private _webVRpresenting;
+        private _fullscreenVRpresenting;
         private _canvas;
-        private _isInVRMode;
         private _webVRCamera;
         private _vrDeviceOrientationCamera;
         private _deviceOrientationCamera;
+        private _onKeyDown;
+        private _onVrDisplayPresentChange;
+        private _onVRDisplayChanged;
+        private _onVRRequestPresentStart;
+        private _onVRRequestPresentComplete;
         constructor(scene: Scene, webVROptions?: WebVROptions);
+        private isInVRMode();
+        private onVrDisplayPresentChange();
+        private onVRDisplayChanged(eventArgs);
+        private updateButtonVisibility();
+        /**
+         * Attempt to enter VR. If a headset is connected and ready, will request present on that.
+         * Otherwise, will use the fullscreen API.
+         */
         enterVR(): void;
+        /**
+         * Attempt to exit VR, or fullscreen.
+         */
         exitVR(): void;
         position: Vector3;
         dispose(): void;
@@ -16276,7 +16326,7 @@ declare module BABYLON {
         private webVROptions;
         _vrDevice: any;
         rawPose: DevicePose;
-        private _vrEnabled;
+        private _onVREnabled;
         private _specsVersion;
         private _attached;
         private _oldSize;
@@ -16293,6 +16343,7 @@ declare module BABYLON {
         rigParenting: boolean;
         private _lightOnControllers;
         constructor(name: string, position: Vector3, scene: Scene, webVROptions?: WebVROptions);
+        dispose(): void;
         getControllerByName(name: string): WebVRController;
         private _leftController;
         readonly leftController: WebVRController;
@@ -16393,6 +16444,7 @@ declare module BABYLON {
         pinchPrecision: number;
         panningSensibility: number;
         multiTouchPanning: boolean;
+        multiTouchPanAndZoom: boolean;
         private _isPanClick;
         pinchInwards: boolean;
         private _pointerInput;
@@ -18434,6 +18486,7 @@ declare module BABYLON {
         private _physicsMaterials;
         private _fixedTimeStep;
         private _currentCollisionGroup;
+        BJSCANNON: any;
         constructor(_useDeltaForWorldStep?: boolean, iterations?: number);
         setGravity(gravity: Vector3): void;
         setTimeStep(timeStep: number): void;
@@ -18489,6 +18542,7 @@ declare module BABYLON {
     class OimoJSPlugin implements IPhysicsEnginePlugin {
         world: any;
         name: string;
+        BJSOIMO: any;
         constructor(iterations?: number);
         setGravity(gravity: Vector3): void;
         setTimeStep(timeStep: number): void;

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

@@ -602,8 +602,10 @@ declare module BABYLON.GUI {
     class InputText extends Control implements IFocusableControl {
         name: string;
         private _text;
+        private _placeholderText;
         private _background;
         private _focusedBackground;
+        private _placeholderColor;
         private _thickness;
         private _margin;
         private _autoStretchWidth;
@@ -623,6 +625,8 @@ declare module BABYLON.GUI {
         thickness: number;
         focusedBackground: string;
         background: string;
+        placeholderColor: string;
+        placeholderText: string;
         text: string;
         constructor(name?: string, text?: string);
         onBlur(): void;

dist/preview release/gui/babylon.gui.js

@@ -1,14 +1,22 @@
-/// <reference path="../../dist/preview release/babylon.d.ts"/>
+var BABYLON = BABYLON || (typeof require !== 'undefined' && require("babylonjs"));
+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);
+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;
+return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 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 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 __());
+            };
+        })();
+        /// <reference path="../../dist/preview release/babylon.d.ts"/>
+
 var BABYLON;
 (function (BABYLON) {
     var GUI;
@@ -309,7 +317,7 @@ var BABYLON;
                     var y = (scene.pointerY / engine.getHardwareScalingLevel() - viewport.y * engine.getRenderHeight()) / viewport.height;
                     _this._shouldBlockPointer = false;
                     _this._doPicking(x, y, pi.type);
-                    pi.skipOnPointerObservable = _this._shouldBlockPointer && pi.type !== BABYLON.PointerEventTypes.POINTERUP;
+                    pi.skipOnPointerObservable = _this._shouldBlockPointer;
                 });
                 this._attachToOnPointerOut(scene);
             };
@@ -1639,16 +1647,7 @@ var BABYLON;
 //# sourceMappingURL=control.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -1819,16 +1818,7 @@ var BABYLON;
 //# sourceMappingURL=container.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -1970,16 +1960,7 @@ var BABYLON;
 //# sourceMappingURL=stackPanel.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2095,16 +2076,7 @@ var BABYLON;
 //# sourceMappingURL=rectangle.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2170,16 +2142,7 @@ var BABYLON;
 //# sourceMappingURL=ellipse.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2379,16 +2342,7 @@ var BABYLON;
 //# sourceMappingURL=line.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2583,16 +2537,7 @@ var BABYLON;
 //# sourceMappingURL=slider.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2708,16 +2653,7 @@ var BABYLON;
 //# sourceMappingURL=checkBox.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -2854,16 +2790,7 @@ var BABYLON;
 //# sourceMappingURL=radioButton.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -3040,16 +2967,7 @@ var BABYLON;
 //# sourceMappingURL=textBlock.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 DOMImage = Image;
 var BABYLON;
 (function (BABYLON) {
@@ -3292,16 +3210,7 @@ var BABYLON;
 //# sourceMappingURL=image.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -3417,16 +3326,7 @@ var BABYLON;
 //# sourceMappingURL=button.js.map
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -3772,16 +3672,7 @@ var BABYLON;
 })(BABYLON || (BABYLON = {}));
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -3793,8 +3684,10 @@ var BABYLON;
                 var _this = _super.call(this, name) || this;
                 _this.name = name;
                 _this._text = "";
+                _this._placeholderText = "";
                 _this._background = "black";
                 _this._focusedBackground = "black";
+                _this._placeholderColor = "gray";
                 _this._thickness = 1;
                 _this._margin = new GUI.ValueAndUnit(10, GUI.ValueAndUnit.UNITMODE_PIXEL);
                 _this._autoStretchWidth = true;
@@ -3895,6 +3788,34 @@ var BABYLON;
                 enumerable: true,
                 configurable: true
             });
+            Object.defineProperty(InputText.prototype, "placeholderColor", {
+                get: function () {
+                    return this._placeholderColor;
+                },
+                set: function (value) {
+                    if (this._placeholderColor === value) {
+                        return;
+                    }
+                    this._placeholderColor = value;
+                    this._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(InputText.prototype, "placeholderText", {
+                get: function () {
+                    return this._placeholderText;
+                },
+                set: function (value) {
+                    if (this._placeholderText === value) {
+                        return;
+                    }
+                    this._placeholderText = value;
+                    this._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
             Object.defineProperty(InputText.prototype, "text", {
                 get: function () {
                     return this._text;
@@ -4031,7 +3952,14 @@ var BABYLON;
                     if (this.color) {
                         context.fillStyle = this.color;
                     }
-                    var textWidth = context.measureText(this._text).width;
+                    var text = this._text;
+                    if (!this._isFocused && !this._text && this._placeholderText) {
+                        text = this._placeholderText;
+                        if (this._placeholderColor) {
+                            context.fillStyle = this._placeholderColor;
+                        }
+                    }
+                    var textWidth = context.measureText(text).width;
                     var marginWidth = this._margin.getValueInPixel(this._host, parentMeasure.width) * 2;
                     if (this._autoStretchWidth) {
                         this.width = Math.min(this._maxWidth.getValueInPixel(this._host, parentMeasure.width), textWidth + marginWidth) + "px";
@@ -4051,7 +3979,7 @@ var BABYLON;
                     else {
                         this._scrollLeft = clipTextLeft;
                     }
-                    context.fillText(this._text, this._scrollLeft, this._currentMeasure.top + rootY);
+                    context.fillText(text, this._scrollLeft, this._currentMeasure.top + rootY);
                     // Cursor
                     if (this._isFocused) {
                         if (!this._blinkIsEven) {
@@ -4111,16 +4039,7 @@ var BABYLON;
 })(BABYLON || (BABYLON = {}));
 
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
-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 GUI;
@@ -4234,3 +4153,21 @@ var BABYLON;
         GUI.VirtualKeyboard = VirtualKeyboard;
     })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
 })(BABYLON || (BABYLON = {}));
+
+
+(function universalModuleDefinition(root, factory) {
+                if (root && root["BABYLON"]) {
+                    return;
+                }
+    if(typeof exports === 'object' && typeof module === 'object')
+        module.exports = factory();
+    else if(typeof define === 'function' && define.amd)
+        define([], factory);
+    else if(typeof exports === 'object')
+        exports["GUI"] = factory();
+    else {
+        root["BABYLON"]["GUI"] = factory();
+    }
+})(this, function() {
+    return BABYLON.GUI;
+});

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

@@ -1,7 +1,9 @@
-export = BABYLON.GUI;
-export as namespace BABYLON.GUI;
+/// <reference types="babylonjs"/>
+
+declare module 'babylonjs-gui' { 
+    export = BABYLON.GUI; 
+}
 
-/// <reference path="../../dist/preview release/babylon.d.ts" />
 declare module BABYLON.GUI {
     interface IFocusableControl {
         onFocus(): void;
@@ -58,7 +60,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Measure {
         left: number;
@@ -72,7 +74,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Matrix2D {
         m: Float32Array;
@@ -97,7 +99,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class ValueAndUnit {
         unit: number;
@@ -120,7 +122,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Control {
         name: string;
@@ -292,7 +294,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Container extends Control {
         name: string;
@@ -321,7 +323,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class StackPanel extends Container {
         name: string;
@@ -339,7 +341,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Rectangle extends Container {
         name: string;
@@ -356,7 +358,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Ellipse extends Container {
         name: string;
@@ -370,7 +372,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Line extends Control {
         name: string;
@@ -403,7 +405,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Slider extends Control {
         name: string;
@@ -433,7 +435,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Checkbox extends Control {
         name: string;
@@ -453,7 +455,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class RadioButton extends Control {
         name: string;
@@ -474,7 +476,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class TextBlock extends Control {
         name: string;
@@ -500,7 +502,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
 declare module BABYLON.GUI {
     class Image extends Control {
@@ -540,7 +542,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class Button extends Rectangle {
         name: string;
@@ -561,7 +563,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class ColorPicker extends Control {
         name: string;
@@ -600,13 +602,15 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class InputText extends Control implements IFocusableControl {
         name: string;
         private _text;
+        private _placeholderText;
         private _background;
         private _focusedBackground;
+        private _placeholderColor;
         private _thickness;
         private _margin;
         private _autoStretchWidth;
@@ -626,6 +630,8 @@ declare module BABYLON.GUI {
         thickness: number;
         focusedBackground: string;
         background: string;
+        placeholderColor: string;
+        placeholderText: string;
         text: string;
         constructor(name?: string, text?: string);
         onBlur(): void;
@@ -640,7 +646,7 @@ declare module BABYLON.GUI {
     }
 }
 
-/// <reference path="../../../dist/preview release/babylon.d.ts" />
+
 declare module BABYLON.GUI {
     class KeyPropertySet {
         width?: string;

dist/preview release/gui/package.json

@@ -1,38 +1,38 @@
 {
-  "author": {
-    "name": "David CATUHE"
-  },
-  "name": "babylonjs-gui",
-  "description": "The Babylon.js GUI library is an extension you can use to generate interactive user interface. It is build on top of the DynamicTexture.",
-  "version": "3.1.0-alpha1.3",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/BabylonJS/Babylon.js.git"
-  },
-  "main": "babylon.gui.js",
-  "files": [
-    "babylon.gui.js",
-    "babylon.gui.min.js",
-    "babylon.gui.d.ts",
-    "babylon.gui.module.d.ts",
-
-    "package.json"
-  ],
-  "typings": "babylon.gui.module.d.ts",
-  "keywords": [
-    "3D",
-    "javascript",
-    "html5",
-    "webgl",
-    "gui"
-  ],
-  "license": "Apache-2.0",
-  "dependencies": {
-    "babylonjs": "3.1.0-alpha1"
-  },
-  "engines": {
-    "node": "*"
-  },
-  "_id": "babylonjs-gui@3.1.0-alpha1",
-  "_from": "babylonjs-gui@"
-}
+    "author": {
+        "name": "David CATUHE"
+    },
+    "name": "babylonjs-gui",
+    "description": "The Babylon.js GUI library is an extension you can use to generate interactive user interface. It is build on top of the DynamicTexture.",
+    "version": "3.1.0-alpha3.4",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/BabylonJS/Babylon.js.git"
+    },
+    "main": "babylon.gui.min.js",
+    "files": [
+        "babylon.gui.js",
+        "babylon.gui.min.js",
+        "babylon.gui.d.ts",
+        "babylon.gui.module.d.ts",
+        "readme.md",
+        "package.json"
+    ],
+    "typings": "babylon.gui.module.d.ts",
+    "keywords": [
+        "3D",
+        "javascript",
+        "html5",
+        "webgl",
+        "gui"
+    ],
+    "license": "Apache-2.0",
+    "peerDependencies": {
+        "babylonjs": ">=3.1.0-alpha"
+    },
+    "engines": {
+        "node": "*"
+    },
+    "_id": "babylonjs-gui@3.1.0-alpha1",
+    "_from": "babylonjs-gui@"
+}

dist/preview release/gui/readme.md

@@ -0,0 +1,41 @@
+Babylon.js GUI module
+=====================
+
+For usage documentation please visit http://doc.babylonjs.com/overviews/gui
+
+# Installation instructions
+
+## CDN
+
+Compiled js files (minified and source) are offered on our public CDN here:
+
+* https://preview.babylonjs.com/gui/babylon.gui.js
+* https://preview.babylonjs.com/gui/babylon.gui.min.js
+
+## NPM
+
+To install using npm :
+
+```
+npm install --save babylonjs babylonjs-gui
+```
+
+If using TypeScript, the typing needs to be added to tsconfig.json:
+
+```
+    ....
+    "types": [
+        "babylonjs",
+        "babylonjs-gui",
+        "angularFTW"
+    ],
+    ....
+```
+
+Afterwards it can be imported to the project using:
+
+```
+import * as GUI from 'babylonjs-gui';
+```
+
+Using webpack to package your project will use the minified js file.

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

@@ -26,6 +26,7 @@
       cursor: ew-resize; }
   .insp-wrapper .insp-right-panel {
     width: 750px;
+    overflow-y: auto;
     display: flex;
     flex-direction: column;
     flex-shrink: 0; }
@@ -84,7 +85,8 @@
     .insp-wrapper .treeTool.active {
       color: #5db0d7; }
   .insp-wrapper .tab-panel {
-    height: 100%; }
+    height: 100%;
+    overflow-y: auto; }
     .insp-wrapper .tab-panel.searchable {
       height: calc(100% - 30px - 10px); }
     .insp-wrapper .tab-panel .texture-image {
@@ -280,6 +282,8 @@
     overflow-x: auto;
     color: #ccc;
     font-family: "Inconsolata", sans-serif; }
+    .insp-wrapper .insp-details .details {
+      padding-left: 5px; }
     .insp-wrapper .insp-details .base-row, .insp-wrapper .insp-details .row, .insp-wrapper .insp-details .header-row {
       display: flex;
       width: 100%; }
@@ -326,6 +330,8 @@
       height: 10px;
       display: inline-block;
       margin-left: 5px; }
+    .insp-wrapper .insp-details .color-element {
+      top: 2px; }
     .insp-wrapper .insp-details .texture-element {
       color: #f29766;
       margin-left: 10px; }

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

@@ -399,7 +399,6 @@ declare module INSPECTOR {
 
 declare module INSPECTOR {
     class LightAdapter extends Adapter implements IToolVisible {
-        private static _PROPERTIES;
         constructor(obj: BABYLON.Light);
         /** Returns the name displayed in the tree */
         id(): string;
@@ -541,6 +540,16 @@ declare module INSPECTOR {
         private _validateInputHandler;
         /** Handler used to validate the input by pressing 'esc' */
         private _escapeInputHandler;
+        /** Handler used on focus out */
+        private _focusOutInputHandler;
+        /** Handler used to get mouse position */
+        private _onMouseDownHandler;
+        private _onMouseDragHandler;
+        private _onMouseUpHandler;
+        /** Save previous Y mouse position */
+        private _prevY;
+        /**Save value while slider is on */
+        private _preValue;
         constructor(prop: Property, parent?: PropertyLine, level?: number);
         /**
          * Init the input element and al its handler :
@@ -553,6 +562,7 @@ declare module INSPECTOR {
          * On escape : removes the input
          */
         private _validateInput(e);
+        validateInput(value: any): void;
         /**
          * On escape : removes the input
          */
@@ -605,6 +615,21 @@ declare module INSPECTOR {
          * Add sub properties in case of a complex type
          */
         private _addDetails();
+        /**
+         * Refresh mouse position on y axis
+         * @param e
+         */
+        private _onMouseDrag(e);
+        /**
+         * Save new value from slider
+         * @param e
+         */
+        private _onMouseUp(e);
+        /**
+         * Start record mouse position
+         * @param e
+         */
+        private _onMouseDown(e);
     }
 }
 
@@ -621,6 +646,20 @@ declare module INSPECTOR {
 
 declare module INSPECTOR {
     /**
+     * Represents a html div element.
+     * The div is built when an instance of BasicElement is created.
+     */
+    class ColorPickerElement extends BasicElement {
+        protected _input: HTMLInputElement;
+        private pline;
+        constructor(color: BABYLON.Color4 | BABYLON.Color3, propertyLine: PropertyLine);
+        update(color?: BABYLON.Color4 | BABYLON.Color3): void;
+        private _toRgba(color);
+    }
+}
+
+declare module INSPECTOR {
+    /**
     * Display a very small div. A new canvas is created, with a new Babylon.js scene, containing only the
     * cube texture in a cube
     */
@@ -733,6 +772,10 @@ declare module INSPECTOR {
          * Useful function used to create a div
          */
         static CreateDiv(className?: string, parent?: HTMLElement): HTMLElement;
+        /**
+         * Useful function used to create a input
+         */
+        static CreateInput(className?: string, parent?: HTMLElement): HTMLInputElement;
         static CreateElement(element: string, className?: string, parent?: HTMLElement): HTMLElement;
         /**
          * Removes all children of the given div.
@@ -744,6 +787,11 @@ declare module INSPECTOR {
         static Css(elem: HTMLElement, cssAttribute: string): string;
         static LoadScript(): void;
         static IsSystemName(name: string): boolean;
+        /**
+         * Return an array of PropertyLine for an obj
+         * @param obj
+         */
+        static GetAllLinesProperties(obj: any): Array<PropertyLine>;
     }
 }
 

dist/preview release/inspector/babylon.inspector.js

@@ -964,21 +964,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         CameraAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            var camToDisplay = [];
-            // The if is there to work with the min version of babylon
-            if (this._obj instanceof BABYLON.ArcRotateCamera) {
-                camToDisplay = INSPECTOR.PROPERTIES['ArcRotateCamera'].properties;
-            }
-            else if (this._obj instanceof BABYLON.FreeCamera) {
-                camToDisplay = INSPECTOR.PROPERTIES['FreeCamera'].properties;
-            }
-            for (var _i = 0, camToDisplay_1 = camToDisplay; _i < camToDisplay_1.length; _i++) {
-                var dirty = camToDisplay_1[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         CameraAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1031,13 +1017,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         PhysicsImpostorAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            for (var _i = 0, _a = INSPECTOR.PROPERTIES['PhysicsImpostor'].properties; _i < _a.length; _i++) {
-                var dirty = _a[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         PhysicsImpostorAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1094,97 +1074,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         GUIAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            for (var _i = 0, _a = INSPECTOR.PROPERTIES['Control'].properties; _i < _a.length; _i++) {
-                var dirty = _a[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            if (this._obj instanceof BABYLON.GUI.Button) {
-                for (var _b = 0, _c = INSPECTOR.PROPERTIES['Button'].properties; _b < _c.length; _b++) {
-                    var dirty = _c[_b];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.ColorPicker) {
-                for (var _d = 0, _e = INSPECTOR.PROPERTIES['ColorPicker'].properties; _d < _e.length; _d++) {
-                    var dirty = _e[_d];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Checkbox) {
-                for (var _f = 0, _g = INSPECTOR.PROPERTIES['Checkbox'].properties; _f < _g.length; _f++) {
-                    var dirty = _g[_f];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Ellipse) {
-                for (var _h = 0, _j = INSPECTOR.PROPERTIES['Ellipse'].properties; _h < _j.length; _h++) {
-                    var dirty = _j[_h];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Image) {
-                for (var _k = 0, _l = INSPECTOR.PROPERTIES['Image'].properties; _k < _l.length; _k++) {
-                    var dirty = _l[_k];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Line) {
-                for (var _m = 0, _o = INSPECTOR.PROPERTIES['Line'].properties; _m < _o.length; _m++) {
-                    var dirty = _o[_m];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.RadioButton) {
-                for (var _p = 0, _q = INSPECTOR.PROPERTIES['RadioButton'].properties; _p < _q.length; _p++) {
-                    var dirty = _q[_p];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Rectangle) {
-                for (var _r = 0, _s = INSPECTOR.PROPERTIES['Rectangle'].properties; _r < _s.length; _r++) {
-                    var dirty = _s[_r];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Slider) {
-                for (var _t = 0, _u = INSPECTOR.PROPERTIES['Slider'].properties; _t < _u.length; _t++) {
-                    var dirty = _u[_t];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.StackPanel) {
-                for (var _v = 0, _w = INSPECTOR.PROPERTIES['StackPanel'].properties; _v < _w.length; _v++) {
-                    var dirty = _w[_v];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.TextBlock) {
-                for (var _x = 0, _y = INSPECTOR.PROPERTIES['TextBlock'].properties; _x < _y.length; _x++) {
-                    var dirty = _y[_x];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            if (this._obj instanceof BABYLON.GUI.Container) {
-                for (var _z = 0, _0 = INSPECTOR.PROPERTIES['Container'].properties; _z < _0.length; _z++) {
-                    var dirty = _0[_z];
-                    var infos = new INSPECTOR.Property(dirty, this._obj);
-                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-                }
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         GUIAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1235,16 +1125,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         SoundAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            var camToDisplay = [];
-            // The if is there to work with the min version of babylon
-            var soundProperties = INSPECTOR.PROPERTIES['Sound'].properties;
-            for (var _i = 0, soundProperties_1 = soundProperties; _i < soundProperties_1.length; _i++) {
-                var dirty = soundProperties_1[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         SoundAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1346,13 +1227,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         LightAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            for (var _i = 0, _a = LightAdapter._PROPERTIES; _i < _a.length; _i++) {
-                var dirty = _a[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         LightAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1365,14 +1240,6 @@ var INSPECTOR;
         LightAdapter.prototype.isVisible = function () {
             return this._obj.isEnabled();
         };
-        LightAdapter._PROPERTIES = [
-            'position',
-            'diffuse',
-            'intensity',
-            'radius',
-            'range',
-            'specular'
-        ];
         return LightAdapter;
     }(INSPECTOR.Adapter));
     INSPECTOR.LightAdapter = LightAdapter;
@@ -1411,21 +1278,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         MaterialAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            var propToDisplay = [];
-            // The if is there to work with the min version of babylon
-            if (this._obj instanceof BABYLON.StandardMaterial) {
-                propToDisplay = INSPECTOR.PROPERTIES['StandardMaterial'].properties;
-            }
-            else if (this._obj instanceof BABYLON.PBRMaterial) {
-                propToDisplay = INSPECTOR.PROPERTIES['PBRMaterial'].properties;
-            }
-            for (var _i = 0, propToDisplay_1 = propToDisplay; _i < propToDisplay_1.length; _i++) {
-                var dirty = propToDisplay_1[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         /** No tools for a material adapter */
         MaterialAdapter.prototype.getTools = function () {
@@ -1472,13 +1325,7 @@ var INSPECTOR;
         };
         /** Returns the list of properties to be displayed for this adapter */
         MeshAdapter.prototype.getProperties = function () {
-            var propertiesLines = [];
-            for (var _i = 0, _a = INSPECTOR.PROPERTIES['Mesh'].properties; _i < _a.length; _i++) {
-                var dirty = _a[_i];
-                var infos = new INSPECTOR.Property(dirty, this._obj);
-                propertiesLines.push(new INSPECTOR.PropertyLine(infos));
-            }
-            return propertiesLines;
+            return INSPECTOR.Helpers.GetAllLinesProperties(this._obj);
         };
         MeshAdapter.prototype.getTools = function () {
             var tools = [];
@@ -1853,6 +1700,7 @@ var INSPECTOR;
                 this._valueDiv.addEventListener('click', this._displayInputHandler);
                 this._input.addEventListener('keypress', this._validateInputHandler);
                 this._input.addEventListener('keydown', this._escapeInputHandler);
+                this._input.addEventListener('focusout', this._focusOutInputHandler);
             }
             // Add this property to the scheduler
             INSPECTOR.Scheduler.getInstance().add(this);
@@ -1870,6 +1718,10 @@ var INSPECTOR;
             this._displayInputHandler = this._displayInput.bind(this);
             this._validateInputHandler = this._validateInput.bind(this);
             this._escapeInputHandler = this._escapeInput.bind(this);
+            this._focusOutInputHandler = this.update.bind(this);
+            this._onMouseDownHandler = this._onMouseDown.bind(this);
+            this._onMouseDragHandler = this._onMouseDrag.bind(this);
+            this._onMouseUpHandler = this._onMouseUp.bind(this);
         };
         /**
          * On enter : validates the new value and removes the input
@@ -1877,29 +1729,32 @@ var INSPECTOR;
          */
         PropertyLine.prototype._validateInput = function (e) {
             if (e.keyCode == 13) {
-                // Enter : validate the new value
-                var newValue = this._input.value;
-                this.updateObject();
-                if (typeof this._property.value === 'number') {
-                    this._property.value = parseFloat(newValue);
-                }
-                else {
-                    this._property.value = newValue;
-                }
-                // Remove input
-                this.update();
-                // resume scheduler
-                INSPECTOR.Scheduler.getInstance().pause = false;
+                this.validateInput(this._input.value);
             }
             else if (e.keyCode == 27) {
                 // Esc : remove input
                 this.update();
             }
         };
+        PropertyLine.prototype.validateInput = function (value) {
+            this.updateObject();
+            if (typeof this._property.value === 'number') {
+                this._property.value = parseFloat(value);
+            }
+            else {
+                this._property.value = value;
+            }
+            // Remove input
+            this.update();
+            // resume scheduler
+            INSPECTOR.Scheduler.getInstance().pause = false;
+        };
         /**
          * On escape : removes the input
          */
         PropertyLine.prototype._escapeInput = function (e) {
+            // Remove focus out handler
+            this._input.removeEventListener('focusout', this._focusOutInputHandler);
             if (e.keyCode == 27) {
                 // Esc : remove input
                 this.update();
@@ -1925,6 +1780,11 @@ var INSPECTOR;
             this._valueDiv.textContent = "";
             this._input.value = valueTxt;
             this._valueDiv.appendChild(this._input);
+            this._input.focus();
+            if (typeof this.value === 'number') {
+                this._input.addEventListener('mousedown', this._onMouseDownHandler);
+            }
+            this._input.addEventListener('focusout', this._focusOutInputHandler);
             // Pause the scheduler
             INSPECTOR.Scheduler.getInstance().pause = true;
         };
@@ -1970,7 +1830,8 @@ var INSPECTOR;
         PropertyLine.prototype._createElements = function () {
             // Colors
             if (this.type == 'Color3' || this.type == 'Color4') {
-                this._elements.push(new INSPECTOR.ColorElement(this.value));
+                this._elements.push(new INSPECTOR.ColorPickerElement(this.value, this));
+                //this._elements.push(new ColorElement(this.value));
             }
             // Texture
             if (this.type == 'Texture') {
@@ -2104,6 +1965,33 @@ var INSPECTOR;
                 }
             }
         };
+        /**
+         * Refresh mouse position on y axis
+         * @param e
+         */
+        PropertyLine.prototype._onMouseDrag = function (e) {
+            var diff = this._prevY - e.clientY;
+            this._input.value = (this._preValue + diff).toString();
+        };
+        /**
+         * Save new value from slider
+         * @param e
+         */
+        PropertyLine.prototype._onMouseUp = function (e) {
+            window.removeEventListener('mousemove', this._onMouseDragHandler);
+            window.removeEventListener('mouseup', this._onMouseUpHandler);
+            this._prevY = e.clientY;
+        };
+        /**
+         * Start record mouse position
+         * @param e
+         */
+        PropertyLine.prototype._onMouseDown = function (e) {
+            this._prevY = e.clientY;
+            this._preValue = this.value;
+            window.addEventListener('mousemove', this._onMouseDragHandler);
+            window.addEventListener('mouseup', this._onMouseUpHandler);
+        };
         // Array representing the simple type. All others are considered 'complex'
         PropertyLine._SIMPLE_TYPE = ['number', 'string', 'boolean'];
         // The number of pixel at each children step
@@ -2177,6 +2065,76 @@ var __extends = (this && this.__extends) || (function () {
 var INSPECTOR;
 (function (INSPECTOR) {
     /**
+     * Represents a html div element.
+     * The div is built when an instance of BasicElement is created.
+     */
+    var ColorPickerElement = (function (_super) {
+        __extends(ColorPickerElement, _super);
+        function ColorPickerElement(color, propertyLine) {
+            var _this = _super.call(this) || this;
+            var scheduler = INSPECTOR.Scheduler.getInstance();
+            _this._div.className = 'color-element';
+            _this._div.style.backgroundColor = _this._toRgba(color);
+            _this.pline = propertyLine;
+            _this._input = INSPECTOR.Helpers.CreateInput();
+            _this._input.type = 'color';
+            _this._input.style.opacity = "0";
+            _this._input.style.width = '10px';
+            _this._input.style.height = '15px';
+            _this._input.value = color.toHexString();
+            _this._input.addEventListener('input', function (e) {
+                var color = BABYLON.Color3.FromHexString(_this._input.value);
+                color.r = parseFloat(color.r.toPrecision(2));
+                color.g = parseFloat(color.g.toPrecision(2));
+                color.b = parseFloat(color.b.toPrecision(2));
+                _this.pline.validateInput(color);
+                scheduler.pause = false;
+            });
+            _this._div.appendChild(_this._input);
+            _this._input.addEventListener('click', function (e) {
+                scheduler.pause = true;
+            });
+            return _this;
+        }
+        ColorPickerElement.prototype.update = function (color) {
+            if (color) {
+                this._div.style.backgroundColor = this._toRgba(color);
+                this._input.value = color.toHexString();
+            }
+        };
+        ColorPickerElement.prototype._toRgba = function (color) {
+            if (color) {
+                var r = (color.r * 255) | 0;
+                var g = (color.g * 255) | 0;
+                var b = (color.b * 255) | 0;
+                var a = 1;
+                if (color instanceof BABYLON.Color4) {
+                    var a_1 = color.a;
+                }
+                return "rgba(" + r + ", " + g + ", " + b + ", " + a + ")";
+            }
+            else {
+                return '';
+            }
+        };
+        return ColorPickerElement;
+    }(INSPECTOR.BasicElement));
+    INSPECTOR.ColorPickerElement = ColorPickerElement;
+})(INSPECTOR || (INSPECTOR = {}));
+
+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 INSPECTOR;
+(function (INSPECTOR) {
+    /**
     * Display a very small div. A new canvas is created, with a new Babylon.js scene, containing only the
     * cube texture in a cube
     */
@@ -2539,6 +2497,12 @@ var INSPECTOR;
         Helpers.CreateDiv = function (className, parent) {
             return Helpers.CreateElement('div', className, parent);
         };
+        /**
+         * Useful function used to create a input
+         */
+        Helpers.CreateInput = function (className, parent) {
+            return Helpers.CreateElement('input', className, parent);
+        };
         Helpers.CreateElement = function (element, className, parent) {
             var elem = INSPECTOR.Inspector.DOCUMENT.createElement(element);
             if (className) {
@@ -2595,6 +2559,23 @@ var INSPECTOR;
             }
             return name.indexOf("###") === 0 && name.lastIndexOf("###") === (name.length - 3);
         };
+        /**
+         * Return an array of PropertyLine for an obj
+         * @param obj
+         */
+        Helpers.GetAllLinesProperties = function (obj) {
+            var propertiesLines = [];
+            for (var prop in obj) {
+                /**
+                 * No private and no function
+                 */
+                if (prop.substring(0, 1) !== '_' && typeof obj[prop] !== 'function') {
+                    var infos = new INSPECTOR.Property(prop, obj);
+                    propertiesLines.push(new INSPECTOR.PropertyLine(infos));
+                }
+            }
+            return propertiesLines;
+        };
         return Helpers;
     }());
     INSPECTOR.Helpers = Helpers;
@@ -3129,7 +3110,7 @@ var INSPECTOR;
                 screenShotTexture.onBeforeRenderObservable = texture.onBeforeRenderObservable;
                 // To display the texture after rendering
                 screenShotTexture.onAfterRenderObservable.add(function (faceIndex) {
-                    BABYLON.Tools.DumpFramebuffer(size_1.width, size_1.height, engine_1, function (data) { return imgs[faceIndex].src = data; }, "image/png");
+                    BABYLON.Tools.DumpFramebuffer(size_1.width, size_1.height, engine_1, function (data) { return imgs[faceIndex].src = data; });
                 });
                 // Render the texture
                 scene.incrementRenderId();
@@ -3138,23 +3119,49 @@ var INSPECTOR;
                 screenShotTexture.dispose();
             }
             else if (texture instanceof BABYLON.CubeTexture) {
+                // Cannot open correctly DDS File
                 // Display all textures of the CubeTexture
-                var i = 0;
-                for (var _i = 0, _a = texture['_files']; _i < _a.length; _i++) {
-                    var filename = _a[_i];
-                    imgs[i].src = filename;
-                    i++;
-                }
-            }
-            else if (texture.url) {
-                // If an url is present, the texture is an image
-                img.src = texture.url;
+                var pixels = texture.readPixels();
+                var canvas = document.createElement('canvas');
+                canvas.id = "MyCanvas";
+                img.parentElement.appendChild(canvas);
+                var ctx = canvas.getContext('2d');
+                var size = texture.getSize();
+                var tmp = pixels.buffer.slice(0, size.height * size.width * 4);
+                var u = new Uint8ClampedArray(tmp);
+                var colors = new ImageData(size.width * 6, size.height);
+                colors.data.set(u);
+                var imgData = ctx.createImageData(size.width * 6, size.height);
+                imgData.data.set(u);
+                // let data = imgData.data;
+                // for(let i = 0, len = size.height * size.width; i < len; i++) {
+                //     data[i] = pixels[i];
+                // }
+                ctx.putImageData(imgData, 0, 0);
+                // let i: number = 0;
+                // for(let filename of (texture as BABYLON.CubeTexture)['_files']){
+                //     imgs[i].src = filename;
+                //     i++;
+                // }
             }
             else if (texture['_canvas']) {
                 // Dynamic texture
                 var base64Image = texture['_canvas'].toDataURL("image/png");
                 img.src = base64Image;
             }
+            else if (texture.url) {
+                var pixels = texture.readPixels();
+                var canvas = document.createElement('canvas');
+                canvas.id = "MyCanvas";
+                img.parentElement.appendChild(canvas);
+                var ctx = canvas.getContext('2d');
+                var size = texture.getSize();
+                var imgData = ctx.createImageData(size.width, size.height);
+                imgData.data.set(pixels);
+                ctx.putImageData(imgData, 0, 0);
+                // If an url is present, the texture is an image
+                // img.src = texture.url;
+            }
         };
         /** Select an item in the tree */
         TextureTab.prototype.select = function (item) {

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

@@ -16,6 +16,7 @@ declare module BABYLON {
     class GLTFFileLoader implements ISceneLoaderPluginAsync {
         static CreateGLTFLoaderV1: (parent: GLTFFileLoader) => IGLTFLoader;
         static CreateGLTFLoaderV2: (parent: GLTFFileLoader) => IGLTFLoader;
+        onParsed: (data: IGLTFLoaderData) => void;
         static HomogeneousCoordinates: boolean;
         static IncrementalLoading: boolean;
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;

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

@@ -26,6 +26,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;
@@ -37,6 +40,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;

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

@@ -16,6 +16,7 @@ declare module BABYLON {
     class GLTFFileLoader implements ISceneLoaderPluginAsync {
         static CreateGLTFLoaderV1: (parent: GLTFFileLoader) => IGLTFLoader;
         static CreateGLTFLoaderV2: (parent: GLTFFileLoader) => IGLTFLoader;
+        onParsed: (data: IGLTFLoaderData) => void;
         static HomogeneousCoordinates: boolean;
         static IncrementalLoading: boolean;
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
@@ -213,9 +214,9 @@ declare module BABYLON.GLTF2 {
         indices?: number;
         material?: number;
         mode?: EMeshPrimitiveMode;
-        targets?: [{
+        targets?: {
             [name: string]: number;
-        }];
+        }[];
     }
     interface IGLTFMesh extends IGLTFChildRootProperty {
         primitives: IGLTFMeshPrimitive[];
@@ -234,7 +235,7 @@ declare module BABYLON.GLTF2 {
         index?: number;
         parent?: IGLTFNode;
         babylonMesh?: Mesh;
-        babylonSkinToBones?: {
+        babylonBones?: {
             [skin: number]: Bone;
         };
         babylonAnimationTargets?: Node[];
@@ -330,15 +331,17 @@ declare module BABYLON.GLTF2 {
         private _showMeshes();
         private _startAnimations();
         private _loadScene(nodeNames);
-        private _loadSkin(node);
-        private _updateBone(node, parentNode, skin, inverseBindMatrixData);
-        private _createBone(node, skin);
-        private _loadMesh(node);
-        private _loadMeshData(node, mesh, babylonMesh);
+        private _loadNode(node);
+        private _loadMesh(node, mesh);
         private _loadVertexDataAsync(primitive, onSuccess);
         private _createMorphTargets(node, mesh, primitive, babylonMesh);
         private _loadMorphTargetsData(mesh, primitive, vertexData, babylonMesh);
-        private _loadTransform(node, babylonMesh);
+        private _loadTransform(node);
+        private _loadSkin(skin);
+        private _createBone(node, skin, parent, localMatrix, baseMatrix, index);
+        private _loadBones(skin, inverseBindMatrixData);
+        private _loadBone(node, skin, inverseBindMatrixData, babylonBones);
+        private _getNodeMatrix(node);
         private _traverseNodes(indices, action, parentNode?);
         private _traverseNode(index, action, parentNode?);
         private _loadAnimations();

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

@@ -26,6 +26,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;
@@ -37,6 +40,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;
@@ -547,85 +553,35 @@ var BABYLON;
                     });
                     nodeIndices = filteredNodeIndices;
                 }
-                this._traverseNodes(nodeIndices, function (node) { return _this._loadSkin(node); });
-                this._traverseNodes(nodeIndices, function (node) { return _this._loadMesh(node); });
-            };
-            GLTFLoader.prototype._loadSkin = function (node) {
-                var _this = this;
-                if (node.skin !== undefined) {
-                    var skin = this._gltf.skins[node.skin];
-                    var skeletonId = "skeleton" + node.skin;
-                    skin.babylonSkeleton = new BABYLON.Skeleton(skin.name || skeletonId, skeletonId, this._babylonScene);
-                    skin.index = node.skin;
-                    for (var i = 0; i < skin.joints.length; i++) {
-                        this._createBone(this._gltf.nodes[skin.joints[i]], skin);
-                    }
-                    if (skin.skeleton === undefined) {
-                        // TODO: handle when skeleton is not defined
-                        throw new Error("Not implemented");
-                    }
-                    if (skin.inverseBindMatrices === undefined) {
-                        // TODO: handle when inverse bind matrices are not defined
-                        throw new Error("Not implemented");
-                    }
-                    var accessor = this._gltf.accessors[skin.inverseBindMatrices];
-                    this._loadAccessorAsync(accessor, function (data) {
-                        _this._traverseNode(skin.skeleton, function (node, index, parent) { return _this._updateBone(node, parent, skin, data); });
-                    });
-                }
-                return true;
-            };
-            GLTFLoader.prototype._updateBone = function (node, parentNode, skin, inverseBindMatrixData) {
-                var jointIndex = skin.joints.indexOf(node.index);
-                if (jointIndex === -1) {
-                    this._createBone(node, skin);
-                }
-                var babylonBone = node.babylonSkinToBones[skin.index];
-                // TODO: explain the math
-                var matrix = jointIndex === -1 ? BABYLON.Matrix.Identity() : BABYLON.Matrix.FromArray(inverseBindMatrixData, jointIndex * 16);
-                matrix.invertToRef(matrix);
-                if (parentNode) {
-                    babylonBone.setParent(parentNode.babylonSkinToBones[skin.index], false);
-                    matrix.multiplyToRef(babylonBone.getParent().getInvertedAbsoluteTransform(), matrix);
-                }
-                babylonBone.updateMatrix(matrix);
-                return true;
-            };
-            GLTFLoader.prototype._createBone = function (node, skin) {
-                var babylonBone = new BABYLON.Bone(node.name || "bone" + node.index, skin.babylonSkeleton);
-                node.babylonSkinToBones = node.babylonSkinToBones || {};
-                node.babylonSkinToBones[skin.index] = babylonBone;
-                node.babylonAnimationTargets = node.babylonAnimationTargets || [];
-                node.babylonAnimationTargets.push(babylonBone);
-                return babylonBone;
+                this._traverseNodes(nodeIndices, function (node) { return _this._loadNode(node); });
             };
-            GLTFLoader.prototype._loadMesh = function (node) {
-                var babylonMesh = new BABYLON.Mesh(node.name || "mesh" + node.index, this._babylonScene);
-                babylonMesh.isVisible = false;
-                this._loadTransform(node, babylonMesh);
+            GLTFLoader.prototype._loadNode = function (node) {
+                node.babylonMesh = new BABYLON.Mesh(node.name || "mesh" + node.index, this._babylonScene);
+                node.babylonMesh.isVisible = false;
+                this._loadTransform(node);
                 if (node.mesh !== undefined) {
                     var mesh = this._gltf.meshes[node.mesh];
-                    this._loadMeshData(node, mesh, babylonMesh);
+                    this._loadMesh(node, mesh);
                 }
-                babylonMesh.parent = node.parent ? node.parent.babylonMesh : null;
-                node.babylonMesh = babylonMesh;
+                node.babylonMesh.parent = node.parent ? node.parent.babylonMesh : null;
                 node.babylonAnimationTargets = node.babylonAnimationTargets || [];
                 node.babylonAnimationTargets.push(node.babylonMesh);
                 if (node.skin !== undefined) {
                     var skin = this._gltf.skins[node.skin];
-                    babylonMesh.skeleton = skin.babylonSkeleton;
+                    skin.index = node.skin;
+                    node.babylonMesh.skeleton = this._loadSkin(skin);
                 }
                 if (node.camera !== undefined) {
                     // TODO: handle cameras
                 }
                 return true;
             };
-            GLTFLoader.prototype._loadMeshData = function (node, mesh, babylonMesh) {
+            GLTFLoader.prototype._loadMesh = function (node, mesh) {
                 var _this = this;
-                babylonMesh.name = mesh.name || babylonMesh.name;
-                var babylonMultiMaterial = new BABYLON.MultiMaterial(babylonMesh.name, this._babylonScene);
-                babylonMesh.material = babylonMultiMaterial;
-                var geometry = new BABYLON.Geometry(babylonMesh.name, this._babylonScene, null, false, babylonMesh);
+                node.babylonMesh.name = mesh.name || node.babylonMesh.name;
+                var babylonMultiMaterial = new BABYLON.MultiMaterial(node.babylonMesh.name, this._babylonScene);
+                node.babylonMesh.material = babylonMultiMaterial;
+                var geometry = new BABYLON.Geometry(node.babylonMesh.name, this._babylonScene, null, false, node.babylonMesh);
                 var vertexData = new BABYLON.VertexData();
                 vertexData.positions = [];
                 vertexData.indices = [];
@@ -638,9 +594,9 @@ var BABYLON;
                         // TODO: handle other primitive modes
                         throw new Error("Not implemented");
                     }
-                    this_1._createMorphTargets(node, mesh, primitive, babylonMesh);
+                    this_1._createMorphTargets(node, mesh, primitive, node.babylonMesh);
                     this_1._loadVertexDataAsync(primitive, function (subVertexData) {
-                        _this._loadMorphTargetsData(mesh, primitive, subVertexData, babylonMesh);
+                        _this._loadMorphTargetsData(mesh, primitive, subVertexData, node.babylonMesh);
                         subMeshInfos.push({
                             materialIndex: i,
                             verticesStart: vertexData.positions.length,
@@ -659,7 +615,7 @@ var BABYLON;
                                         }
                                         if (_this._parent.onBeforeMaterialReadyAsync) {
                                             _this.addLoaderPendingData(material);
-                                            _this._parent.onBeforeMaterialReadyAsync(babylonMaterial, babylonMesh, babylonMultiMaterial.subMaterials[i] != null, function () {
+                                            _this._parent.onBeforeMaterialReadyAsync(babylonMaterial, node.babylonMesh, babylonMultiMaterial.subMaterials[i] != null, function () {
                                                 babylonMultiMaterial.subMaterials[i] = babylonMaterial;
                                                 _this.removeLoaderPendingData(material);
                                             });
@@ -677,8 +633,8 @@ var BABYLON;
                             subMeshInfos.forEach(function (info) { return info.loadMaterial(); });
                             // TODO: optimize this so that sub meshes can be created without being overwritten after setting vertex data.
                             // Sub meshes must be cleared and created after setting vertex data because of mesh._createGlobalSubMesh.
-                            babylonMesh.subMeshes = [];
-                            subMeshInfos.forEach(function (info) { return new BABYLON.SubMesh(info.materialIndex, info.verticesStart, info.verticesCount, info.indicesStart, info.indicesCount, babylonMesh); });
+                            node.babylonMesh.subMeshes = [];
+                            subMeshInfos.forEach(function (info) { return new BABYLON.SubMesh(info.materialIndex, info.verticesStart, info.verticesCount, info.indicesStart, info.indicesCount, node.babylonMesh); });
                         }
                     });
                 };
@@ -816,7 +772,7 @@ var BABYLON;
                     _loop_3();
                 }
             };
-            GLTFLoader.prototype._loadTransform = function (node, babylonMesh) {
+            GLTFLoader.prototype._loadTransform = function (node) {
                 var position = BABYLON.Vector3.Zero();
                 var rotation = BABYLON.Quaternion.Identity();
                 var scaling = BABYLON.Vector3.One();
@@ -832,9 +788,64 @@ var BABYLON;
                     if (node.scale)
                         scaling = BABYLON.Vector3.FromArray(node.scale);
                 }
-                babylonMesh.position = position;
-                babylonMesh.rotationQuaternion = rotation;
-                babylonMesh.scaling = scaling;
+                node.babylonMesh.position = position;
+                node.babylonMesh.rotationQuaternion = rotation;
+                node.babylonMesh.scaling = scaling;
+            };
+            GLTFLoader.prototype._loadSkin = function (skin) {
+                var _this = this;
+                var skeletonId = "skeleton" + skin.index;
+                skin.babylonSkeleton = new BABYLON.Skeleton(skin.name || skeletonId, skeletonId, this._babylonScene);
+                if (skin.inverseBindMatrices === undefined) {
+                    this._loadBones(skin, null);
+                }
+                else {
+                    var accessor = this._gltf.accessors[skin.inverseBindMatrices];
+                    this._loadAccessorAsync(accessor, function (data) {
+                        _this._loadBones(skin, data);
+                    });
+                }
+                return skin.babylonSkeleton;
+            };
+            GLTFLoader.prototype._createBone = function (node, skin, parent, localMatrix, baseMatrix, index) {
+                var babylonBone = new BABYLON.Bone(node.name || "bone" + node.index, skin.babylonSkeleton, parent, localMatrix, null, baseMatrix, index);
+                node.babylonBones = node.babylonBones || {};
+                node.babylonBones[skin.index] = babylonBone;
+                node.babylonAnimationTargets = node.babylonAnimationTargets || [];
+                node.babylonAnimationTargets.push(babylonBone);
+                return babylonBone;
+            };
+            GLTFLoader.prototype._loadBones = function (skin, inverseBindMatrixData) {
+                var babylonBones = {};
+                for (var i = 0; i < skin.joints.length; i++) {
+                    var node = this._gltf.nodes[skin.joints[i]];
+                    this._loadBone(node, skin, inverseBindMatrixData, babylonBones);
+                }
+            };
+            GLTFLoader.prototype._loadBone = function (node, skin, inverseBindMatrixData, babylonBones) {
+                var babylonBone = babylonBones[node.index];
+                if (babylonBone) {
+                    return babylonBone;
+                }
+                var boneIndex = skin.joints.indexOf(node.index);
+                var baseMatrix = BABYLON.Matrix.Identity();
+                if (inverseBindMatrixData && boneIndex !== -1) {
+                    baseMatrix = BABYLON.Matrix.FromArray(inverseBindMatrixData, boneIndex * 16);
+                    baseMatrix.invertToRef(baseMatrix);
+                }
+                var babylonParentBone;
+                if (node.index != skin.skeleton && node.parent) {
+                    babylonParentBone = this._loadBone(node.parent, skin, inverseBindMatrixData, babylonBones);
+                    baseMatrix.multiplyToRef(babylonParentBone.getInvertedAbsoluteTransform(), baseMatrix);
+                }
+                babylonBone = this._createBone(node, skin, babylonParentBone, this._getNodeMatrix(node), baseMatrix, boneIndex);
+                babylonBones[node.index] = babylonBone;
+                return babylonBone;
+            };
+            GLTFLoader.prototype._getNodeMatrix = function (node) {
+                return node.matrix ?
+                    BABYLON.Matrix.FromArray(node.matrix) :
+                    BABYLON.Matrix.Compose(node.scale ? BABYLON.Vector3.FromArray(node.scale) : BABYLON.Vector3.One(), node.rotation ? BABYLON.Quaternion.FromArray(node.rotation) : BABYLON.Quaternion.Identity(), node.translation ? BABYLON.Vector3.FromArray(node.translation) : BABYLON.Vector3.Zero());
             };
             GLTFLoader.prototype._traverseNodes = function (indices, action, parentNode) {
                 if (parentNode === void 0) { parentNode = null; }

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

@@ -16,6 +16,7 @@ declare module BABYLON {
     class GLTFFileLoader implements ISceneLoaderPluginAsync {
         static CreateGLTFLoaderV1: (parent: GLTFFileLoader) => IGLTFLoader;
         static CreateGLTFLoaderV2: (parent: GLTFFileLoader) => IGLTFLoader;
+        onParsed: (data: IGLTFLoaderData) => void;
         static HomogeneousCoordinates: boolean;
         static IncrementalLoading: boolean;
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
@@ -709,9 +710,9 @@ declare module BABYLON.GLTF2 {
         indices?: number;
         material?: number;
         mode?: EMeshPrimitiveMode;
-        targets?: [{
+        targets?: {
             [name: string]: number;
-        }];
+        }[];
     }
     interface IGLTFMesh extends IGLTFChildRootProperty {
         primitives: IGLTFMeshPrimitive[];
@@ -730,7 +731,7 @@ declare module BABYLON.GLTF2 {
         index?: number;
         parent?: IGLTFNode;
         babylonMesh?: Mesh;
-        babylonSkinToBones?: {
+        babylonBones?: {
             [skin: number]: Bone;
         };
         babylonAnimationTargets?: Node[];
@@ -826,15 +827,17 @@ declare module BABYLON.GLTF2 {
         private _showMeshes();
         private _startAnimations();
         private _loadScene(nodeNames);
-        private _loadSkin(node);
-        private _updateBone(node, parentNode, skin, inverseBindMatrixData);
-        private _createBone(node, skin);
-        private _loadMesh(node);
-        private _loadMeshData(node, mesh, babylonMesh);
+        private _loadNode(node);
+        private _loadMesh(node, mesh);
         private _loadVertexDataAsync(primitive, onSuccess);
         private _createMorphTargets(node, mesh, primitive, babylonMesh);
         private _loadMorphTargetsData(mesh, primitive, vertexData, babylonMesh);
-        private _loadTransform(node, babylonMesh);
+        private _loadTransform(node);
+        private _loadSkin(skin);
+        private _createBone(node, skin, parent, localMatrix, baseMatrix, index);
+        private _loadBones(skin, inverseBindMatrixData);
+        private _loadBone(node, skin, inverseBindMatrixData, babylonBones);
+        private _getNodeMatrix(node);
         private _traverseNodes(indices, action, parentNode?);
         private _traverseNode(index, action, parentNode?);
         private _loadAnimations();

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

@@ -26,6 +26,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;
@@ -37,6 +40,9 @@ var BABYLON;
             if (!loaderData) {
                 return;
             }
+            if (this.onParsed) {
+                this.onParsed(loaderData);
+            }
             var loader = this._getLoader(loaderData, onError);
             if (!loader) {
                 return;
@@ -2705,85 +2711,35 @@ var BABYLON;
                     });
                     nodeIndices = filteredNodeIndices;
                 }
-                this._traverseNodes(nodeIndices, function (node) { return _this._loadSkin(node); });
-                this._traverseNodes(nodeIndices, function (node) { return _this._loadMesh(node); });
-            };
-            GLTFLoader.prototype._loadSkin = function (node) {
-                var _this = this;
-                if (node.skin !== undefined) {
-                    var skin = this._gltf.skins[node.skin];
-                    var skeletonId = "skeleton" + node.skin;
-                    skin.babylonSkeleton = new BABYLON.Skeleton(skin.name || skeletonId, skeletonId, this._babylonScene);
-                    skin.index = node.skin;
-                    for (var i = 0; i < skin.joints.length; i++) {
-                        this._createBone(this._gltf.nodes[skin.joints[i]], skin);
-                    }
-                    if (skin.skeleton === undefined) {
-                        // TODO: handle when skeleton is not defined
-                        throw new Error("Not implemented");
-                    }
-                    if (skin.inverseBindMatrices === undefined) {
-                        // TODO: handle when inverse bind matrices are not defined
-                        throw new Error("Not implemented");
-                    }
-                    var accessor = this._gltf.accessors[skin.inverseBindMatrices];
-                    this._loadAccessorAsync(accessor, function (data) {
-                        _this._traverseNode(skin.skeleton, function (node, index, parent) { return _this._updateBone(node, parent, skin, data); });
-                    });
-                }
-                return true;
-            };
-            GLTFLoader.prototype._updateBone = function (node, parentNode, skin, inverseBindMatrixData) {
-                var jointIndex = skin.joints.indexOf(node.index);
-                if (jointIndex === -1) {
-                    this._createBone(node, skin);
-                }
-                var babylonBone = node.babylonSkinToBones[skin.index];
-                // TODO: explain the math
-                var matrix = jointIndex === -1 ? BABYLON.Matrix.Identity() : BABYLON.Matrix.FromArray(inverseBindMatrixData, jointIndex * 16);
-                matrix.invertToRef(matrix);
-                if (parentNode) {
-                    babylonBone.setParent(parentNode.babylonSkinToBones[skin.index], false);
-                    matrix.multiplyToRef(babylonBone.getParent().getInvertedAbsoluteTransform(), matrix);
-                }
-                babylonBone.updateMatrix(matrix);
-                return true;
-            };
-            GLTFLoader.prototype._createBone = function (node, skin) {
-                var babylonBone = new BABYLON.Bone(node.name || "bone" + node.index, skin.babylonSkeleton);
-                node.babylonSkinToBones = node.babylonSkinToBones || {};
-                node.babylonSkinToBones[skin.index] = babylonBone;
-                node.babylonAnimationTargets = node.babylonAnimationTargets || [];
-                node.babylonAnimationTargets.push(babylonBone);
-                return babylonBone;
+                this._traverseNodes(nodeIndices, function (node) { return _this._loadNode(node); });
             };
-            GLTFLoader.prototype._loadMesh = function (node) {
-                var babylonMesh = new BABYLON.Mesh(node.name || "mesh" + node.index, this._babylonScene);
-                babylonMesh.isVisible = false;
-                this._loadTransform(node, babylonMesh);
+            GLTFLoader.prototype._loadNode = function (node) {
+                node.babylonMesh = new BABYLON.Mesh(node.name || "mesh" + node.index, this._babylonScene);
+                node.babylonMesh.isVisible = false;
+                this._loadTransform(node);
                 if (node.mesh !== undefined) {
                     var mesh = this._gltf.meshes[node.mesh];
-                    this._loadMeshData(node, mesh, babylonMesh);
+                    this._loadMesh(node, mesh);
                 }
-                babylonMesh.parent = node.parent ? node.parent.babylonMesh : null;
-                node.babylonMesh = babylonMesh;
+                node.babylonMesh.parent = node.parent ? node.parent.babylonMesh : null;
                 node.babylonAnimationTargets = node.babylonAnimationTargets || [];
                 node.babylonAnimationTargets.push(node.babylonMesh);
                 if (node.skin !== undefined) {
                     var skin = this._gltf.skins[node.skin];
-                    babylonMesh.skeleton = skin.babylonSkeleton;
+                    skin.index = node.skin;
+                    node.babylonMesh.skeleton = this._loadSkin(skin);
                 }
                 if (node.camera !== undefined) {
                     // TODO: handle cameras
                 }
                 return true;
             };
-            GLTFLoader.prototype._loadMeshData = function (node, mesh, babylonMesh) {
+            GLTFLoader.prototype._loadMesh = function (node, mesh) {
                 var _this = this;
-                babylonMesh.name = mesh.name || babylonMesh.name;
-                var babylonMultiMaterial = new BABYLON.MultiMaterial(babylonMesh.name, this._babylonScene);
-                babylonMesh.material = babylonMultiMaterial;
-                var geometry = new BABYLON.Geometry(babylonMesh.name, this._babylonScene, null, false, babylonMesh);
+                node.babylonMesh.name = mesh.name || node.babylonMesh.name;
+                var babylonMultiMaterial = new BABYLON.MultiMaterial(node.babylonMesh.name, this._babylonScene);
+                node.babylonMesh.material = babylonMultiMaterial;
+                var geometry = new BABYLON.Geometry(node.babylonMesh.name, this._babylonScene, null, false, node.babylonMesh);
                 var vertexData = new BABYLON.VertexData();
                 vertexData.positions = [];
                 vertexData.indices = [];
@@ -2796,9 +2752,9 @@ var BABYLON;
                         // TODO: handle other primitive modes
                         throw new Error("Not implemented");
                     }
-                    this_1._createMorphTargets(node, mesh, primitive, babylonMesh);
+                    this_1._createMorphTargets(node, mesh, primitive, node.babylonMesh);
                     this_1._loadVertexDataAsync(primitive, function (subVertexData) {
-                        _this._loadMorphTargetsData(mesh, primitive, subVertexData, babylonMesh);
+                        _this._loadMorphTargetsData(mesh, primitive, subVertexData, node.babylonMesh);
                         subMeshInfos.push({
                             materialIndex: i,
                             verticesStart: vertexData.positions.length,
@@ -2817,7 +2773,7 @@ var BABYLON;
                                         }
                                         if (_this._parent.onBeforeMaterialReadyAsync) {
                                             _this.addLoaderPendingData(material);
-                                            _this._parent.onBeforeMaterialReadyAsync(babylonMaterial, babylonMesh, babylonMultiMaterial.subMaterials[i] != null, function () {
+                                            _this._parent.onBeforeMaterialReadyAsync(babylonMaterial, node.babylonMesh, babylonMultiMaterial.subMaterials[i] != null, function () {
                                                 babylonMultiMaterial.subMaterials[i] = babylonMaterial;
                                                 _this.removeLoaderPendingData(material);
                                             });
@@ -2835,8 +2791,8 @@ var BABYLON;
                             subMeshInfos.forEach(function (info) { return info.loadMaterial(); });
                             // TODO: optimize this so that sub meshes can be created without being overwritten after setting vertex data.
                             // Sub meshes must be cleared and created after setting vertex data because of mesh._createGlobalSubMesh.
-                            babylonMesh.subMeshes = [];
-                            subMeshInfos.forEach(function (info) { return new BABYLON.SubMesh(info.materialIndex, info.verticesStart, info.verticesCount, info.indicesStart, info.indicesCount, babylonMesh); });
+                            node.babylonMesh.subMeshes = [];
+                            subMeshInfos.forEach(function (info) { return new BABYLON.SubMesh(info.materialIndex, info.verticesStart, info.verticesCount, info.indicesStart, info.indicesCount, node.babylonMesh); });
                         }
                     });
                 };
@@ -2974,7 +2930,7 @@ var BABYLON;
                     _loop_3();
                 }
             };
-            GLTFLoader.prototype._loadTransform = function (node, babylonMesh) {
+            GLTFLoader.prototype._loadTransform = function (node) {
                 var position = BABYLON.Vector3.Zero();
                 var rotation = BABYLON.Quaternion.Identity();
                 var scaling = BABYLON.Vector3.One();
@@ -2990,9 +2946,64 @@ var BABYLON;
                     if (node.scale)
                         scaling = BABYLON.Vector3.FromArray(node.scale);
                 }
-                babylonMesh.position = position;
-                babylonMesh.rotationQuaternion = rotation;
-                babylonMesh.scaling = scaling;
+                node.babylonMesh.position = position;
+                node.babylonMesh.rotationQuaternion = rotation;
+                node.babylonMesh.scaling = scaling;
+            };
+            GLTFLoader.prototype._loadSkin = function (skin) {
+                var _this = this;
+                var skeletonId = "skeleton" + skin.index;
+                skin.babylonSkeleton = new BABYLON.Skeleton(skin.name || skeletonId, skeletonId, this._babylonScene);
+                if (skin.inverseBindMatrices === undefined) {
+                    this._loadBones(skin, null);
+                }
+                else {
+                    var accessor = this._gltf.accessors[skin.inverseBindMatrices];
+                    this._loadAccessorAsync(accessor, function (data) {
+                        _this._loadBones(skin, data);
+                    });
+                }
+                return skin.babylonSkeleton;
+            };
+            GLTFLoader.prototype._createBone = function (node, skin, parent, localMatrix, baseMatrix, index) {
+                var babylonBone = new BABYLON.Bone(node.name || "bone" + node.index, skin.babylonSkeleton, parent, localMatrix, null, baseMatrix, index);
+                node.babylonBones = node.babylonBones || {};
+                node.babylonBones[skin.index] = babylonBone;
+                node.babylonAnimationTargets = node.babylonAnimationTargets || [];
+                node.babylonAnimationTargets.push(babylonBone);
+                return babylonBone;
+            };
+            GLTFLoader.prototype._loadBones = function (skin, inverseBindMatrixData) {
+                var babylonBones = {};
+                for (var i = 0; i < skin.joints.length; i++) {
+                    var node = this._gltf.nodes[skin.joints[i]];
+                    this._loadBone(node, skin, inverseBindMatrixData, babylonBones);
+                }
+            };
+            GLTFLoader.prototype._loadBone = function (node, skin, inverseBindMatrixData, babylonBones) {
+                var babylonBone = babylonBones[node.index];
+                if (babylonBone) {
+                    return babylonBone;
+                }
+                var boneIndex = skin.joints.indexOf(node.index);
+                var baseMatrix = BABYLON.Matrix.Identity();
+                if (inverseBindMatrixData && boneIndex !== -1) {
+                    baseMatrix = BABYLON.Matrix.FromArray(inverseBindMatrixData, boneIndex * 16);
+                    baseMatrix.invertToRef(baseMatrix);
+                }
+                var babylonParentBone;
+                if (node.index != skin.skeleton && node.parent) {
+                    babylonParentBone = this._loadBone(node.parent, skin, inverseBindMatrixData, babylonBones);
+                    baseMatrix.multiplyToRef(babylonParentBone.getInvertedAbsoluteTransform(), baseMatrix);
+                }
+                babylonBone = this._createBone(node, skin, babylonParentBone, this._getNodeMatrix(node), baseMatrix, boneIndex);
+                babylonBones[node.index] = babylonBone;
+                return babylonBone;
+            };
+            GLTFLoader.prototype._getNodeMatrix = function (node) {
+                return node.matrix ?
+                    BABYLON.Matrix.FromArray(node.matrix) :
+                    BABYLON.Matrix.Compose(node.scale ? BABYLON.Vector3.FromArray(node.scale) : BABYLON.Vector3.One(), node.rotation ? BABYLON.Quaternion.FromArray(node.rotation) : BABYLON.Quaternion.Identity(), node.translation ? BABYLON.Vector3.FromArray(node.translation) : BABYLON.Vector3.Zero());
             };
             GLTFLoader.prototype._traverseNodes = function (indices, action, parentNode) {
                 if (parentNode === void 0) { parentNode = null; }

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

@@ -55,7 +55,7 @@ var BABYLON;
                     else if (key === "kd") {
                         // Diffuse color (color under white light) using RGB values
                         //value  = "r g b"
-                        color = value.split(delimiter_pattern, 3);
+                        color = value.split(delimiter_pattern, 3).map(parseFloat);
                         //color = [r,g,b]
                         //Set tghe color into the material
                         material.diffuseColor = BABYLON.Color3.FromArray(color);
@@ -63,7 +63,7 @@ var BABYLON;
                     else if (key === "ka") {
                         // Ambient color (color under shadow) using RGB values
                         //value = "r g b"
-                        color = value.split(delimiter_pattern, 3);
+                        color = value.split(delimiter_pattern, 3).map(parseFloat);
                         //color = [r,g,b]
                         //Set tghe color into the material
                         material.ambientColor = BABYLON.Color3.FromArray(color);
@@ -71,23 +71,23 @@ var BABYLON;
                     else if (key === "ks") {
                         // Specular color (color when light is reflected from shiny surface) using RGB values
                         //value = "r g b"
-                        color = value.split(delimiter_pattern, 3);
+                        color = value.split(delimiter_pattern, 3).map(parseFloat);
                         //color = [r,g,b]
                         //Set the color into the material
                         material.specularColor = BABYLON.Color3.FromArray(color);
                     }
                     else if (key === "ke") {
                         // Emissive color using RGB values
-                        color = value.split(delimiter_pattern, 3);
+                        color = value.split(delimiter_pattern, 3).map(parseFloat);
                         material.emissiveColor = BABYLON.Color3.FromArray(color);
                     }
                     else if (key === "ns") {
                         //value = "Integer"
-                        material.specularPower = value;
+                        material.specularPower = parseFloat(value);
                     }
                     else if (key === "d") {
                         //d is dissolve for current material. It mean alpha for BABYLON
-                        material.alpha = value;
+                        material.alpha = parseFloat(value);
                         //Texture
                         //This part can be improved by adding the possible options of texture
                     }

dist/preview release/loaders/package.json

@@ -0,0 +1,37 @@
+{
+    "author": {
+        "name": "David CATUHE"
+    },
+    "name": "babylonjs-loaders",
+    "description": "The Babylon.js file loaders library is an extension you can use to load different 3D file types into a Babylon scene.",
+    "version": "3.1.0-alpha3.4",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/BabylonJS/Babylon.js.git"
+    },
+    "main": "babylonjs.loaders.min.js",
+    "files": [
+        "babylonjs.loaders.js",
+        "babylonjs.loaders.min.js",
+        "babylonjs.loaders.module.d.ts",
+        "readme.md",
+        "package.json"
+    ],
+    "typings": "babylonjs.loaders.module.d.ts",
+    "keywords": [
+        "3D",
+        "javascript",
+        "html5",
+        "webgl",
+        "loaders"
+    ],
+    "license": "Apache-2.0",
+    "peerDependencies": {
+        "babylonjs": ">=3.1.0-alpha"
+    },
+    "engines": {
+        "node": "*"
+    },
+    "_id": "babylonjs-loaders@3.1.0-alpha1",
+    "_from": "babylonjs-loaders@"
+}

dist/preview release/loaders/readme.md

@@ -0,0 +1,44 @@
+Babylon.js Loaders module
+=====================
+
+For usage documentation please visit http://doc.babylonjs.com/extensions and choose "loaders".
+
+# Installation instructions
+
+## CDN
+
+Compiled js files (minified and source) are offered on our public CDN here:
+
+* https://preview.babylonjs.com/loaders/babylonjs.loaders.js
+* https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js
+
+## NPM
+
+To install using npm :
+
+```
+npm install --save babylonjs babylonjs-loaders
+```
+
+If using TypeScript, the typing needs to be added to tsconfig.json:
+
+```
+    ....
+    "types": [
+        "babylonjs",
+        "babylonjs-loaders",
+        ""
+    ],
+    ....
+```
+
+Afterwards it can be imported to the project using:
+
+```
+import * as BABYLON from 'babylonjs';
+import from 'babylonjs-loaders';
+```
+
+This will extend Babylon's namespace with the loaders available.
+
+Using webpack to package your project will use the minified js file.

dist/preview release/materialsLibrary/babylon.gridMaterial.d.ts

@@ -18,6 +18,10 @@ declare module BABYLON {
          */
         gridRatio: number;
         /**
+         * Allows setting an offset for the grid lines.
+         */
+        gridOffset: Vector3;
+        /**
          * The frequency of thicker lines.
          */
         majorUnitFrequency: number;

dist/preview release/materialsLibrary/package.json

@@ -0,0 +1,37 @@
+{
+    "author": {
+        "name": "David CATUHE"
+    },
+    "name": "babylonjs-materials",
+    "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
+    "version": "3.1.0-alpha3.4",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/BabylonJS/Babylon.js.git"
+    },
+    "main": "babylonjs.materials.min.js",
+    "files": [
+        "babylonjs.materials.js",
+        "babylonjs.materials.min.js",
+        "babylonjs.materials.module.d.ts",
+        "readme.md",
+        "package.json"
+    ],
+    "typings": "babylonjs.materials.module.d.ts",
+    "keywords": [
+        "3D",
+        "javascript",
+        "html5",
+        "webgl",
+        "materials"
+    ],
+    "license": "Apache-2.0",
+    "peerDependencies": {
+        "babylonjs": ">=3.1.0-alpha"
+    },
+    "engines": {
+        "node": "*"
+    },
+    "_id": "babylonjs-materials@3.1.0-alpha1",
+    "_from": "babylonjs-materials@"
+}

dist/preview release/materialsLibrary/readme.md

@@ -0,0 +1,51 @@
+Babylon.js Materials Library
+=====================
+
+For usage documentation please visit http://doc.babylonjs.com/extensions and choose "materials library".
+
+# Installation instructions
+
+## CDN
+
+Compiled js files (minified and source) are offered on our public CDN here:
+
+* https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.js
+* https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js
+
+## NPM
+
+To install using npm :
+
+```
+npm install --save babylonjs babylonjs-materials
+```
+
+If using TypeScript, the typing needs to be added to tsconfig.json:
+
+```
+    ....
+    "types": [
+        "babylonjs",
+        "babylonjs-materials",
+        "oneMoreDependencyThatIReallyNeed"
+    ],
+    ....
+```
+
+Afterwards it can be imported to the project using:
+
+```
+import * as BABYLON from 'babylonjs';
+import from 'babylonjs-materials';
+```
+
+This will extend Babylon's namespace with the materials available:
+
+```
+// Some awesome code
+let skyMaterial = new BABYLON.SkyMaterial("skyMaterial", scene);
+skyMaterial.backFaceCulling = false;
+// Some more awesome code
+```
+
+Using webpack to package your project will use the minified js file.

dist/preview release/postProcessesLibrary/babylonjs.postProcess.module.d.ts

@@ -0,0 +1,206 @@
+/// <reference types="babylonjs"/>
+
+declare module 'babylonjs-post-process' { 
+    export = BABYLON; 
+}
+
+declare module BABYLON {
+    /**
+     * AsciiArtFontTexture is the helper class used to easily create your ascii art font texture.
+     *
+     * It basically takes care rendering the font front the given font size to a texture.
+     * This is used later on in the postprocess.
+     */
+    class AsciiArtFontTexture extends BaseTexture {
+        private _font;
+        private _text;
+        private _charSize;
+        /**
+         * Gets the size of one char in the texture (each char fits in size * size space in the texture).
+         */
+        readonly charSize: number;
+        /**
+         * Create a new instance of the Ascii Art FontTexture class
+         * @param name the name of the texture
+         * @param font the font to use, use the W3C CSS notation
+         * @param text the caracter set to use in the rendering.
+         * @param scene the scene that owns the texture
+         */
+        constructor(name: string, font: string, text: string, scene: Scene);
+        /**
+         * Gets the max char width of a font.
+         * @param font the font to use, use the W3C CSS notation
+         * @return the max char width
+         */
+        private getFontWidth(font);
+        /**
+         * Gets the max char height of a font.
+         * @param font the font to use, use the W3C CSS notation
+         * @return the max char height
+         */
+        private getFontHeight(font);
+        /**
+         * Clones the current AsciiArtTexture.
+         * @return the clone of the texture.
+         */
+        clone(): AsciiArtFontTexture;
+        /**
+         * Parses a json object representing the texture and returns an instance of it.
+         * @param source the source JSON representation
+         * @param scene the scene to create the texture for
+         * @return the parsed texture
+         */
+        static Parse(source: any, scene: Scene): AsciiArtFontTexture;
+    }
+    /**
+     * Option available in the Ascii Art Post Process.
+     */
+    interface IAsciiArtPostProcessOptions {
+        /**
+         * The font to use following the w3c font definition.
+         */
+        font?: string;
+        /**
+         * The character set to use in the postprocess.
+         */
+        characterSet?: string;
+        /**
+         * This defines the amount you want to mix the "tile" or caracter space colored in the ascii art.
+         * This number is defined between 0 and 1;
+         */
+        mixToTile?: number;
+        /**
+         * This defines the amount you want to mix the normal rendering pass in the ascii art.
+         * This number is defined between 0 and 1;
+         */
+        mixToNormal?: number;
+    }
+    /**
+     * AsciiArtPostProcess helps rendering everithing in Ascii Art.
+     *
+     * Simmply add it to your scene and let the nerd that lives in you have fun.
+     * Example usage: var pp = new AsciiArtPostProcess("myAscii", "20px Monospace", camera);
+     */
+    class AsciiArtPostProcess extends PostProcess {
+        /**
+         * The font texture used to render the char in the post process.
+         */
+        private _asciiArtFontTexture;
+        /**
+         * This defines the amount you want to mix the "tile" or caracter space colored in the ascii art.
+         * This number is defined between 0 and 1;
+         */
+        mixToTile: number;
+        /**
+         * This defines the amount you want to mix the normal rendering pass in the ascii art.
+         * This number is defined between 0 and 1;
+         */
+        mixToNormal: number;
+        /**
+         * Instantiates a new Ascii Art Post Process.
+         * @param name the name to give to the postprocess
+         * @camera the camera to apply the post process to.
+         * @param options can either be the font name or an option object following the IAsciiArtPostProcessOptions format
+         */
+        constructor(name: string, camera: Camera, options?: string | IAsciiArtPostProcessOptions);
+    }
+}
+
+
+declare module BABYLON {
+    /**
+     * DigitalRainFontTexture is the helper class used to easily create your digital rain font texture.
+     *
+     * It basically takes care rendering the font front the given font size to a texture.
+     * This is used later on in the postprocess.
+     */
+    class DigitalRainFontTexture extends BaseTexture {
+        private _font;
+        private _text;
+        private _charSize;
+        /**
+         * Gets the size of one char in the texture (each char fits in size * size space in the texture).
+         */
+        readonly charSize: number;
+        /**
+         * Create a new instance of the Digital Rain FontTexture class
+         * @param name the name of the texture
+         * @param font the font to use, use the W3C CSS notation
+         * @param text the caracter set to use in the rendering.
+         * @param scene the scene that owns the texture
+         */
+        constructor(name: string, font: string, text: string, scene: Scene);
+        /**
+         * Gets the max char width of a font.
+         * @param font the font to use, use the W3C CSS notation
+         * @return the max char width
+         */
+        private getFontWidth(font);
+        /**
+         * Gets the max char height of a font.
+         * @param font the font to use, use the W3C CSS notation
+         * @return the max char height
+         */
+        private getFontHeight(font);
+        /**
+         * Clones the current DigitalRainFontTexture.
+         * @return the clone of the texture.
+         */
+        clone(): DigitalRainFontTexture;
+        /**
+         * Parses a json object representing the texture and returns an instance of it.
+         * @param source the source JSON representation
+         * @param scene the scene to create the texture for
+         * @return the parsed texture
+         */
+        static Parse(source: any, scene: Scene): DigitalRainFontTexture;
+    }
+    /**
+     * Option available in the Digital Rain Post Process.
+     */
+    interface IDigitalRainPostProcessOptions {
+        /**
+         * The font to use following the w3c font definition.
+         */
+        font?: string;
+        /**
+         * This defines the amount you want to mix the "tile" or caracter space colored in the digital rain.
+         * This number is defined between 0 and 1;
+         */
+        mixToTile?: number;
+        /**
+         * This defines the amount you want to mix the normal rendering pass in the digital rain.
+         * This number is defined between 0 and 1;
+         */
+        mixToNormal?: number;
+    }
+    /**
+     * DigitalRainPostProcess helps rendering everithing in digital rain.
+     *
+     * Simmply add it to your scene and let the nerd that lives in you have fun.
+     * Example usage: var pp = new DigitalRainPostProcess("digitalRain", "20px Monospace", camera);
+     */
+    class DigitalRainPostProcess extends PostProcess {
+        /**
+         * The font texture used to render the char in the post process.
+         */
+        private _digitalRainFontTexture;
+        /**
+         * This defines the amount you want to mix the "tile" or caracter space colored in the digital rain.
+         * This number is defined between 0 and 1;
+         */
+        mixToTile: number;
+        /**
+         * This defines the amount you want to mix the normal rendering pass in the digital rain.
+         * This number is defined between 0 and 1;
+         */
+        mixToNormal: number;
+        /**
+         * Instantiates a new Digital Rain Post Process.
+         * @param name the name to give to the postprocess
+         * @camera the camera to apply the post process to.
+         * @param options can either be the font name or an option object following the IDigitalRainPostProcessOptions format
+         */
+        constructor(name: string, camera: Camera, options?: string | IDigitalRainPostProcessOptions);
+    }
+}

dist/preview release/postProcessesLibrary/package.json

@@ -0,0 +1,37 @@
+{
+    "author": {
+        "name": "David CATUHE"
+    },
+    "name": "babylonjs-post-process",
+    "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
+    "version": "3.1.0-alpha3.4",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/BabylonJS/Babylon.js.git"
+    },
+    "main": "babylonjs.postProcess.min.js",
+    "files": [
+        "babylonjs.postProcess.js",
+        "babylonjs.postProcess.min.js",
+        "babylonjs.postProcess.module.d.ts",
+        "readme.md",
+        "package.json"
+    ],
+    "typings": "babylonjs.postProcess.module.d.ts",
+    "keywords": [
+        "3D",
+        "javascript",
+        "html5",
+        "webgl",
+        "post process"
+    ],
+    "license": "Apache-2.0",
+    "peerDependencies": {
+        "babylonjs": ">=3.1.0-alpha"
+    },
+    "engines": {
+        "node": "*"
+    },
+    "_id": "babylonjs-post-process@3.1.0-alpha1",
+    "_from": "babylonjs-post-process@"
+}

dist/preview release/postProcessesLibrary/readme.md

@@ -0,0 +1,51 @@
+Babylon.js Post Processes Library
+=====================
+
+For usage documentation please visit http://doc.babylonjs.com/extensions and choose "post process library".
+
+# Installation instructions
+
+## CDN
+
+Compiled js files (minified and source) are offered on our public CDN here:
+
+* https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.js
+* https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js
+
+## NPM
+
+To install using npm :
+
+```
+npm install --save babylonjs babylonjs-post-process
+```
+
+If using TypeScript, the typing needs to be added to tsconfig.json:
+
+```
+    ....
+    "types": [
+        "babylonjs",
+        "babylonjs-post-process",
+        "oneMoreDependencyThatIReallyNeed"
+    ],
+    ....
+```
+
+Afterwards it can be imported to the project using:
+
+```
+import * as BABYLON from 'babylonjs';
+import from 'babylonjs-post-process';
+```
+
+This will extend Babylon's namespace with the post processes available:
+
+```
+// Some awesome code
+// Creates the post process
+let postProcess = new BABYLON.AsciiArtPostProcess("AsciiArt", camera);
+// Some more awesome code
+```
+
+Using webpack to package your project will use the minified js file.