Cleanup and better error handling

src/components/gltf-model-plus.js

@@ -197,25 +197,28 @@ function getFilesFromSketchfabZip(src) {
 }
 
 function cachedLoadGLTF(src, basePath, contentType, preferredTechnique, onProgress) {
-  // Load the gltf model from the cache if it exists.
   if (!GLTFCache[src]) {
     GLTFCache[src] = new Promise(async (resolve, reject) => {
-      let gltfUrl = src;
-      let onLoad = resolve;
-      if (contentType === "model/gltf+zip") {
-        const fileMap = await getFilesFromSketchfabZip(src);
-        gltfUrl = fileMap["scene.gtlf"];
-        onLoad = model => {
-          // The GLTF is now cached as a THREE object, we can get rid of the original blobs
-          Object.keys(fileMap).forEach(URL.revokeObjectURL);
-          resolve(model);
-        };
-      }
+      try {
+        let gltfUrl = src;
+        let onLoad = resolve;
+        if (contentType === "model/gltf+zip") {
+          const fileMap = await getFilesFromSketchfabZip(src);
+          gltfUrl = fileMap["scene.gtlf"];
+          onLoad = model => {
+            // The GLTF is now cached as a THREE object, we can get rid of the original blobs
+            Object.keys(fileMap).forEach(URL.revokeObjectURL);
+            resolve(model);
+          };
+        }
 
-      const gltfLoader = new THREE.GLTFLoader();
-      gltfLoader.path = basePath;
-      gltfLoader.preferredTechnique = preferredTechnique;
-      gltfLoader.load(gltfUrl, onLoad, onProgress, reject);
+        const gltfLoader = new THREE.GLTFLoader();
+        gltfLoader.path = basePath;
+        gltfLoader.preferredTechnique = preferredTechnique;
+        gltfLoader.load(gltfUrl, onLoad, onProgress, reject);
+      } catch (e) {
+        reject(e);
+      }
     });
   }
   return GLTFCache[src].then(cloneGltf);

src/utils/media-utils.js

@@ -18,7 +18,7 @@ export const resolveFarsparkUrl = async url => {
           headers: { "Content-Type": "application/json" },
           body: JSON.stringify({ media: { url } })
         }).then(r => r.json());
-  // farsparkCache.set(url, resolved);
+  farsparkCache.set(url, resolved);
   return resolved;
 };
 

src/workers/sketchfab-zip.worker.js

@@ -6,13 +6,14 @@ async function fetchZipAndGetBlobs(src) {
     .then(JSZip.loadAsync);
 
   // Rewrite any url refferences in the GLTF to blob urls
+  const fileMap = {};
+  const files = Object.values(zip.files);
+  const fileBlobs = await Promise.all(files.map(f => f.async("blob")));
+  for (let i = 0; i < fileBlobs.length; i++) {
+    fileMap[files[i].name] = URL.createObjectURL(fileBlobs[i]);
+  }
+
   const gltfJson = JSON.parse(await zip.file("scene.gltf").async("text"));
-  const fileMap = await Object.values(zip.files).reduce(async (prev, file) => {
-    if (file.name === "scene.gltf") return prev;
-    const out = await prev;
-    out[file.name] = URL.createObjectURL(await file.async("blob"));
-    return out;
-  }, Promise.resolve({}));
   gltfJson.buffers && gltfJson.buffers.forEach(b => (b.uri = fileMap[b.uri]));
   gltfJson.images && gltfJson.images.forEach(i => (i.uri = fileMap[i.uri]));
 
@@ -26,6 +27,6 @@ self.onmessage = async e => {
     const fileMap = await fetchZipAndGetBlobs(e.data);
     self.postMessage([true, fileMap]);
   } catch (e) {
-    self.postMessage([false, e]);
+    self.postMessage([false, e.message]);
   }
 };