@babylonjs/loaders 5.0.0-beta.4 → 5.0.0-beta.8

package/glTF/2.0/glTFLoader.js

@@ -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];
     };
@@ -71,10 +71,15 @@ var GLTFLoader = /** @class */ (function () {
         this._babylonLights = [];
         /** @hidden */
         this._disableInstancedMesh = 0;
-        this._disposed = false;
         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
@@ -107,6 +112,9 @@ var GLTFLoader = /** @class */ (function () {
          * 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,
@@ -137,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,
@@ -159,14 +170,14 @@ 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 */
@@ -192,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;
                 });
@@ -224,12 +235,12 @@ 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._parent._setState(GLTFLoaderState.LOADING);
@@ -243,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) {
@@ -306,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;
             }
@@ -349,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);
@@ -362,16 +373,16 @@ 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);
             }
         }
     };
@@ -399,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);
@@ -418,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();
@@ -547,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;
             }
         }
@@ -567,41 +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;
+        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 () {
@@ -620,17 +650,17 @@ 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];
             }));
@@ -643,16 +673,12 @@ var GLTFLoader = /** @class */ (function () {
             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 () {
@@ -675,7 +701,7 @@ 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;
@@ -713,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;
                 }));
             }
@@ -743,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);
@@ -751,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);
             }));
         }
@@ -764,8 +790,8 @@ 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) {
@@ -836,15 +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
         }
     };
@@ -856,7 +882,7 @@ 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 () {
             morphTargetManager.areUpdatesFrozen = false;
@@ -873,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);
             }));
         };
@@ -936,30 +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;
+        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);
         });
@@ -967,38 +985,85 @@ var GLTFLoader = /** @class */ (function () {
             babylonSkeleton: babylonSkeleton,
             promise: promise
         };
+        assign(babylonSkeleton);
         return promise;
     };
     GLTFLoader.prototype._loadBones = function (context, skin, babylonSkeleton) {
+        if (skin.skeleton == undefined) {
+            var rootNode = this._findSkeletonRootNode("".concat(context, "/joints"), skin.joints);
+            if (rootNode) {
+                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++) {
@@ -1036,9 +1101,9 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         var promises = new Array();
-        this.logOpen(context + " " + (camera.name || ""));
+        this.logOpen("".concat(context, " ").concat(camera.name || ""));
         this._babylonScene._blockEntityCollection = !!this._assetContainer;
-        var babylonCamera = new FreeCamera(camera.name || "camera" + camera.index, Vector3.Zero(), this._babylonScene, false);
+        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;
@@ -1047,7 +1112,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;
@@ -1056,7 +1121,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;
@@ -1068,7 +1133,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);
@@ -1087,7 +1152,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();
@@ -1108,7 +1173,7 @@ var GLTFLoader = /** @class */ (function () {
             return promise;
         }
         this._babylonScene._blockEntityCollection = !!this._assetContainer;
-        var babylonAnimationGroup = new AnimationGroup(animation.name || "animation" + animation.index, this._babylonScene);
+        var babylonAnimationGroup = new AnimationGroup(animation.name || "animation".concat(animation.index), this._babylonScene);
         babylonAnimationGroup._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         animation._babylonAnimationGroup = babylonAnimationGroup;
@@ -1117,7 +1182,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);
@@ -1140,14 +1205,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) {
@@ -1172,7 +1237,7 @@ 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;
@@ -1217,7 +1282,7 @@ var GLTFLoader = /** @class */ (function () {
             switch (data.interpolation) {
                 case "STEP" /* STEP */: {
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
                         value: getNextOutputValue(),
                         interpolation: AnimationKeyInterpolation.STEP
                     }); };
@@ -1225,14 +1290,14 @@ var GLTFLoader = /** @class */ (function () {
                 }
                 case "LINEAR" /* LINEAR */: {
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
                         value: getNextOutputValue()
                     }); };
                     break;
                 }
                 case "CUBICSPLINE" /* CUBICSPLINE */: {
                     getNextKey = function (frameIndex) { return ({
-                        frame: data.input[frameIndex],
+                        frame: data.input[frameIndex] * _this.parent.targetFps,
                         inTangent: getNextOutputValue(),
                         value: getNextOutputValue(),
                         outTangent: getNextOutputValue()
@@ -1246,8 +1311,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,
@@ -1267,8 +1332,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);
@@ -1293,14 +1358,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 {
@@ -1326,11 +1391,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);
             }
@@ -1340,7 +1405,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));
             }
         });
     };
@@ -1358,8 +1423,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) {
@@ -1374,8 +1439,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);
                 }
@@ -1392,21 +1457,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;
@@ -1431,23 +1496,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);
             });
         }
@@ -1458,7 +1523,7 @@ 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;
@@ -1485,7 +1550,7 @@ var GLTFLoader = /** @class */ (function () {
             });
         }
         else {
-            var bufferView_2 = ArrayItem.Get(context + "/bufferView", this._gltf.bufferViews, accessor.bufferView);
+            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);
@@ -1495,7 +1560,7 @@ var GLTFLoader = /** @class */ (function () {
     };
     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) {
@@ -1509,15 +1574,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;
@@ -1537,7 +1602,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,
@@ -1590,7 +1655,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;
     };
@@ -1609,7 +1674,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 () { });
@@ -1623,7 +1688,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);
@@ -1633,8 +1698,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;
@@ -1646,8 +1711,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;
@@ -1656,8 +1721,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;
             }));
         }
@@ -1672,7 +1737,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) {
@@ -1697,7 +1762,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, ")"));
             }
         }
     };
@@ -1715,13 +1780,13 @@ var GLTFLoader = /** @class */ (function () {
         if (extensionPromise) {
             return extensionPromise;
         }
-        this.logOpen("" + context);
+        this.logOpen("".concat(context));
         if (textureInfo.texCoord >= 6) {
-            throw new Error(context + "/texCoord: Invalid value (" + textureInfo.texCoord + ")");
+            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);
@@ -1737,9 +1802,9 @@ 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);
+        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;
@@ -1748,7 +1813,7 @@ var GLTFLoader = /** @class */ (function () {
     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._assetContainer;
@@ -1763,7 +1828,7 @@ var GLTFLoader = /** @class */ (function () {
             },
             onError: function (message, exception) {
                 if (!_this._disposed) {
-                    deferred.reject(new Error(context + ": " + ((exception && exception.message) ? exception.message : message || "Failed to load texture")));
+                    deferred.reject(new Error("".concat(context, ": ").concat((exception && exception.message) ? exception.message : message || "Failed to load texture")));
                 }
             },
             mimeType: image.mimeType,
@@ -1774,9 +1839,9 @@ var GLTFLoader = /** @class */ (function () {
         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;
@@ -1791,8 +1856,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;
@@ -1805,13 +1870,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();
         }
@@ -1831,23 +1896,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 (IsBase64DataUrl(uri)) {
             var data = new Uint8Array(DecodeBase64UrlToBinary(uri));
-            this.log(context + ": Decoded " + uri.substr(0, 64) + "... (" + data.length + " bytes)");
+            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(_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));
                 });
             });
         });
@@ -1871,7 +1936,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;
         }
     };
@@ -1888,13 +1953,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;
@@ -1904,7 +1969,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;
             }
         }
@@ -1917,17 +1982,17 @@ 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);
+        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(context + ": Copying buffer as byte offset (" + byteOffset + ") is not a multiple of component type byte length (" + componentTypeLength + ")");
+            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);
@@ -1942,7 +2007,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);
@@ -1961,7 +2026,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;
@@ -2021,7 +2086,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;
@@ -2109,7 +2174,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.
@@ -2128,7 +2193,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.