@babylonjs/loaders 5.0.0-alpha.9 → 5.0.0-beta.11

package/glTF/2.0/glTFLoader.js

@@ -1,29 +1,29 @@
-import { Deferred } from "@babylonjs/core/Misc/deferred";
-import { Quaternion, Vector3, Matrix } from "@babylonjs/core/Maths/math.vector";
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { Tools } from "@babylonjs/core/Misc/tools";
-import { Camera } from "@babylonjs/core/Cameras/camera";
-import { FreeCamera } from "@babylonjs/core/Cameras/freeCamera";
-import { AnimationGroup } from "@babylonjs/core/Animations/animationGroup";
-import { Animation } from "@babylonjs/core/Animations/animation";
-import { Bone } from "@babylonjs/core/Bones/bone";
-import { Skeleton } from "@babylonjs/core/Bones/skeleton";
-import { Material } from "@babylonjs/core/Materials/material";
-import { PBRMaterial } from "@babylonjs/core/Materials/PBR/pbrMaterial";
-import { Texture } from "@babylonjs/core/Materials/Textures/texture";
-import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
-import { Buffer, VertexBuffer } from "@babylonjs/core/Meshes/buffer";
-import { Geometry } from "@babylonjs/core/Meshes/geometry";
-import { Mesh } from "@babylonjs/core/Meshes/mesh";
-import { MorphTarget } from "@babylonjs/core/Morph/morphTarget";
-import { MorphTargetManager } from "@babylonjs/core/Morph/morphTargetManager";
-import { GLTFFileLoader, GLTFLoaderState, GLTFLoaderCoordinateSystemMode, GLTFLoaderAnimationStartMode } from "../glTFFileLoader";
-import { AnimationKeyInterpolation } from '@babylonjs/core/Animations/animationKey';
-import { LoadFileError } from '@babylonjs/core/Misc/fileTools';
-import { Logger } from '@babylonjs/core/Misc/logger';
-import { TmpVectors } from '@babylonjs/core/Maths/math.vector';
-import { BoundingInfo } from '@babylonjs/core/Culling/boundingInfo';
-import { StringTools } from '@babylonjs/core/Misc/stringTools';
+import { Deferred } from "@babylonjs/core/Misc/deferred.js";
+import { Quaternion, Vector3, Matrix } from "@babylonjs/core/Maths/math.vector.js";
+import { Color3 } from '@babylonjs/core/Maths/math.color.js';
+import { Tools } from "@babylonjs/core/Misc/tools.js";
+import { Camera } from "@babylonjs/core/Cameras/camera.js";
+import { FreeCamera } from "@babylonjs/core/Cameras/freeCamera.js";
+import { AnimationGroup } from "@babylonjs/core/Animations/animationGroup.js";
+import { Animation } from "@babylonjs/core/Animations/animation.js";
+import { Bone } from "@babylonjs/core/Bones/bone.js";
+import { Skeleton } from "@babylonjs/core/Bones/skeleton.js";
+import { Material } from "@babylonjs/core/Materials/material.js";
+import { PBRMaterial } from "@babylonjs/core/Materials/PBR/pbrMaterial.js";
+import { Texture } from "@babylonjs/core/Materials/Textures/texture.js";
+import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
+import { Buffer, VertexBuffer } from "@babylonjs/core/Buffers/buffer.js";
+import { Geometry } from "@babylonjs/core/Meshes/geometry.js";
+import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
+import { MorphTarget } from "@babylonjs/core/Morph/morphTarget.js";
+import { MorphTargetManager } from "@babylonjs/core/Morph/morphTargetManager.js";
+import { GLTFFileLoader, GLTFLoaderState, GLTFLoaderCoordinateSystemMode, GLTFLoaderAnimationStartMode } from "../glTFFileLoader.js";
+import { AnimationKeyInterpolation } from '@babylonjs/core/Animations/animationKey.js';
+import { DecodeBase64UrlToBinary, IsBase64DataUrl, LoadFileError } from '@babylonjs/core/Misc/fileTools.js';
+import { Logger } from '@babylonjs/core/Misc/logger.js';
+import { TmpVectors } from '@babylonjs/core/Maths/math.vector.js';
+import { BoundingInfo } from '@babylonjs/core/Culling/boundingInfo.js';
+import { StringTools } from '@babylonjs/core/Misc/stringTools.js';
 /**
  * Helper class for working with arrays when loading the glTF asset
  */
@@ -39,7 +39,7 @@ var ArrayItem = /** @class */ (function () {
      */
     ArrayItem.Get = function (context, array, index) {
         if (!array || index == undefined || !array[index]) {
-            throw new Error(context + ": Failed to find index (" + index + ")");
+            throw new Error("".concat(context, ": Failed to find index (").concat(index, ")"));
         }
         return array[index];
     };
@@ -66,15 +66,20 @@ var GLTFLoader = /** @class */ (function () {
         /** @hidden */
         this._completePromises = new Array();
         /** @hidden */
-        this._forAssetContainer = false;
+        this._assetContainer = null;
         /** Storage */
         this._babylonLights = [];
         /** @hidden */
         this._disableInstancedMesh = 0;
-        this._disposed = false;
-        this._state = null;
         this._extensions = new Array();
+        this._disposed = false;
+        this._rootUrl = null;
+        this._fileName = null;
+        this._uniqueRootUrl = null;
+        this._bin = null;
+        this._rootBabylonMesh = null;
         this._defaultBabylonMaterialData = {};
+        this._postSceneLoadActions = new Array();
         this._parent = parent;
     }
     /**
@@ -84,7 +89,7 @@ var GLTFLoader = /** @class */ (function () {
      */
     GLTFLoader.RegisterExtension = function (name, factory) {
         if (GLTFLoader.UnregisterExtension(name)) {
-            Logger.Warn("Extension with the name '" + name + "' already exists");
+            Logger.Warn("Extension with the name '".concat(name, "' already exists"));
         }
         GLTFLoader._RegisteredExtensions[name] = {
             factory: factory
@@ -102,21 +107,14 @@ var GLTFLoader = /** @class */ (function () {
         delete GLTFLoader._RegisteredExtensions[name];
         return true;
     };
-    Object.defineProperty(GLTFLoader.prototype, "state", {
-        /**
-         * The loader state.
-         */
-        get: function () {
-            return this._state;
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(GLTFLoader.prototype, "gltf", {
         /**
          * The object that represents the glTF JSON.
          */
         get: function () {
+            if (!this._gltf) {
+                throw new Error("glTF JSON is not available");
+            }
             return this._gltf;
         },
         enumerable: false,
@@ -147,6 +145,9 @@ var GLTFLoader = /** @class */ (function () {
          * The Babylon scene when loading the asset.
          */
         get: function () {
+            if (!this._babylonScene) {
+                throw new Error("Scene is not available");
+            }
             return this._babylonScene;
         },
         enumerable: false,
@@ -169,23 +170,23 @@ var GLTFLoader = /** @class */ (function () {
         }
         this._disposed = true;
         this._completePromises.length = 0;
-        for (var name_1 in this._extensions) {
-            var extension = this._extensions[name_1];
-            extension.dispose && extension.dispose();
-            delete this._extensions[name_1];
-        }
-        this._gltf = null;
-        this._babylonScene = null;
+        this._extensions.forEach(function (extension) { return extension.dispose && extension.dispose(); });
+        this._extensions.length = 0;
+        this._gltf = null; // TODO
+        this._bin = null;
+        this._babylonScene = null; // TODO
         this._rootBabylonMesh = null;
+        this._defaultBabylonMaterialData = {};
+        this._postSceneLoadActions.length = 0;
         this._parent.dispose();
     };
     /** @hidden */
-    GLTFLoader.prototype.importMeshAsync = function (meshesNames, scene, forAssetContainer, data, rootUrl, onProgress, fileName) {
+    GLTFLoader.prototype.importMeshAsync = function (meshesNames, scene, container, data, rootUrl, onProgress, fileName) {
         var _this = this;
         if (fileName === void 0) { fileName = ""; }
         return Promise.resolve().then(function () {
             _this._babylonScene = scene;
-            _this._forAssetContainer = forAssetContainer;
+            _this._assetContainer = container;
             _this._loadData(data);
             var nodes = null;
             if (meshesNames) {
@@ -202,7 +203,7 @@ var GLTFLoader = /** @class */ (function () {
                 nodes = names.map(function (name) {
                     var node = nodeMap_1[name];
                     if (node === undefined) {
-                        throw new Error("Failed to find node '" + name + "'");
+                        throw new Error("Failed to find node '".concat(name, "'"));
                     }
                     return node;
                 });
@@ -234,15 +235,15 @@ var GLTFLoader = /** @class */ (function () {
         var _this = this;
         return Promise.resolve().then(function () {
             _this._rootUrl = rootUrl;
-            _this._uniqueRootUrl = (!StringTools.StartsWith(rootUrl, "file:") && fileName) ? rootUrl : "" + rootUrl + Date.now() + "/";
+            _this._uniqueRootUrl = (!StringTools.StartsWith(rootUrl, "file:") && fileName) ? rootUrl : "".concat(rootUrl).concat(Date.now(), "/");
             _this._fileName = fileName;
             _this._loadExtensions();
             _this._checkExtensions();
-            var loadingToReadyCounterName = GLTFLoaderState[GLTFLoaderState.LOADING] + " => " + GLTFLoaderState[GLTFLoaderState.READY];
-            var loadingToCompleteCounterName = GLTFLoaderState[GLTFLoaderState.LOADING] + " => " + GLTFLoaderState[GLTFLoaderState.COMPLETE];
+            var loadingToReadyCounterName = "".concat(GLTFLoaderState[GLTFLoaderState.LOADING], " => ").concat(GLTFLoaderState[GLTFLoaderState.READY]);
+            var loadingToCompleteCounterName = "".concat(GLTFLoaderState[GLTFLoaderState.LOADING], " => ").concat(GLTFLoaderState[GLTFLoaderState.COMPLETE]);
             _this._parent._startPerformanceCounter(loadingToReadyCounterName);
             _this._parent._startPerformanceCounter(loadingToCompleteCounterName);
-            _this._setState(GLTFLoaderState.LOADING);
+            _this._parent._setState(GLTFLoaderState.LOADING);
             _this._extensionsOnLoading();
             var promises = new Array();
             // Block the marking of materials dirty until the scene is loaded.
@@ -253,7 +254,7 @@ var GLTFLoader = /** @class */ (function () {
             }
             else if (_this._gltf.scene != undefined || (_this._gltf.scenes && _this._gltf.scenes[0])) {
                 var scene = ArrayItem.Get("/scene", _this._gltf.scenes, _this._gltf.scene || 0);
-                promises.push(_this.loadSceneAsync("/scenes/" + scene.index, scene));
+                promises.push(_this.loadSceneAsync("/scenes/".concat(scene.index), scene));
             }
             if (_this.parent.loadAllMaterials && _this._gltf.materials) {
                 for (var m = 0; m < _this._gltf.materials.length; ++m) {
@@ -276,7 +277,7 @@ var GLTFLoader = /** @class */ (function () {
                     _this._rootBabylonMesh.setEnabled(true);
                 }
                 _this._extensionsOnReady();
-                _this._setState(GLTFLoaderState.READY);
+                _this._parent._setState(GLTFLoaderState.READY);
                 _this._startAnimations();
                 return resultFunc();
             });
@@ -286,7 +287,7 @@ var GLTFLoader = /** @class */ (function () {
                     if (!_this._disposed) {
                         Promise.all(_this._completePromises).then(function () {
                             _this._parent._endPerformanceCounter(loadingToCompleteCounterName);
-                            _this._setState(GLTFLoaderState.COMPLETE);
+                            _this._parent._setState(GLTFLoaderState.COMPLETE);
                             _this._parent.onCompleteObservable.notifyObservers(undefined);
                             _this._parent.onCompleteObservable.clear();
                             _this.dispose();
@@ -316,7 +317,7 @@ var GLTFLoader = /** @class */ (function () {
             if (buffers && buffers[0] && !buffers[0].uri) {
                 var binaryBuffer = buffers[0];
                 if (binaryBuffer.byteLength < data.bin.byteLength - 3 || binaryBuffer.byteLength > data.bin.byteLength) {
-                    Logger.Warn("Binary buffer length (" + binaryBuffer.byteLength + ") from JSON does not match chunk length (" + data.bin.byteLength + ")");
+                    Logger.Warn("Binary buffer length (".concat(binaryBuffer.byteLength, ") from JSON does not match chunk length (").concat(data.bin.byteLength, ")"));
                 }
                 this._bin = data.bin;
             }
@@ -359,10 +360,10 @@ var GLTFLoader = /** @class */ (function () {
         }
     };
     GLTFLoader.prototype._loadExtensions = function () {
-        for (var name_2 in GLTFLoader._RegisteredExtensions) {
-            var extension = GLTFLoader._RegisteredExtensions[name_2].factory(this);
-            if (extension.name !== name_2) {
-                Logger.Warn("The name of the glTF loader extension instance does not match the registered name: " + extension.name + " !== " + name_2);
+        for (var name_1 in GLTFLoader._RegisteredExtensions) {
+            var extension = GLTFLoader._RegisteredExtensions[name_1].factory(this);
+            if (extension.name !== name_1) {
+                Logger.Warn("The name of the glTF loader extension instance does not match the registered name: ".concat(extension.name, " !== ").concat(name_1));
             }
             this._extensions.push(extension);
             this._parent.onExtensionLoadedObservable.notifyObservers(extension);
@@ -372,26 +373,23 @@ var GLTFLoader = /** @class */ (function () {
     };
     GLTFLoader.prototype._checkExtensions = function () {
         if (this._gltf.extensionsRequired) {
-            var _loop_1 = function (name_3) {
-                var available = this_1._extensions.some(function (extension) { return extension.name === name_3 && extension.enabled; });
+            var _loop_1 = function (name_2) {
+                var available = this_1._extensions.some(function (extension) { return extension.name === name_2 && extension.enabled; });
                 if (!available) {
-                    throw new Error("Require extension " + name_3 + " is not available");
+                    throw new Error("Require extension ".concat(name_2, " is not available"));
                 }
             };
             var this_1 = this;
             for (var _i = 0, _a = this._gltf.extensionsRequired; _i < _a.length; _i++) {
-                var name_3 = _a[_i];
-                _loop_1(name_3);
+                var name_2 = _a[_i];
+                _loop_1(name_2);
             }
         }
     };
-    GLTFLoader.prototype._setState = function (state) {
-        this._state = state;
-        this.log(GLTFLoaderState[this._state]);
-    };
     GLTFLoader.prototype._createRootNode = function () {
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
         this._rootBabylonMesh = new Mesh("__root__", this._babylonScene);
+        this._rootBabylonMesh._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         this._rootBabylonMesh.setEnabled(false);
         var rootNode = {
@@ -412,7 +410,7 @@ var GLTFLoader = /** @class */ (function () {
                 break;
             }
             default: {
-                throw new Error("Invalid coordinate system mode (" + this._parent.coordinateSystemMode + ")");
+                throw new Error("Invalid coordinate system mode (".concat(this._parent.coordinateSystemMode, ")"));
             }
         }
         this._parent.onMeshLoadedObservable.notifyObservers(this._rootBabylonMesh);
@@ -431,28 +429,19 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         var promises = new Array();
-        this.logOpen(context + " " + (scene.name || ""));
+        this.logOpen("".concat(context, " ").concat(scene.name || ""));
         if (scene.nodes) {
             for (var _i = 0, _a = scene.nodes; _i < _a.length; _i++) {
                 var index = _a[_i];
-                var node = ArrayItem.Get(context + "/nodes/" + index, this._gltf.nodes, index);
-                promises.push(this.loadNodeAsync("/nodes/" + node.index, node, function (babylonMesh) {
+                var node = ArrayItem.Get("".concat(context, "/nodes/").concat(index), this._gltf.nodes, index);
+                promises.push(this.loadNodeAsync("/nodes/".concat(node.index), node, function (babylonMesh) {
                     babylonMesh.parent = _this._rootBabylonMesh;
                 }));
             }
         }
-        // Link all Babylon bones for each glTF node with the corresponding Babylon transform node.
-        // A glTF joint is a pointer to a glTF node in the glTF node hierarchy similar to Unity3D.
-        if (this._gltf.nodes) {
-            for (var _b = 0, _c = this._gltf.nodes; _b < _c.length; _b++) {
-                var node = _c[_b];
-                if (node._babylonTransformNode && node._babylonBones) {
-                    for (var _d = 0, _e = node._babylonBones; _d < _e.length; _d++) {
-                        var babylonBone = _e[_d];
-                        babylonBone.linkTransformNode(node._babylonTransformNode);
-                    }
-                }
-            }
+        for (var _b = 0, _c = this._postSceneLoadActions; _b < _c.length; _b++) {
+            var action = _c[_b];
+            action();
         }
         promises.push(this._loadAnimationsAsync());
         this.logClose();
@@ -484,8 +473,10 @@ var GLTFLoader = /** @class */ (function () {
     };
     GLTFLoader.prototype._getMeshes = function () {
         var meshes = new Array();
-        // Root mesh is always first.
-        meshes.push(this._rootBabylonMesh);
+        // Root mesh is always first, if available.
+        if (this._rootBabylonMesh) {
+            meshes.push(this._rootBabylonMesh);
+        }
         var nodes = this._gltf.nodes;
         if (nodes) {
             for (var _i = 0, nodes_2 = nodes; _i < nodes_2.length; _i++) {
@@ -558,7 +549,7 @@ var GLTFLoader = /** @class */ (function () {
                 break;
             }
             default: {
-                Logger.Error("Invalid animation start mode (" + this._parent.animationStartMode + ")");
+                Logger.Error("Invalid animation start mode (".concat(this._parent.animationStartMode, ")"));
                 return;
             }
         }
@@ -578,40 +569,69 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         if (node._babylonTransformNode) {
-            throw new Error(context + ": Invalid recursive node hierarchy");
+            throw new Error("".concat(context, ": Invalid recursive node hierarchy"));
         }
         var promises = new Array();
-        this.logOpen(context + " " + (node.name || ""));
+        this.logOpen("".concat(context, " ").concat(node.name || ""));
         var loadNode = function (babylonTransformNode) {
             GLTFLoader.AddPointerMetadata(babylonTransformNode, context);
             GLTFLoader._LoadTransform(node, babylonTransformNode);
             if (node.camera != undefined) {
-                var camera = ArrayItem.Get(context + "/camera", _this._gltf.cameras, node.camera);
-                promises.push(_this.loadCameraAsync("/cameras/" + camera.index, camera, function (babylonCamera) {
+                var camera = ArrayItem.Get("".concat(context, "/camera"), _this._gltf.cameras, node.camera);
+                promises.push(_this.loadCameraAsync("/cameras/".concat(camera.index), camera, function (babylonCamera) {
                     babylonCamera.parent = babylonTransformNode;
                 }));
             }
             if (node.children) {
                 for (var _i = 0, _a = node.children; _i < _a.length; _i++) {
                     var index = _a[_i];
-                    var childNode = ArrayItem.Get(context + "/children/" + index, _this._gltf.nodes, index);
-                    promises.push(_this.loadNodeAsync("/nodes/" + childNode.index, childNode, function (childBabylonMesh) {
+                    var childNode = ArrayItem.Get("".concat(context, "/children/").concat(index), _this._gltf.nodes, index);
+                    promises.push(_this.loadNodeAsync("/nodes/".concat(childNode.index), childNode, function (childBabylonMesh) {
                         childBabylonMesh.parent = babylonTransformNode;
                     }));
                 }
             }
             assign(babylonTransformNode);
         };
-        if (node.mesh == undefined) {
-            var nodeName = node.name || "node" + node.index;
-            this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        if (node.mesh == undefined || node.skin != undefined) {
+            var nodeName = node.name || "node".concat(node.index);
+            this._babylonScene._blockEntityCollection = !!this._assetContainer;
             node._babylonTransformNode = new TransformNode(nodeName, this._babylonScene);
+            node._babylonTransformNode._parentContainer = this._assetContainer;
             this._babylonScene._blockEntityCollection = false;
             loadNode(node._babylonTransformNode);
         }
-        else {
-            var mesh = ArrayItem.Get(context + "/mesh", this._gltf.meshes, node.mesh);
-            promises.push(this._loadMeshAsync("/meshes/" + mesh.index, node, mesh, loadNode));
+        if (node.mesh != undefined) {
+            if (node.skin == undefined) {
+                var mesh = ArrayItem.Get("".concat(context, "/mesh"), this._gltf.meshes, node.mesh);
+                promises.push(this._loadMeshAsync("/meshes/".concat(mesh.index), node, mesh, loadNode));
+            }
+            else {
+                // See https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#skins (second implementation note)
+                // This code path will place the skinned mesh as a sibling of the skeleton root node without loading the
+                // transform, which effectively ignores the transform of the skinned mesh, as per spec.
+                var mesh = ArrayItem.Get("".concat(context, "/mesh"), this._gltf.meshes, node.mesh);
+                promises.push(this._loadMeshAsync("/meshes/".concat(mesh.index), node, mesh, function (babylonTransformNode) {
+                    GLTFLoader.AddPointerMetadata(babylonTransformNode, context);
+                    var skin = ArrayItem.Get("".concat(context, "/skin"), _this._gltf.skins, node.skin);
+                    promises.push(_this._loadSkinAsync("/skins/".concat(skin.index), node, skin, function (babylonSkeleton) {
+                        _this._forEachPrimitive(node, function (babylonMesh) {
+                            babylonMesh.skeleton = babylonSkeleton;
+                        });
+                        // Wait until the scene is loaded to ensure the skeleton root node has been loaded.
+                        _this._postSceneLoadActions.push(function () {
+                            if (skin.skeleton != undefined) {
+                                // Place the skinned mesh node as a sibling of the skeleton root node.
+                                var skeletonRootNode = ArrayItem.Get("/skins/".concat(skin.index, "/skeleton"), _this._gltf.nodes, skin.skeleton);
+                                babylonTransformNode.parent = skeletonRootNode.parent._babylonTransformNode;
+                            }
+                            else {
+                                babylonTransformNode.parent = _this._rootBabylonMesh;
+                            }
+                        });
+                    }));
+                }));
+            }
         }
         this.logClose();
         return Promise.all(promises).then(function () {
@@ -630,38 +650,35 @@ var GLTFLoader = /** @class */ (function () {
     GLTFLoader.prototype._loadMeshAsync = function (context, node, mesh, assign) {
         var primitives = mesh.primitives;
         if (!primitives || !primitives.length) {
-            throw new Error(context + ": Primitives are missing");
+            throw new Error("".concat(context, ": Primitives are missing"));
         }
         if (primitives[0].index == undefined) {
             ArrayItem.Assign(primitives);
         }
         var promises = new Array();
-        this.logOpen(context + " " + (mesh.name || ""));
-        var name = node.name || "node" + node.index;
+        this.logOpen("".concat(context, " ").concat(mesh.name || ""));
+        var name = node.name || "node".concat(node.index);
         if (primitives.length === 1) {
             var primitive = mesh.primitives[0];
-            promises.push(this._loadMeshPrimitiveAsync(context + "/primitives/" + primitive.index, name, node, mesh, primitive, function (babylonMesh) {
+            promises.push(this._loadMeshPrimitiveAsync("".concat(context, "/primitives/").concat(primitive.index), name, node, mesh, primitive, function (babylonMesh) {
                 node._babylonTransformNode = babylonMesh;
                 node._primitiveBabylonMeshes = [babylonMesh];
             }));
         }
         else {
-            this._babylonScene._blockEntityCollection = this._forAssetContainer;
+            this._babylonScene._blockEntityCollection = !!this._assetContainer;
             node._babylonTransformNode = new TransformNode(name, this._babylonScene);
+            node._babylonTransformNode._parentContainer = this._assetContainer;
             this._babylonScene._blockEntityCollection = false;
             node._primitiveBabylonMeshes = [];
             for (var _i = 0, primitives_1 = primitives; _i < primitives_1.length; _i++) {
                 var primitive = primitives_1[_i];
-                promises.push(this._loadMeshPrimitiveAsync(context + "/primitives/" + primitive.index, name + "_primitive" + primitive.index, node, mesh, primitive, function (babylonMesh) {
+                promises.push(this._loadMeshPrimitiveAsync("".concat(context, "/primitives/").concat(primitive.index), "".concat(name, "_primitive").concat(primitive.index), node, mesh, primitive, function (babylonMesh) {
                     babylonMesh.parent = node._babylonTransformNode;
                     node._primitiveBabylonMeshes.push(babylonMesh);
                 }));
             }
         }
-        if (node.skin != undefined) {
-            var skin = ArrayItem.Get(context + "/skin", this._gltf.skins, node.skin);
-            promises.push(this._loadSkinAsync("/skins/" + skin.index, node, skin));
-        }
         assign(node._babylonTransformNode);
         this.logClose();
         return Promise.all(promises).then(function () {
@@ -684,27 +701,30 @@ var GLTFLoader = /** @class */ (function () {
         if (extensionPromise) {
             return extensionPromise;
         }
-        this.logOpen("" + context);
+        this.logOpen("".concat(context));
         var shouldInstance = (this._disableInstancedMesh === 0) && this._parent.createInstances && (node.skin == undefined && !mesh.primitives[0].targets);
         var babylonAbstractMesh;
         var promise;
         if (shouldInstance && primitive._instanceData) {
-            this._babylonScene._blockEntityCollection = this._forAssetContainer;
+            this._babylonScene._blockEntityCollection = !!this._assetContainer;
             babylonAbstractMesh = primitive._instanceData.babylonSourceMesh.createInstance(name);
+            babylonAbstractMesh._parentContainer = this._assetContainer;
             this._babylonScene._blockEntityCollection = false;
             promise = primitive._instanceData.promise;
         }
         else {
             var promises = new Array();
-            this._babylonScene._blockEntityCollection = this._forAssetContainer;
+            this._babylonScene._blockEntityCollection = !!this._assetContainer;
             var babylonMesh_1 = new Mesh(name, this._babylonScene);
+            babylonMesh_1._parentContainer = this._assetContainer;
             this._babylonScene._blockEntityCollection = false;
             babylonMesh_1.overrideMaterialSideOrientation = this._babylonScene.useRightHandedSystem ? Material.CounterClockWiseSideOrientation : Material.ClockWiseSideOrientation;
             this._createMorphTargets(context, node, mesh, primitive, babylonMesh_1);
             promises.push(this._loadVertexDataAsync(context, primitive, babylonMesh_1).then(function (babylonGeometry) {
                 return _this._loadMorphTargetsAsync(context, primitive, babylonMesh_1, babylonGeometry).then(function () {
-                    _this._babylonScene._blockEntityCollection = _this._forAssetContainer;
+                    _this._babylonScene._blockEntityCollection = !!_this._assetContainer;
                     babylonGeometry.applyToMesh(babylonMesh_1);
+                    babylonGeometry._parentContainer = _this._assetContainer;
                     _this._babylonScene._blockEntityCollection = false;
                 });
             }));
@@ -719,8 +739,8 @@ var GLTFLoader = /** @class */ (function () {
                 babylonMesh_1.material = babylonMaterial;
             }
             else {
-                var material = ArrayItem.Get(context + "/material", this._gltf.materials, primitive.material);
-                promises.push(this._loadMaterialAsync("/materials/" + material.index, material, babylonMesh_1, babylonDrawMode, function (babylonMaterial) {
+                var material = ArrayItem.Get("".concat(context, "/material"), this._gltf.materials, primitive.material);
+                promises.push(this._loadMaterialAsync("/materials/".concat(material.index), material, babylonMesh_1, babylonDrawMode, function (babylonMaterial) {
                     babylonMesh_1.material = babylonMaterial;
                 }));
             }
@@ -749,7 +769,7 @@ var GLTFLoader = /** @class */ (function () {
         }
         var attributes = primitive.attributes;
         if (!attributes) {
-            throw new Error(context + ": Attributes are missing");
+            throw new Error("".concat(context, ": Attributes are missing"));
         }
         var promises = new Array();
         var babylonGeometry = new Geometry(babylonMesh.name, this._babylonScene);
@@ -757,8 +777,8 @@ var GLTFLoader = /** @class */ (function () {
             babylonMesh.isUnIndexed = true;
         }
         else {
-            var accessor = ArrayItem.Get(context + "/indices", this._gltf.accessors, primitive.indices);
-            promises.push(this._loadIndicesAccessorAsync("/accessors/" + accessor.index, accessor).then(function (data) {
+            var accessor = ArrayItem.Get("".concat(context, "/indices"), this._gltf.accessors, primitive.indices);
+            promises.push(this._loadIndicesAccessorAsync("/accessors/".concat(accessor.index), accessor).then(function (data) {
                 babylonGeometry.setIndices(data);
             }));
         }
@@ -770,11 +790,32 @@ var GLTFLoader = /** @class */ (function () {
             if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                 babylonMesh._delayInfo.push(kind);
             }
-            var accessor = ArrayItem.Get(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
-            promises.push(_this._loadVertexAccessorAsync("/accessors/" + accessor.index, accessor, kind).then(function (babylonVertexBuffer) {
+            var accessor = ArrayItem.Get("".concat(context, "/attributes/").concat(attribute), _this._gltf.accessors, attributes[attribute]);
+            promises.push(_this._loadVertexAccessorAsync("/accessors/".concat(accessor.index), accessor, kind).then(function (babylonVertexBuffer) {
                 if (babylonVertexBuffer.getKind() === VertexBuffer.PositionKind && !_this.parent.alwaysComputeBoundingBox && !babylonMesh.skeleton) {
                     var mmin = accessor.min, mmax = accessor.max;
                     if (mmin !== undefined && mmax !== undefined) {
+                        if (accessor.normalized && accessor.componentType !== 5126 /* FLOAT */) {
+                            var divider = 1;
+                            switch (accessor.componentType) {
+                                case 5120 /* BYTE */:
+                                    divider = 127.0;
+                                    break;
+                                case 5121 /* UNSIGNED_BYTE */:
+                                    divider = 255.0;
+                                    break;
+                                case 5122 /* SHORT */:
+                                    divider = 32767.0;
+                                    break;
+                                case 5123 /* UNSIGNED_SHORT */:
+                                    divider = 65535.0;
+                                    break;
+                            }
+                            for (var i = 0; i < 3; ++i) {
+                                mmin[i] = Math.max(mmin[i] / divider, -1.0);
+                                mmax[i] = Math.max(mmax[i] / divider, -1.0);
+                            }
+                        }
                         var min = TmpVectors.Vector3[0], max = TmpVectors.Vector3[1];
                         min.copyFromFloats.apply(min, mmin);
                         max.copyFromFloats.apply(max, mmax);
@@ -796,6 +837,10 @@ var GLTFLoader = /** @class */ (function () {
         loadAttribute("TANGENT", VertexBuffer.TangentKind);
         loadAttribute("TEXCOORD_0", VertexBuffer.UVKind);
         loadAttribute("TEXCOORD_1", VertexBuffer.UV2Kind);
+        loadAttribute("TEXCOORD_2", VertexBuffer.UV3Kind);
+        loadAttribute("TEXCOORD_3", VertexBuffer.UV4Kind);
+        loadAttribute("TEXCOORD_4", VertexBuffer.UV5Kind);
+        loadAttribute("TEXCOORD_5", VertexBuffer.UV6Kind);
         loadAttribute("JOINTS_0", VertexBuffer.MatricesIndicesKind);
         loadAttribute("WEIGHTS_0", VertexBuffer.MatricesWeightsKind);
         loadAttribute("JOINTS_1", VertexBuffer.MatricesIndicesExtraKind);
@@ -817,14 +862,15 @@ var GLTFLoader = /** @class */ (function () {
             node._numMorphTargets = primitive.targets.length;
         }
         else if (primitive.targets.length !== node._numMorphTargets) {
-            throw new Error(context + ": Primitives do not have the same number of targets");
+            throw new Error("".concat(context, ": Primitives do not have the same number of targets"));
         }
         var targetNames = mesh.extras ? mesh.extras.targetNames : null;
         babylonMesh.morphTargetManager = new MorphTargetManager(babylonMesh.getScene());
+        babylonMesh.morphTargetManager.areUpdatesFrozen = true;
         for (var index = 0; index < primitive.targets.length; index++) {
             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;
-            var name_4 = targetNames ? targetNames[index] : "morphTarget" + index;
-            babylonMesh.morphTargetManager.addTarget(new MorphTarget(name_4, weight, babylonMesh.getScene()));
+            var name_3 = targetNames ? targetNames[index] : "morphTarget".concat(index);
+            babylonMesh.morphTargetManager.addTarget(new MorphTarget(name_3, weight, babylonMesh.getScene()));
             // TODO: tell the target whether it has positions, normals, tangents
         }
     };
@@ -836,9 +882,11 @@ var GLTFLoader = /** @class */ (function () {
         var morphTargetManager = babylonMesh.morphTargetManager;
         for (var index = 0; index < morphTargetManager.numTargets; index++) {
             var babylonMorphTarget = morphTargetManager.getTarget(index);
-            promises.push(this._loadMorphTargetVertexDataAsync(context + "/targets/" + index, babylonGeometry, primitive.targets[index], babylonMorphTarget));
+            promises.push(this._loadMorphTargetVertexDataAsync("".concat(context, "/targets/").concat(index), babylonGeometry, primitive.targets[index], babylonMorphTarget));
         }
-        return Promise.all(promises).then(function () { });
+        return Promise.all(promises).then(function () {
+            morphTargetManager.areUpdatesFrozen = false;
+        });
     };
     GLTFLoader.prototype._loadMorphTargetVertexDataAsync = function (context, babylonGeometry, attributes, babylonMorphTarget) {
         var _this = this;
@@ -851,8 +899,8 @@ var GLTFLoader = /** @class */ (function () {
             if (!babylonVertexBuffer) {
                 return;
             }
-            var accessor = ArrayItem.Get(context + "/" + attribute, _this._gltf.accessors, attributes[attribute]);
-            promises.push(_this._loadFloatAccessorAsync("/accessors/" + accessor.index, accessor).then(function (data) {
+            var accessor = ArrayItem.Get("".concat(context, "/").concat(attribute), _this._gltf.accessors, attributes[attribute]);
+            promises.push(_this._loadFloatAccessorAsync("/accessors/".concat(accessor.index), accessor).then(function (data) {
                 setData(babylonVertexBuffer, data);
             }));
         };
@@ -914,29 +962,22 @@ var GLTFLoader = /** @class */ (function () {
         babylonNode.rotationQuaternion = rotation;
         babylonNode.scaling = scaling;
     };
-    GLTFLoader.prototype._loadSkinAsync = function (context, node, skin) {
+    GLTFLoader.prototype._loadSkinAsync = function (context, node, skin, assign) {
         var _this = this;
         var extensionPromise = this._extensionsLoadSkinAsync(context, node, skin);
         if (extensionPromise) {
             return extensionPromise;
         }
-        var assignSkeleton = function (skeleton) {
-            _this._forEachPrimitive(node, function (babylonMesh) {
-                babylonMesh.skeleton = skeleton;
-            });
-        };
         if (skin._data) {
-            assignSkeleton(skin._data.babylonSkeleton);
+            assign(skin._data.babylonSkeleton);
             return skin._data.promise;
         }
-        var skeletonId = "skeleton" + skin.index;
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        var skeletonId = "skeleton".concat(skin.index);
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
         var babylonSkeleton = new Skeleton(skin.name || skeletonId, skeletonId, this._babylonScene);
+        babylonSkeleton._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
-        // See https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#skins (second implementation note)
-        babylonSkeleton.overrideMesh = this._rootBabylonMesh;
         this._loadBones(context, skin, babylonSkeleton);
-        assignSkeleton(babylonSkeleton);
         var promise = this._loadSkinInverseBindMatricesDataAsync(context, skin).then(function (inverseBindMatricesData) {
             _this._updateBoneMatrices(babylonSkeleton, inverseBindMatricesData);
         });
@@ -944,38 +985,102 @@ var GLTFLoader = /** @class */ (function () {
             babylonSkeleton: babylonSkeleton,
             promise: promise
         };
+        assign(babylonSkeleton);
         return promise;
     };
     GLTFLoader.prototype._loadBones = function (context, skin, babylonSkeleton) {
+        if (skin.skeleton == undefined || this._parent.alwaysComputeSkeletonRootNode) {
+            var rootNode = this._findSkeletonRootNode("".concat(context, "/joints"), skin.joints);
+            if (rootNode) {
+                if (skin.skeleton === undefined) {
+                    skin.skeleton = rootNode.index;
+                }
+                else {
+                    var isParent = function (a, b) {
+                        for (; b.parent; b = b.parent) {
+                            if (b.parent === a) {
+                                return true;
+                            }
+                        }
+                        return false;
+                    };
+                    var skeletonNode = ArrayItem.Get("".concat(context, "/skeleton"), this._gltf.nodes, skin.skeleton);
+                    if (skeletonNode !== rootNode && !isParent(skeletonNode, rootNode)) {
+                        Logger.Warn("".concat(context, "/skeleton: Overriding with nearest common ancestor as skeleton node is not a common root"));
+                        skin.skeleton = rootNode.index;
+                    }
+                }
+            }
+            else {
+                Logger.Warn("".concat(context, ": Failed to find common root"));
+            }
+        }
         var babylonBones = {};
         for (var _i = 0, _a = skin.joints; _i < _a.length; _i++) {
             var index = _a[_i];
-            var node = ArrayItem.Get(context + "/joints/" + index, this._gltf.nodes, index);
+            var node = ArrayItem.Get("".concat(context, "/joints/").concat(index), this._gltf.nodes, index);
             this._loadBone(node, skin, babylonSkeleton, babylonBones);
         }
     };
+    GLTFLoader.prototype._findSkeletonRootNode = function (context, joints) {
+        var paths = {};
+        for (var _i = 0, joints_1 = joints; _i < joints_1.length; _i++) {
+            var index = joints_1[_i];
+            var path = new Array();
+            var node = ArrayItem.Get("".concat(context, "/").concat(index), this._gltf.nodes, index);
+            while (node.index !== -1) {
+                path.unshift(node);
+                node = node.parent;
+            }
+            paths[index] = path;
+        }
+        var rootNode = null;
+        for (var i = 0;; ++i) {
+            var path = paths[joints[0]];
+            if (i >= path.length) {
+                return rootNode;
+            }
+            var node = path[i];
+            for (var j = 1; j < joints.length; ++j) {
+                path = paths[joints[j]];
+                if (i >= path.length || node !== path[i]) {
+                    return rootNode;
+                }
+            }
+            rootNode = node;
+        }
+    };
     GLTFLoader.prototype._loadBone = function (node, skin, babylonSkeleton, babylonBones) {
         var babylonBone = babylonBones[node.index];
         if (babylonBone) {
             return babylonBone;
         }
-        var babylonParentBone = null;
-        if (node.parent && node.parent._babylonTransformNode !== this._rootBabylonMesh) {
-            babylonParentBone = this._loadBone(node.parent, skin, babylonSkeleton, babylonBones);
+        var parentBabylonBone = null;
+        if (node.index !== skin.skeleton) {
+            if (node.parent && node.parent.index !== -1) {
+                parentBabylonBone = this._loadBone(node.parent, skin, babylonSkeleton, babylonBones);
+            }
+            else if (skin.skeleton !== undefined) {
+                Logger.Warn("/skins/".concat(skin.index, "/skeleton: Skeleton node is not a common root"));
+            }
         }
         var boneIndex = skin.joints.indexOf(node.index);
-        babylonBone = new Bone(node.name || "joint" + node.index, babylonSkeleton, babylonParentBone, this._getNodeMatrix(node), null, null, boneIndex);
+        babylonBone = new Bone(node.name || "joint".concat(node.index), babylonSkeleton, parentBabylonBone, this._getNodeMatrix(node), null, null, boneIndex);
         babylonBones[node.index] = babylonBone;
-        node._babylonBones = node._babylonBones || [];
-        node._babylonBones.push(babylonBone);
+        // Wait until the scene is loaded to ensure the transform nodes are loaded.
+        this._postSceneLoadActions.push(function () {
+            // Link the Babylon bone with the corresponding Babylon transform node.
+            // A glTF joint is a pointer to a glTF node in the glTF node hierarchy similar to Unity3D.
+            babylonBone.linkTransformNode(node._babylonTransformNode);
+        });
         return babylonBone;
     };
     GLTFLoader.prototype._loadSkinInverseBindMatricesDataAsync = function (context, skin) {
         if (skin.inverseBindMatrices == undefined) {
             return Promise.resolve(null);
         }
-        var accessor = ArrayItem.Get(context + "/inverseBindMatrices", this._gltf.accessors, skin.inverseBindMatrices);
-        return this._loadFloatAccessorAsync("/accessors/" + accessor.index, accessor);
+        var accessor = ArrayItem.Get("".concat(context, "/inverseBindMatrices"), this._gltf.accessors, skin.inverseBindMatrices);
+        return this._loadFloatAccessorAsync("/accessors/".concat(accessor.index), accessor);
     };
     GLTFLoader.prototype._updateBoneMatrices = function (babylonSkeleton, inverseBindMatricesData) {
         for (var _i = 0, _a = babylonSkeleton.bones; _i < _a.length; _i++) {
@@ -990,7 +1095,6 @@ var GLTFLoader = /** @class */ (function () {
             if (babylonParentBone) {
                 baseMatrix.multiplyToRef(babylonParentBone.getInvertedAbsoluteTransform(), baseMatrix);
             }
-            babylonBone.setBindPose(baseMatrix);
             babylonBone.updateMatrix(baseMatrix, false, false);
             babylonBone._updateDifferenceMatrix(undefined, false);
         }
@@ -1014,9 +1118,10 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         var promises = new Array();
-        this.logOpen(context + " " + (camera.name || ""));
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
-        var babylonCamera = new FreeCamera(camera.name || "camera" + camera.index, Vector3.Zero(), this._babylonScene, false);
+        this.logOpen("".concat(context, " ").concat(camera.name || ""));
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
+        var babylonCamera = new FreeCamera(camera.name || "camera".concat(camera.index), Vector3.Zero(), this._babylonScene, false);
+        babylonCamera._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         babylonCamera.ignoreParentScaling = true;
         babylonCamera.rotation = new Vector3(0, Math.PI, 0);
@@ -1024,7 +1129,7 @@ var GLTFLoader = /** @class */ (function () {
             case "perspective" /* PERSPECTIVE */: {
                 var perspective = camera.perspective;
                 if (!perspective) {
-                    throw new Error(context + ": Camera perspective properties are missing");
+                    throw new Error("".concat(context, ": Camera perspective properties are missing"));
                 }
                 babylonCamera.fov = perspective.yfov;
                 babylonCamera.minZ = perspective.znear;
@@ -1033,7 +1138,7 @@ var GLTFLoader = /** @class */ (function () {
             }
             case "orthographic" /* ORTHOGRAPHIC */: {
                 if (!camera.orthographic) {
-                    throw new Error(context + ": Camera orthographic properties are missing");
+                    throw new Error("".concat(context, ": Camera orthographic properties are missing"));
                 }
                 babylonCamera.mode = Camera.ORTHOGRAPHIC_CAMERA;
                 babylonCamera.orthoLeft = -camera.orthographic.xmag;
@@ -1045,7 +1150,7 @@ var GLTFLoader = /** @class */ (function () {
                 break;
             }
             default: {
-                throw new Error(context + ": Invalid camera type (" + camera.type + ")");
+                throw new Error("".concat(context, ": Invalid camera type (").concat(camera.type, ")"));
             }
         }
         GLTFLoader.AddPointerMetadata(babylonCamera, context);
@@ -1064,7 +1169,7 @@ var GLTFLoader = /** @class */ (function () {
         var promises = new Array();
         for (var index = 0; index < animations.length; index++) {
             var animation = animations[index];
-            promises.push(this.loadAnimationAsync("/animations/" + animation.index, animation).then(function (animationGroup) {
+            promises.push(this.loadAnimationAsync("/animations/".concat(animation.index), animation).then(function (animationGroup) {
                 // Delete the animation group if it ended up not having any animations in it.
                 if (animationGroup.targetedAnimations.length === 0) {
                     animationGroup.dispose();
@@ -1084,8 +1189,9 @@ var GLTFLoader = /** @class */ (function () {
         if (promise) {
             return promise;
         }
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
-        var babylonAnimationGroup = new AnimationGroup(animation.name || "animation" + animation.index, this._babylonScene);
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
+        var babylonAnimationGroup = new AnimationGroup(animation.name || "animation".concat(animation.index), this._babylonScene);
+        babylonAnimationGroup._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         animation._babylonAnimationGroup = babylonAnimationGroup;
         var promises = new Array();
@@ -1093,7 +1199,7 @@ var GLTFLoader = /** @class */ (function () {
         ArrayItem.Assign(animation.samplers);
         for (var _i = 0, _a = animation.channels; _i < _a.length; _i++) {
             var channel = _a[_i];
-            promises.push(this._loadAnimationChannelAsync(context + "/channels/" + channel.index, context, animation, channel, babylonAnimationGroup));
+            promises.push(this._loadAnimationChannelAsync("".concat(context, "/channels/").concat(channel.index), context, animation, channel, babylonAnimationGroup));
         }
         return Promise.all(promises).then(function () {
             babylonAnimationGroup.normalize(0);
@@ -1116,14 +1222,14 @@ var GLTFLoader = /** @class */ (function () {
         if (channel.target.node == undefined) {
             return Promise.resolve();
         }
-        var targetNode = ArrayItem.Get(context + "/target/node", this._gltf.nodes, channel.target.node);
+        var targetNode = ArrayItem.Get("".concat(context, "/target/node"), this._gltf.nodes, channel.target.node);
         // Ignore animations that have no animation targets.
         if ((channel.target.path === "weights" /* WEIGHTS */ && !targetNode._numMorphTargets) ||
             (channel.target.path !== "weights" /* WEIGHTS */ && !targetNode._babylonTransformNode)) {
             return Promise.resolve();
         }
-        var sampler = ArrayItem.Get(context + "/sampler", animation.samplers, channel.sampler);
-        return this._loadAnimationSamplerAsync(animationContext + "/samplers/" + channel.sampler, sampler).then(function (data) {
+        var sampler = ArrayItem.Get("".concat(context, "/sampler"), animation.samplers, channel.sampler);
+        return this._loadAnimationSamplerAsync("".concat(animationContext, "/samplers/").concat(channel.sampler), sampler).then(function (data) {
             var targetPath;
             var animationType;
             switch (channel.target.path) {
@@ -1148,41 +1254,41 @@ var GLTFLoader = /** @class */ (function () {
                     break;
                 }
                 default: {
-                    throw new Error(context + "/target/path: Invalid value (" + channel.target.path + ")");
+                    throw new Error("".concat(context, "/target/path: Invalid value (").concat(channel.target.path, ")"));
                 }
             }
             var outputBufferOffset = 0;
             var getNextOutputValue;
             switch (targetPath) {
                 case "position": {
-                    getNextOutputValue = function () {
-                        var value = Vector3.FromArray(data.output, outputBufferOffset);
+                    getNextOutputValue = function (scale) {
+                        var value = Vector3.FromArray(data.output, outputBufferOffset).scaleInPlace(scale);
                         outputBufferOffset += 3;
                         return value;
                     };
                     break;
                 }
                 case "rotationQuaternion": {
-                    getNextOutputValue = function () {
-                        var value = Quaternion.FromArray(data.output, outputBufferOffset);
+                    getNextOutputValue = function (scale) {
+                        var value = Quaternion.FromArray(data.output, outputBufferOffset).scaleInPlace(scale);
                         outputBufferOffset += 4;
                         return value;
                     };
                     break;
                 }
                 case "scaling": {
-                    getNextOutputValue = function () {
-                        var value = Vector3.FromArray(data.output, outputBufferOffset);
+                    getNextOutputValue = function (scale) {
+                        var value = Vector3.FromArray(data.output, outputBufferOffset).scaleInPlace(scale);
                         outputBufferOffset += 3;
                         return value;
                     };
                     break;
                 }
                 case "influence": {
-                    getNextOutputValue = function () {
+                    getNextOutputValue = function (scale) {
                         var value = new Array(targetNode._numMorphTargets);
                         for (var i = 0; i < targetNode._numMorphTargets; i++) {
-                            value[i] = data.output[outputBufferOffset++];
+                            value[i] = data.output[outputBufferOffset++] * scale;
                         }
                         return value;
                     };
@@ -1193,25 +1299,26 @@ var GLTFLoader = /** @class */ (function () {
             switch (data.interpolation) {
                 case "STEP" /* STEP */: {
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
-                        value: getNextOutputValue(),
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
+                        value: getNextOutputValue(1),
                         interpolation: AnimationKeyInterpolation.STEP
                     }); };
                     break;
                 }
                 case "LINEAR" /* LINEAR */: {
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
-                        value: getNextOutputValue()
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
+                        value: getNextOutputValue(1)
                     }); };
                     break;
                 }
                 case "CUBICSPLINE" /* CUBICSPLINE */: {
+                    var invTargetFps_1 = 1 / _this.parent.targetFps;
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
-                        inTangent: getNextOutputValue(),
-                        value: getNextOutputValue(),
-                        outTangent: getNextOutputValue()
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
+                        inTangent: getNextOutputValue(invTargetFps_1),
+                        value: getNextOutputValue(1),
+                        outTangent: getNextOutputValue(invTargetFps_1)
                     }); };
                     break;
                 }
@@ -1222,8 +1329,8 @@ var GLTFLoader = /** @class */ (function () {
             }
             if (targetPath === "influence") {
                 var _loop_2 = function (targetIndex) {
-                    var animationName = babylonAnimationGroup.name + "_channel" + babylonAnimationGroup.targetedAnimations.length;
-                    var babylonAnimation = new Animation(animationName, targetPath, 1, animationType);
+                    var animationName = "".concat(babylonAnimationGroup.name, "_channel").concat(babylonAnimationGroup.targetedAnimations.length);
+                    var babylonAnimation = new Animation(animationName, targetPath, _this.parent.targetFps, animationType);
                     babylonAnimation.setKeys(keys.map(function (key) { return ({
                         frame: key.frame,
                         inTangent: key.inTangent ? key.inTangent[targetIndex] : undefined,
@@ -1243,8 +1350,8 @@ var GLTFLoader = /** @class */ (function () {
                 }
             }
             else {
-                var animationName = babylonAnimationGroup.name + "_channel" + babylonAnimationGroup.targetedAnimations.length;
-                var babylonAnimation = new Animation(animationName, targetPath, 1, animationType);
+                var animationName = "".concat(babylonAnimationGroup.name, "_channel").concat(babylonAnimationGroup.targetedAnimations.length);
+                var babylonAnimation = new Animation(animationName, targetPath, _this.parent.targetFps, animationType);
                 babylonAnimation.setKeys(keys);
                 if (animationTargetOverride != null && animationTargetOverride.animations != null) {
                     animationTargetOverride.animations.push(babylonAnimation);
@@ -1269,14 +1376,14 @@ var GLTFLoader = /** @class */ (function () {
                 break;
             }
             default: {
-                throw new Error(context + "/interpolation: Invalid value (" + sampler.interpolation + ")");
+                throw new Error("".concat(context, "/interpolation: Invalid value (").concat(sampler.interpolation, ")"));
             }
         }
-        var inputAccessor = ArrayItem.Get(context + "/input", this._gltf.accessors, sampler.input);
-        var outputAccessor = ArrayItem.Get(context + "/output", this._gltf.accessors, sampler.output);
+        var inputAccessor = ArrayItem.Get("".concat(context, "/input"), this._gltf.accessors, sampler.input);
+        var outputAccessor = ArrayItem.Get("".concat(context, "/output"), this._gltf.accessors, sampler.output);
         sampler._data = Promise.all([
-            this._loadFloatAccessorAsync("/accessors/" + inputAccessor.index, inputAccessor),
-            this._loadFloatAccessorAsync("/accessors/" + outputAccessor.index, outputAccessor)
+            this._loadFloatAccessorAsync("/accessors/".concat(inputAccessor.index), inputAccessor),
+            this._loadFloatAccessorAsync("/accessors/".concat(outputAccessor.index), outputAccessor)
         ]).then(function (_a) {
             var inputData = _a[0], outputData = _a[1];
             return {
@@ -1302,11 +1409,11 @@ var GLTFLoader = /** @class */ (function () {
         }
         if (!buffer._data) {
             if (buffer.uri) {
-                buffer._data = this.loadUriAsync(context + "/uri", buffer, buffer.uri);
+                buffer._data = this.loadUriAsync("".concat(context, "/uri"), buffer, buffer.uri);
             }
             else {
                 if (!this._bin) {
-                    throw new Error(context + ": Uri is missing or the binary glTF is missing its binary chunk");
+                    throw new Error("".concat(context, ": Uri is missing or the binary glTF is missing its binary chunk"));
                 }
                 buffer._data = this._bin.readAsync(0, buffer.byteLength);
             }
@@ -1316,7 +1423,7 @@ var GLTFLoader = /** @class */ (function () {
                 return new Uint8Array(data.buffer, data.byteOffset + byteOffset, byteLength);
             }
             catch (e) {
-                throw new Error(context + ": " + e.message);
+                throw new Error("".concat(context, ": ").concat(e.message));
             }
         });
     };
@@ -1334,8 +1441,8 @@ var GLTFLoader = /** @class */ (function () {
         if (bufferView._data) {
             return bufferView._data;
         }
-        var buffer = ArrayItem.Get(context + "/buffer", this._gltf.buffers, bufferView.buffer);
-        bufferView._data = this.loadBufferAsync("/buffers/" + buffer.index, buffer, (bufferView.byteOffset || 0), bufferView.byteLength);
+        var buffer = ArrayItem.Get("".concat(context, "/buffer"), this._gltf.buffers, bufferView.buffer);
+        bufferView._data = this.loadBufferAsync("/buffers/".concat(buffer.index), buffer, (bufferView.byteOffset || 0), bufferView.byteLength);
         return bufferView._data;
     };
     GLTFLoader.prototype._loadAccessorAsync = function (context, accessor, constructor) {
@@ -1350,8 +1457,8 @@ var GLTFLoader = /** @class */ (function () {
             accessor._data = Promise.resolve(new constructor(length));
         }
         else {
-            var bufferView_1 = ArrayItem.Get(context + "/bufferView", this._gltf.bufferViews, accessor.bufferView);
-            accessor._data = this.loadBufferViewAsync("/bufferViews/" + bufferView_1.index, bufferView_1).then(function (data) {
+            var bufferView_1 = ArrayItem.Get("".concat(context, "/bufferView"), this._gltf.bufferViews, accessor.bufferView);
+            accessor._data = this.loadBufferViewAsync("/bufferViews/".concat(bufferView_1.index), bufferView_1).then(function (data) {
                 if (accessor.componentType === 5126 /* FLOAT */ && !accessor.normalized && (!bufferView_1.byteStride || bufferView_1.byteStride === byteStride)) {
                     return GLTFLoader._GetTypedArray(context, accessor.componentType, data, accessor.byteOffset, length);
                 }
@@ -1368,21 +1475,21 @@ var GLTFLoader = /** @class */ (function () {
             var sparse_1 = accessor.sparse;
             accessor._data = accessor._data.then(function (data) {
                 var typedArray = data;
-                var indicesBufferView = ArrayItem.Get(context + "/sparse/indices/bufferView", _this._gltf.bufferViews, sparse_1.indices.bufferView);
-                var valuesBufferView = ArrayItem.Get(context + "/sparse/values/bufferView", _this._gltf.bufferViews, sparse_1.values.bufferView);
+                var indicesBufferView = ArrayItem.Get("".concat(context, "/sparse/indices/bufferView"), _this._gltf.bufferViews, sparse_1.indices.bufferView);
+                var valuesBufferView = ArrayItem.Get("".concat(context, "/sparse/values/bufferView"), _this._gltf.bufferViews, sparse_1.values.bufferView);
                 return Promise.all([
-                    _this.loadBufferViewAsync("/bufferViews/" + indicesBufferView.index, indicesBufferView),
-                    _this.loadBufferViewAsync("/bufferViews/" + valuesBufferView.index, valuesBufferView)
+                    _this.loadBufferViewAsync("/bufferViews/".concat(indicesBufferView.index), indicesBufferView),
+                    _this.loadBufferViewAsync("/bufferViews/".concat(valuesBufferView.index), valuesBufferView)
                 ]).then(function (_a) {
                     var indicesData = _a[0], valuesData = _a[1];
-                    var indices = GLTFLoader._GetTypedArray(context + "/sparse/indices", sparse_1.indices.componentType, indicesData, sparse_1.indices.byteOffset, sparse_1.count);
+                    var indices = GLTFLoader._GetTypedArray("".concat(context, "/sparse/indices"), sparse_1.indices.componentType, indicesData, sparse_1.indices.byteOffset, sparse_1.count);
                     var sparseLength = numComponents * sparse_1.count;
                     var values;
                     if (accessor.componentType === 5126 /* FLOAT */ && !accessor.normalized) {
-                        values = GLTFLoader._GetTypedArray(context + "/sparse/values", accessor.componentType, valuesData, sparse_1.values.byteOffset, sparseLength);
+                        values = GLTFLoader._GetTypedArray("".concat(context, "/sparse/values"), accessor.componentType, valuesData, sparse_1.values.byteOffset, sparseLength);
                     }
                     else {
-                        var sparseData = GLTFLoader._GetTypedArray(context + "/sparse/values", accessor.componentType, valuesData, sparse_1.values.byteOffset, sparseLength);
+                        var sparseData = GLTFLoader._GetTypedArray("".concat(context, "/sparse/values"), accessor.componentType, valuesData, sparse_1.values.byteOffset, sparseLength);
                         values = new constructor(sparseLength);
                         VertexBuffer.ForEach(sparseData, 0, byteStride, numComponents, accessor.componentType, values.length, accessor.normalized || false, function (value, index) {
                             values[index] = value;
@@ -1407,23 +1514,23 @@ var GLTFLoader = /** @class */ (function () {
     };
     GLTFLoader.prototype._loadIndicesAccessorAsync = function (context, accessor) {
         if (accessor.type !== "SCALAR" /* SCALAR */) {
-            throw new Error(context + "/type: Invalid value " + accessor.type);
+            throw new Error("".concat(context, "/type: Invalid value ").concat(accessor.type));
         }
         if (accessor.componentType !== 5121 /* UNSIGNED_BYTE */ &&
             accessor.componentType !== 5123 /* UNSIGNED_SHORT */ &&
             accessor.componentType !== 5125 /* UNSIGNED_INT */) {
-            throw new Error(context + "/componentType: Invalid value " + accessor.componentType);
+            throw new Error("".concat(context, "/componentType: Invalid value ").concat(accessor.componentType));
         }
         if (accessor._data) {
             return accessor._data;
         }
         if (accessor.sparse) {
-            var constructor = GLTFLoader._GetTypedArrayConstructor(context + "/componentType", accessor.componentType);
+            var constructor = GLTFLoader._GetTypedArrayConstructor("".concat(context, "/componentType"), accessor.componentType);
             accessor._data = this._loadAccessorAsync(context, accessor, constructor);
         }
         else {
-            var bufferView = ArrayItem.Get(context + "/bufferView", this._gltf.bufferViews, accessor.bufferView);
-            accessor._data = this.loadBufferViewAsync("/bufferViews/" + bufferView.index, bufferView).then(function (data) {
+            var bufferView = ArrayItem.Get("".concat(context, "/bufferView"), this._gltf.bufferViews, accessor.bufferView);
+            accessor._data = this.loadBufferViewAsync("/bufferViews/".concat(bufferView.index), bufferView).then(function (data) {
                 return GLTFLoader._GetTypedArray(context, accessor.componentType, data, accessor.byteOffset, accessor.count);
             });
         }
@@ -1434,47 +1541,44 @@ var GLTFLoader = /** @class */ (function () {
         if (bufferView._babylonBuffer) {
             return bufferView._babylonBuffer;
         }
-        bufferView._babylonBuffer = this.loadBufferViewAsync("/bufferViews/" + bufferView.index, bufferView).then(function (data) {
+        bufferView._babylonBuffer = this.loadBufferViewAsync("/bufferViews/".concat(bufferView.index), bufferView).then(function (data) {
             return new Buffer(_this._babylonScene.getEngine(), data, false);
         });
         return bufferView._babylonBuffer;
     };
     GLTFLoader.prototype._loadVertexAccessorAsync = function (context, accessor, kind) {
         var _this = this;
-        if (accessor._babylonVertexBuffer) {
-            return accessor._babylonVertexBuffer;
+        var _a;
+        if ((_a = accessor._babylonVertexBuffer) === null || _a === void 0 ? void 0 : _a[kind]) {
+            return accessor._babylonVertexBuffer[kind];
         }
-        if (accessor.sparse) {
-            accessor._babylonVertexBuffer = this._loadFloatAccessorAsync("/accessors/" + accessor.index, accessor).then(function (data) {
-                return new VertexBuffer(_this._babylonScene.getEngine(), data, kind, false);
-            });
+        if (!accessor._babylonVertexBuffer) {
+            accessor._babylonVertexBuffer = {};
         }
-        // HACK: If byte offset is not a multiple of component type byte length then load as a float array instead of using Babylon buffers.
-        else if (accessor.byteOffset && accessor.byteOffset % VertexBuffer.GetTypeByteLength(accessor.componentType) !== 0) {
-            Logger.Warn("Accessor byte offset is not a multiple of component type byte length");
-            accessor._babylonVertexBuffer = this._loadFloatAccessorAsync("/accessors/" + accessor.index, accessor).then(function (data) {
+        if (accessor.sparse) {
+            accessor._babylonVertexBuffer[kind] = this._loadFloatAccessorAsync(context, accessor).then(function (data) {
                 return new VertexBuffer(_this._babylonScene.getEngine(), data, kind, false);
             });
         }
         // Load joint indices as a float array since the shaders expect float data but glTF uses unsigned byte/short.
         // This prevents certain platforms (e.g. D3D) from having to convert the data to float on the fly.
         else if (kind === VertexBuffer.MatricesIndicesKind || kind === VertexBuffer.MatricesIndicesExtraKind) {
-            accessor._babylonVertexBuffer = this._loadFloatAccessorAsync("/accessors/" + accessor.index, accessor).then(function (data) {
+            accessor._babylonVertexBuffer[kind] = this._loadFloatAccessorAsync(context, accessor).then(function (data) {
                 return new VertexBuffer(_this._babylonScene.getEngine(), data, kind, false);
             });
         }
         else {
-            var bufferView_2 = ArrayItem.Get(context + "/bufferView", this._gltf.bufferViews, accessor.bufferView);
-            accessor._babylonVertexBuffer = this._loadVertexBufferViewAsync(bufferView_2, kind).then(function (babylonBuffer) {
+            var bufferView_2 = ArrayItem.Get("".concat(context, "/bufferView"), this._gltf.bufferViews, accessor.bufferView);
+            accessor._babylonVertexBuffer[kind] = this._loadVertexBufferViewAsync(bufferView_2, kind).then(function (babylonBuffer) {
                 var size = GLTFLoader._GetNumComponents(context, accessor.type);
                 return new VertexBuffer(_this._babylonScene.getEngine(), babylonBuffer, kind, false, false, bufferView_2.byteStride, false, accessor.byteOffset, size, accessor.componentType, accessor.normalized, true, 1, true);
             });
         }
-        return accessor._babylonVertexBuffer;
+        return accessor._babylonVertexBuffer[kind];
     };
     GLTFLoader.prototype._loadMaterialMetallicRoughnessPropertiesAsync = function (context, properties, babylonMaterial) {
         if (!(babylonMaterial instanceof PBRMaterial)) {
-            throw new Error(context + ": Material type not supported");
+            throw new Error("".concat(context, ": Material type not supported"));
         }
         var promises = new Array();
         if (properties) {
@@ -1488,15 +1592,15 @@ var GLTFLoader = /** @class */ (function () {
             babylonMaterial.metallic = properties.metallicFactor == undefined ? 1 : properties.metallicFactor;
             babylonMaterial.roughness = properties.roughnessFactor == undefined ? 1 : properties.roughnessFactor;
             if (properties.baseColorTexture) {
-                promises.push(this.loadTextureInfoAsync(context + "/baseColorTexture", properties.baseColorTexture, function (texture) {
-                    texture.name = babylonMaterial.name + " (Base Color)";
+                promises.push(this.loadTextureInfoAsync("".concat(context, "/baseColorTexture"), properties.baseColorTexture, function (texture) {
+                    texture.name = "".concat(babylonMaterial.name, " (Base Color)");
                     babylonMaterial.albedoTexture = texture;
                 }));
             }
             if (properties.metallicRoughnessTexture) {
                 properties.metallicRoughnessTexture.nonColorData = true;
-                promises.push(this.loadTextureInfoAsync(context + "/metallicRoughnessTexture", properties.metallicRoughnessTexture, function (texture) {
-                    texture.name = babylonMaterial.name + " (Metallic Roughness)";
+                promises.push(this.loadTextureInfoAsync("".concat(context, "/metallicRoughnessTexture"), properties.metallicRoughnessTexture, function (texture) {
+                    texture.name = "".concat(babylonMaterial.name, " (Metallic Roughness)");
                     babylonMaterial.metallicTexture = texture;
                 }));
                 babylonMaterial.useMetallnessFromMetallicTextureBlue = true;
@@ -1516,7 +1620,7 @@ var GLTFLoader = /** @class */ (function () {
         material._data = material._data || {};
         var babylonData = material._data[babylonDrawMode];
         if (!babylonData) {
-            this.logOpen(context + " " + (material.name || ""));
+            this.logOpen("".concat(context, " ").concat(material.name || ""));
             var babylonMaterial = this.createMaterial(context, material, babylonDrawMode);
             babylonData = {
                 babylonMaterial: babylonMaterial,
@@ -1543,8 +1647,9 @@ var GLTFLoader = /** @class */ (function () {
         });
     };
     GLTFLoader.prototype._createDefaultMaterial = function (name, babylonDrawMode) {
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
         var babylonMaterial = new PBRMaterial(name, this._babylonScene);
+        babylonMaterial._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         // Moved to mesh so user can change materials on gltf meshes: babylonMaterial.sideOrientation = this._babylonScene.useRightHandedSystem ? Material.CounterClockWiseSideOrientation : Material.ClockWiseSideOrientation;
         babylonMaterial.fillMode = babylonDrawMode;
@@ -1568,7 +1673,7 @@ var GLTFLoader = /** @class */ (function () {
         if (extensionPromise) {
             return extensionPromise;
         }
-        var name = material.name || "material" + material.index;
+        var name = material.name || "material".concat(material.index);
         var babylonMaterial = this._createDefaultMaterial(name, babylonDrawMode);
         return babylonMaterial;
     };
@@ -1587,7 +1692,7 @@ var GLTFLoader = /** @class */ (function () {
         var promises = new Array();
         promises.push(this.loadMaterialBasePropertiesAsync(context, material, babylonMaterial));
         if (material.pbrMetallicRoughness) {
-            promises.push(this._loadMaterialMetallicRoughnessPropertiesAsync(context + "/pbrMetallicRoughness", material.pbrMetallicRoughness, babylonMaterial));
+            promises.push(this._loadMaterialMetallicRoughnessPropertiesAsync("".concat(context, "/pbrMetallicRoughness"), material.pbrMetallicRoughness, babylonMaterial));
         }
         this.loadMaterialAlphaProperties(context, material, babylonMaterial);
         return Promise.all(promises).then(function () { });
@@ -1601,7 +1706,7 @@ var GLTFLoader = /** @class */ (function () {
      */
     GLTFLoader.prototype.loadMaterialBasePropertiesAsync = function (context, material, babylonMaterial) {
         if (!(babylonMaterial instanceof PBRMaterial)) {
-            throw new Error(context + ": Material type not supported");
+            throw new Error("".concat(context, ": Material type not supported"));
         }
         var promises = new Array();
         babylonMaterial.emissiveColor = material.emissiveFactor ? Color3.FromArray(material.emissiveFactor) : new Color3(0, 0, 0);
@@ -1611,8 +1716,8 @@ var GLTFLoader = /** @class */ (function () {
         }
         if (material.normalTexture) {
             material.normalTexture.nonColorData = true;
-            promises.push(this.loadTextureInfoAsync(context + "/normalTexture", material.normalTexture, function (texture) {
-                texture.name = babylonMaterial.name + " (Normal)";
+            promises.push(this.loadTextureInfoAsync("".concat(context, "/normalTexture"), material.normalTexture, function (texture) {
+                texture.name = "".concat(babylonMaterial.name, " (Normal)");
                 babylonMaterial.bumpTexture = texture;
             }));
             babylonMaterial.invertNormalMapX = !this._babylonScene.useRightHandedSystem;
@@ -1624,8 +1729,8 @@ var GLTFLoader = /** @class */ (function () {
         }
         if (material.occlusionTexture) {
             material.occlusionTexture.nonColorData = true;
-            promises.push(this.loadTextureInfoAsync(context + "/occlusionTexture", material.occlusionTexture, function (texture) {
-                texture.name = babylonMaterial.name + " (Occlusion)";
+            promises.push(this.loadTextureInfoAsync("".concat(context, "/occlusionTexture"), material.occlusionTexture, function (texture) {
+                texture.name = "".concat(babylonMaterial.name, " (Occlusion)");
                 babylonMaterial.ambientTexture = texture;
             }));
             babylonMaterial.useAmbientInGrayScale = true;
@@ -1634,8 +1739,8 @@ var GLTFLoader = /** @class */ (function () {
             }
         }
         if (material.emissiveTexture) {
-            promises.push(this.loadTextureInfoAsync(context + "/emissiveTexture", material.emissiveTexture, function (texture) {
-                texture.name = babylonMaterial.name + " (Emissive)";
+            promises.push(this.loadTextureInfoAsync("".concat(context, "/emissiveTexture"), material.emissiveTexture, function (texture) {
+                texture.name = "".concat(babylonMaterial.name, " (Emissive)");
                 babylonMaterial.emissiveTexture = texture;
             }));
         }
@@ -1650,7 +1755,7 @@ var GLTFLoader = /** @class */ (function () {
      */
     GLTFLoader.prototype.loadMaterialAlphaProperties = function (context, material, babylonMaterial) {
         if (!(babylonMaterial instanceof PBRMaterial)) {
-            throw new Error(context + ": Material type not supported");
+            throw new Error("".concat(context, ": Material type not supported"));
         }
         var alphaMode = material.alphaMode || "OPAQUE" /* OPAQUE */;
         switch (alphaMode) {
@@ -1675,7 +1780,7 @@ var GLTFLoader = /** @class */ (function () {
                 break;
             }
             default: {
-                throw new Error(context + "/alphaMode: Invalid value (" + material.alphaMode + ")");
+                throw new Error("".concat(context, "/alphaMode: Invalid value (").concat(material.alphaMode, ")"));
             }
         }
     };
@@ -1693,13 +1798,13 @@ var GLTFLoader = /** @class */ (function () {
         if (extensionPromise) {
             return extensionPromise;
         }
-        this.logOpen("" + context);
-        if (textureInfo.texCoord >= 2) {
-            throw new Error(context + "/texCoord: Invalid value (" + textureInfo.texCoord + ")");
+        this.logOpen("".concat(context));
+        if (textureInfo.texCoord >= 6) {
+            throw new Error("".concat(context, "/texCoord: Invalid value (").concat(textureInfo.texCoord, ")"));
         }
-        var texture = ArrayItem.Get(context + "/index", this._gltf.textures, textureInfo.index);
+        var texture = ArrayItem.Get("".concat(context, "/index"), this._gltf.textures, textureInfo.index);
         texture._textureInfo = textureInfo;
-        var promise = this._loadTextureAsync("/textures/" + textureInfo.index, texture, function (babylonTexture) {
+        var promise = this._loadTextureAsync("/textures/".concat(textureInfo.index), texture, function (babylonTexture) {
             babylonTexture.coordinatesIndex = textureInfo.texCoord || 0;
             GLTFLoader.AddPointerMetadata(babylonTexture, context);
             _this._parent.onTextureLoadedObservable.notifyObservers(babylonTexture);
@@ -1715,35 +1820,46 @@ var GLTFLoader = /** @class */ (function () {
         if (extensionPromise) {
             return extensionPromise;
         }
-        this.logOpen(context + " " + (texture.name || ""));
-        var sampler = (texture.sampler == undefined ? GLTFLoader.DefaultSampler : ArrayItem.Get(context + "/sampler", this._gltf.samplers, texture.sampler));
-        var image = ArrayItem.Get(context + "/source", this._gltf.images, texture.source);
-        var promise = this._createTextureAsync(context, sampler, image, assign);
+        this.logOpen("".concat(context, " ").concat(texture.name || ""));
+        var sampler = (texture.sampler == undefined ? GLTFLoader.DefaultSampler : ArrayItem.Get("".concat(context, "/sampler"), this._gltf.samplers, texture.sampler));
+        var image = ArrayItem.Get("".concat(context, "/source"), this._gltf.images, texture.source);
+        var promise = this._createTextureAsync(context, sampler, image, assign, undefined, !texture._textureInfo.nonColorData);
         this.logClose();
         return promise;
     };
     /** @hidden */
-    GLTFLoader.prototype._createTextureAsync = function (context, sampler, image, assign, textureLoaderOptions) {
+    GLTFLoader.prototype._createTextureAsync = function (context, sampler, image, assign, textureLoaderOptions, useSRGBBuffer) {
         var _this = this;
         if (assign === void 0) { assign = function () { }; }
-        var samplerData = this._loadSampler("/samplers/" + sampler.index, sampler);
+        var samplerData = this._loadSampler("/samplers/".concat(sampler.index), sampler);
         var promises = new Array();
         var deferred = new Deferred();
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
-        var babylonTexture = new Texture(null, this._babylonScene, samplerData.noMipMaps, false, samplerData.samplingMode, function () {
-            if (!_this._disposed) {
-                deferred.resolve();
-            }
-        }, function (message, exception) {
-            if (!_this._disposed) {
-                deferred.reject(new Error(context + ": " + ((exception && exception.message) ? exception.message : message || "Failed to load texture")));
-            }
-        }, undefined, undefined, undefined, image.mimeType, textureLoaderOptions);
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
+        var textureCreationOptions = {
+            noMipmap: samplerData.noMipMaps,
+            invertY: false,
+            samplingMode: samplerData.samplingMode,
+            onLoad: function () {
+                if (!_this._disposed) {
+                    deferred.resolve();
+                }
+            },
+            onError: function (message, exception) {
+                if (!_this._disposed) {
+                    deferred.reject(new Error("".concat(context, ": ").concat((exception && exception.message) ? exception.message : message || "Failed to load texture")));
+                }
+            },
+            mimeType: image.mimeType,
+            loaderOptions: textureLoaderOptions,
+            useSRGBBuffer: !!useSRGBBuffer && this._parent.useSRGBBuffers,
+        };
+        var babylonTexture = new Texture(null, this._babylonScene, textureCreationOptions);
+        babylonTexture._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         promises.push(deferred.promise);
-        promises.push(this.loadImageAsync("/images/" + image.index, image).then(function (data) {
-            var name = image.uri || _this._fileName + "#image" + image.index;
-            var dataUrl = "data:" + _this._uniqueRootUrl + name;
+        promises.push(this.loadImageAsync("/images/".concat(image.index), image).then(function (data) {
+            var name = image.uri || "".concat(_this._fileName, "#image").concat(image.index);
+            var dataUrl = "data:".concat(_this._uniqueRootUrl).concat(name);
             babylonTexture.updateURL(dataUrl, data);
         }));
         babylonTexture.wrapU = samplerData.wrapU;
@@ -1758,8 +1874,8 @@ var GLTFLoader = /** @class */ (function () {
             sampler._data = {
                 noMipMaps: (sampler.minFilter === 9728 /* NEAREST */ || sampler.minFilter === 9729 /* LINEAR */),
                 samplingMode: GLTFLoader._GetTextureSamplingMode(context, sampler),
-                wrapU: GLTFLoader._GetTextureWrapMode(context + "/wrapS", sampler.wrapS),
-                wrapV: GLTFLoader._GetTextureWrapMode(context + "/wrapT", sampler.wrapT)
+                wrapU: GLTFLoader._GetTextureWrapMode("".concat(context, "/wrapS"), sampler.wrapS),
+                wrapV: GLTFLoader._GetTextureWrapMode("".concat(context, "/wrapT"), sampler.wrapT)
             };
         }
         return sampler._data;
@@ -1772,13 +1888,13 @@ var GLTFLoader = /** @class */ (function () {
      */
     GLTFLoader.prototype.loadImageAsync = function (context, image) {
         if (!image._data) {
-            this.logOpen(context + " " + (image.name || ""));
+            this.logOpen("".concat(context, " ").concat(image.name || ""));
             if (image.uri) {
-                image._data = this.loadUriAsync(context + "/uri", image, image.uri);
+                image._data = this.loadUriAsync("".concat(context, "/uri"), image, image.uri);
             }
             else {
-                var bufferView = ArrayItem.Get(context + "/bufferView", this._gltf.bufferViews, image.bufferView);
-                image._data = this.loadBufferViewAsync("/bufferViews/" + bufferView.index, bufferView);
+                var bufferView = ArrayItem.Get("".concat(context, "/bufferView"), this._gltf.bufferViews, image.bufferView);
+                image._data = this.loadBufferViewAsync("/bufferViews/".concat(bufferView.index), bufferView);
             }
             this.logClose();
         }
@@ -1798,23 +1914,23 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         if (!GLTFLoader._ValidateUri(uri)) {
-            throw new Error(context + ": '" + uri + "' is invalid");
+            throw new Error("".concat(context, ": '").concat(uri, "' is invalid"));
         }
-        if (Tools.IsBase64(uri)) {
-            var data = new Uint8Array(Tools.DecodeBase64(uri));
-            this.log(context + ": Decoded " + uri.substr(0, 64) + "... (" + data.length + " bytes)");
+        if (IsBase64DataUrl(uri)) {
+            var data = new Uint8Array(DecodeBase64UrlToBinary(uri));
+            this.log("".concat(context, ": Decoded ").concat(uri.substr(0, 64), "... (").concat(data.length, " bytes)"));
             return Promise.resolve(data);
         }
-        this.log(context + ": Loading " + uri);
+        this.log("".concat(context, ": Loading ").concat(uri));
         return this._parent.preprocessUrlAsync(this._rootUrl + uri).then(function (url) {
             return new Promise(function (resolve, reject) {
-                _this._parent._loadFile(url, _this._babylonScene, function (data) {
+                _this._parent._loadFile(_this._babylonScene, url, function (data) {
                     if (!_this._disposed) {
-                        _this.log(context + ": Loaded " + uri + " (" + data.byteLength + " bytes)");
+                        _this.log("".concat(context, ": Loaded ").concat(uri, " (").concat(data.byteLength, " bytes)"));
                         resolve(new Uint8Array(data));
                     }
                 }, true, function (request) {
-                    reject(new LoadFileError(context + ": Failed to load '" + uri + "'" + (request ? ": " + request.status + " " + request.statusText : ""), request));
+                    reject(new LoadFileError("".concat(context, ": Failed to load '").concat(uri, "'").concat(request ? ": " + request.status + " " + request.statusText : ""), request));
                 });
             });
         });
@@ -1838,7 +1954,7 @@ var GLTFLoader = /** @class */ (function () {
             case 33648 /* MIRRORED_REPEAT */: return Texture.MIRROR_ADDRESSMODE;
             case 10497 /* REPEAT */: return Texture.WRAP_ADDRESSMODE;
             default:
-                Logger.Warn(context + ": Invalid value (" + mode + ")");
+                Logger.Warn("".concat(context, ": Invalid value (").concat(mode, ")"));
                 return Texture.WRAP_ADDRESSMODE;
         }
     };
@@ -1855,13 +1971,13 @@ var GLTFLoader = /** @class */ (function () {
                 case 9986 /* NEAREST_MIPMAP_LINEAR */: return Texture.LINEAR_NEAREST_MIPLINEAR;
                 case 9987 /* LINEAR_MIPMAP_LINEAR */: return Texture.LINEAR_LINEAR_MIPLINEAR;
                 default:
-                    Logger.Warn(context + "/minFilter: Invalid value (" + minFilter + ")");
+                    Logger.Warn("".concat(context, "/minFilter: Invalid value (").concat(minFilter, ")"));
                     return Texture.LINEAR_LINEAR_MIPLINEAR;
             }
         }
         else {
             if (magFilter !== 9728 /* NEAREST */) {
-                Logger.Warn(context + "/magFilter: Invalid value (" + magFilter + ")");
+                Logger.Warn("".concat(context, "/magFilter: Invalid value (").concat(magFilter, ")"));
             }
             switch (minFilter) {
                 case 9728 /* NEAREST */: return Texture.NEAREST_NEAREST;
@@ -1871,7 +1987,7 @@ var GLTFLoader = /** @class */ (function () {
                 case 9986 /* NEAREST_MIPMAP_LINEAR */: return Texture.NEAREST_NEAREST_MIPLINEAR;
                 case 9987 /* LINEAR_MIPMAP_LINEAR */: return Texture.NEAREST_LINEAR_MIPLINEAR;
                 default:
-                    Logger.Warn(context + "/minFilter: Invalid value (" + minFilter + ")");
+                    Logger.Warn("".concat(context, "/minFilter: Invalid value (").concat(minFilter, ")"));
                     return Texture.NEAREST_NEAREST_MIPNEAREST;
             }
         }
@@ -1884,19 +2000,20 @@ var GLTFLoader = /** @class */ (function () {
             case 5123 /* UNSIGNED_SHORT */: return Uint16Array;
             case 5125 /* UNSIGNED_INT */: return Uint32Array;
             case 5126 /* FLOAT */: return Float32Array;
-            default: throw new Error(context + ": Invalid component type " + componentType);
+            default: throw new Error("".concat(context, ": Invalid component type ").concat(componentType));
         }
     };
     GLTFLoader._GetTypedArray = function (context, componentType, bufferView, byteOffset, length) {
         var buffer = bufferView.buffer;
         byteOffset = bufferView.byteOffset + (byteOffset || 0);
-        var constructor = GLTFLoader._GetTypedArrayConstructor(context + "/componentType", componentType);
-        try {
-            return new constructor(buffer, byteOffset, length);
-        }
-        catch (e) {
-            throw new Error(context + ": " + e);
+        var constructor = GLTFLoader._GetTypedArrayConstructor("".concat(context, "/componentType"), componentType);
+        var componentTypeLength = VertexBuffer.GetTypeByteLength(componentType);
+        if (byteOffset % componentTypeLength !== 0) {
+            // HACK: Copy the buffer if byte offset is not a multiple of component type byte length.
+            Logger.Warn("".concat(context, ": Copying buffer as byte offset (").concat(byteOffset, ") is not a multiple of component type byte length (").concat(componentTypeLength, ")"));
+            return new constructor(buffer.slice(byteOffset, byteOffset + length * componentTypeLength), 0);
         }
+        return new constructor(buffer, byteOffset, length);
     };
     GLTFLoader._GetNumComponents = function (context, type) {
         switch (type) {
@@ -1908,7 +2025,7 @@ var GLTFLoader = /** @class */ (function () {
             case "MAT3": return 9;
             case "MAT4": return 16;
         }
-        throw new Error(context + ": Invalid type (" + type + ")");
+        throw new Error("".concat(context, ": Invalid type (").concat(type, ")"));
     };
     GLTFLoader._ValidateUri = function (uri) {
         return (Tools.IsBase64(uri) || uri.indexOf("..") === -1);
@@ -1927,7 +2044,7 @@ var GLTFLoader = /** @class */ (function () {
             case 5 /* TRIANGLE_STRIP */: return Material.TriangleStripDrawMode;
             case 6 /* TRIANGLE_FAN */: return Material.TriangleFanDrawMode;
         }
-        throw new Error(context + ": Invalid mesh primitive mode (" + mode + ")");
+        throw new Error("".concat(context, ": Invalid mesh primitive mode (").concat(mode, ")"));
     };
     GLTFLoader.prototype._compileMaterialsAsync = function () {
         var _this = this;
@@ -1987,7 +2104,7 @@ var GLTFLoader = /** @class */ (function () {
         for (var _i = 0, _a = this._extensions; _i < _a.length; _i++) {
             var extension = _a[_i];
             if (extension.enabled) {
-                var id = extension.name + "." + functionName;
+                var id = "".concat(extension.name, ".").concat(functionName);
                 var loaderProperty = property;
                 loaderProperty._activeLoaderExtensionFunctions = loaderProperty._activeLoaderExtensionFunctions || {};
                 var activeLoaderExtensionFunctions = loaderProperty._activeLoaderExtensionFunctions;
@@ -2075,7 +2192,7 @@ var GLTFLoader = /** @class */ (function () {
         if (!extension) {
             return null;
         }
-        return actionAsync(context + "/extensions/" + extensionName, extension);
+        return actionAsync("".concat(context, "/extensions/").concat(extensionName), extension);
     };
     /**
      * Helper method called by a loader extension to load a glTF extra.
@@ -2094,7 +2211,7 @@ var GLTFLoader = /** @class */ (function () {
         if (!extra) {
             return null;
         }
-        return actionAsync(context + "/extras/" + extensionName, extra);
+        return actionAsync("".concat(context, "/extras/").concat(extensionName), extra);
     };
     /**
      * Checks for presence of an extension.