@babylonjs/loaders 5.0.0-alpha.5 → 5.0.0-alpha.53

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
  */
@@ -66,13 +66,12 @@ 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._defaultBabylonMaterialData = {};
         this._parent = parent;
@@ -102,16 +101,6 @@ 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.
@@ -180,12 +169,12 @@ var GLTFLoader = /** @class */ (function () {
         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) {
@@ -242,7 +231,7 @@ var GLTFLoader = /** @class */ (function () {
             var loadingToCompleteCounterName = GLTFLoaderState[GLTFLoaderState.LOADING] + " => " + 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.
@@ -276,7 +265,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 +275,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();
@@ -385,13 +374,10 @@ var GLTFLoader = /** @class */ (function () {
             }
         }
     };
-    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 = {
@@ -604,8 +590,9 @@ var GLTFLoader = /** @class */ (function () {
         };
         if (node.mesh == undefined) {
             var nodeName = node.name || "node" + node.index;
-            this._babylonScene._blockEntityCollection = this._forAssetContainer;
+            this._babylonScene._blockEntityCollection = !!this._assetContainer;
             node._babylonTransformNode = new TransformNode(nodeName, this._babylonScene);
+            node._babylonTransformNode._parentContainer = this._assetContainer;
             this._babylonScene._blockEntityCollection = false;
             loadNode(node._babylonTransformNode);
         }
@@ -646,8 +633,9 @@ var GLTFLoader = /** @class */ (function () {
             }));
         }
         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++) {
@@ -689,20 +677,25 @@ var GLTFLoader = /** @class */ (function () {
         var babylonAbstractMesh;
         var promise;
         if (shouldInstance && primitive._instanceData) {
+            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;
                 });
             }));
@@ -773,6 +766,27 @@ var GLTFLoader = /** @class */ (function () {
                 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);
@@ -794,6 +808,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);
@@ -819,6 +837,7 @@ var GLTFLoader = /** @class */ (function () {
         }
         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;
@@ -836,7 +855,9 @@ var GLTFLoader = /** @class */ (function () {
             var babylonMorphTarget = morphTargetManager.getTarget(index);
             promises.push(this._loadMorphTargetVertexDataAsync(context + "/targets/" + 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;
@@ -928,8 +949,9 @@ var GLTFLoader = /** @class */ (function () {
             return skin._data.promise;
         }
         var skeletonId = "skeleton" + skin.index;
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        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;
@@ -988,7 +1010,6 @@ var GLTFLoader = /** @class */ (function () {
             if (babylonParentBone) {
                 baseMatrix.multiplyToRef(babylonParentBone.getInvertedAbsoluteTransform(), baseMatrix);
             }
-            babylonBone.setBindPose(baseMatrix);
             babylonBone.updateMatrix(baseMatrix, false, false);
             babylonBone._updateDifferenceMatrix(undefined, false);
         }
@@ -1013,8 +1034,9 @@ var GLTFLoader = /** @class */ (function () {
         }
         var promises = new Array();
         this.logOpen(context + " " + (camera.name || ""));
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
         var babylonCamera = new FreeCamera(camera.name || "camera" + 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);
@@ -1082,8 +1104,9 @@ var GLTFLoader = /** @class */ (function () {
         if (promise) {
             return promise;
         }
-        this._babylonScene._blockEntityCollection = this._forAssetContainer;
+        this._babylonScene._blockEntityCollection = !!this._assetContainer;
         var babylonAnimationGroup = new AnimationGroup(animation.name || "animation" + animation.index, this._babylonScene);
+        babylonAnimationGroup._parentContainer = this._assetContainer;
         this._babylonScene._blockEntityCollection = false;
         animation._babylonAnimationGroup = babylonAnimationGroup;
         var promises = new Array();
@@ -1439,36 +1462,33 @@ var GLTFLoader = /** @class */ (function () {
     };
     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) {
+            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)) {
@@ -1541,8 +1561,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;
@@ -1692,7 +1713,7 @@ var GLTFLoader = /** @class */ (function () {
             return extensionPromise;
         }
         this.logOpen("" + context);
-        if (textureInfo.texCoord >= 2) {
+        if (textureInfo.texCoord >= 6) {
             throw new Error(context + "/texCoord: Invalid value (" + textureInfo.texCoord + ")");
         }
         var texture = ArrayItem.Get(context + "/index", this._gltf.textures, textureInfo.index);
@@ -1716,27 +1737,38 @@ var GLTFLoader = /** @class */ (function () {
         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);
+        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 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(context + ": " + ((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) {
@@ -1798,15 +1830,15 @@ var GLTFLoader = /** @class */ (function () {
         if (!GLTFLoader._ValidateUri(uri)) {
             throw new Error(context + ": '" + uri + "' is invalid");
         }
-        if (Tools.IsBase64(uri)) {
-            var data = new Uint8Array(Tools.DecodeBase64(uri));
+        if (IsBase64DataUrl(uri)) {
+            var data = new Uint8Array(DecodeBase64UrlToBinary(uri));
             this.log(context + ": Decoded " + uri.substr(0, 64) + "... (" + data.length + " bytes)");
             return Promise.resolve(data);
         }
         this.log(context + ": Loading " + 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)");
                         resolve(new Uint8Array(data));
@@ -1889,12 +1921,13 @@ var GLTFLoader = /** @class */ (function () {
         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 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 + ")");
+            return new constructor(buffer.slice(byteOffset, byteOffset + length * componentTypeLength), 0);
         }
+        return new constructor(buffer, byteOffset, length);
     };
     GLTFLoader._GetNumComponents = function (context, type) {
         switch (type) {