Merge pull request #32 from bldrs-ai/glb

GLB working

.gitignore

@@ -3,6 +3,7 @@ build
 
 # Test curl output
 render.png
+log
 
 # Misc
 venv

models/index.bld

@@ -7,19 +7,34 @@
   "objScale": 1,
   "objects": [
     {
-      "href": "obj/index.bld",
+      "href": "bld/mix.bld",
+      "scale": 0.5,
+      "pos": [-35,15,5]
+    },
+    {
+      "href": "fbx/samba-dancing.fbx",
+      "scale": 0.07,
+      "pos": [-35,0,5]
+    },
+    {
+      "href": "gltf/Duck.glb",
+      "scale": 1,
+      "pos": [-40,0,20]
+    },
+    {
+      "href": "ifc/index.ifc",
       "scale": 1,
       "pos": [0,0,0]
     },
     {
-      "href": "pdb/index.bld",
-      "scale": 0.4,
-      "pos": [5,4,5.5]
+      "href": "obj/index.bld",
+      "scale": 5,
+      "pos": [-50,0,5]
     },
     {
-      "href": "ifc/index.ifc",
-      "scale": 0.2,
-      "pos": [0,0,-5]
+      "href": "pdb/index.bld",
+      "scale": 5,
+      "pos": [-40,20,5]
     }
   ]
 }

src/Filetype.js

@@ -2,7 +2,7 @@ import {assertDefined} from './assert.js'
 
 
 // TODO: 3dm, glb
-export const supportedTypes = ['bld', 'fbx', 'ifc', 'obj', 'stl', 'pdb', 'xyz']
+export const supportedTypes = ['bld', 'fbx', 'glb', 'ifc', 'obj', 'pdb', 'stl', 'xyz']
 
 export const supportedTypesUsageStr = `${supportedTypes.join(',')}`
 

src/Loader.js

@@ -78,36 +78,35 @@ export async function load(
 async function readModel(loader, modelData, basePath, isLoaderAsync) {
   // debug().log(`Loader#readModel: loader(${loader.constructor.name}) basePath(${basePath}) isAsync(${isLoaderAsync}), data type: `, typeof modelData)
   let model
-  /* GLB
+  // GLTFLoader is unique so far in using an onLoad and onError.
+  // TODO(pablo): GLTF also generates errors for texture loads, but
+  // that seems to be deep in the promise stack within the loader.
+  if (loader instanceof GLTFLoader) {
     model = await new Promise((resolve, reject) => {
-      debug().log('Loader#readModel: promise in')
       try {
         loader.parse(modelData, './', (m) => {
-          // debug().log('Loader#readModel: promise: model:', m)
           resolve(m)
         }, (err) => {
-          debug().log('Loader#readModel: promise: error:', err)
           reject(`Loader error during parse: ${err}`)
         })
       } catch (e) {
         reject(`Unhandled error in parse ${e}`)
       }
-      })
-      // debug().log('Loader#readModel: promise out, model:', model)
-      */
-  if (isLoaderAsync) {
+    })
+  } else if (isLoaderAsync) {
     model = await loader.parse(modelData, basePath)
   } else {
     model = loader.parse(modelData, basePath)
   }
   if (!model) {
     throw new Error('Loader could not read model')
   }
-  // debug().log('Local file load: model:', model)
   return model
 }
 
 
+// TODO(pablo): not used.  Would be a higher-level API into the three
+// loader system.  Maybe works better for complex loaders. TBD.
 async function delegateLoad(url) {
   const urlStr = url.toString()
   return await new Promise((resolve, reject) => {
@@ -177,13 +176,13 @@ async function findLoader(pathname) {
       isFormatText = true
       break
     }
-      /*
     case '.glb': {
       loader = newGltfLoader()
       fixupCb = glbToThree
       isLoaderAsync = false
       break
     }
+    /*
     case '.3dm': {
       isLoaderAsync = true
       loader = {
@@ -219,7 +218,7 @@ async function findLoader(pathname) {
 function newGltfLoader() {
   const loader = new GLTFLoader
   const dracoLoader = new DRACOLoader
-  dracoLoader.setDecoderPath('http://localhost:8090/node_modules/three/examples/jsm/libs/draco/')
+  dracoLoader.setDecoderPath('./node_modules/three/examples/jsm/libs/draco/')
   loader.setDRACOLoader(dracoLoader)
   return loader
 }

src/Loader.test.js

@@ -43,7 +43,6 @@ describe('Loader', () => {
     expect(model).toMatchSnapshot()
   })
 
-
   it('loads an OBJ model', async () => {
     const onProgress = jest.fn()
     const onUnknownType =  jest.fn()
@@ -62,4 +61,30 @@ describe('Loader', () => {
     expect(model.children[0].isObject3D).toBe(true)
     expect(model).toMatchSnapshot()
   })
+
+
+  // TODO(pablo): Dies with 'Trace: Loader error during parse:
+  // RangeError: Offset is outside the bounds of the DataView'
+  // But no stack trace.
+  // However, Duck.glb does load for live server.
+/*
+  it('loads an GLB model', async () => {
+    const onProgress = jest.fn()
+    const onUnknownType =  jest.fn()
+    const onError =  jest.fn()
+    const model = await load(
+      `http://localhost:${MSW_TEST_PORT}/models/gltf/Duck.glb`,
+      onProgress,
+      onUnknownType,
+      onError
+    )
+    expect(onUnknownType).not.toHaveBeenCalled()
+    expect(onError).not.toHaveBeenCalled()
+    // TODO(pablo): not called
+    // expect(onProgress).toHaveBeenCalled()
+    expect(model).toBeDefined()
+    //expect(model.children[0].isObject3D).toBe(true)
+    expect(model).toMatchSnapshot()
+  })
+*/
 })

src/lib.js

@@ -2,10 +2,7 @@ import fs from 'fs'
 import gl from 'gl'
 import {JSDOM} from 'jsdom'
 import {PNG} from 'pngjs'
-// import {Blob} from 'fetch-blob'
-import {Blob} from 'node:buffer'
 import url from 'node:url'
-// import Worker from 'web-worker'
 import * as THREE from 'three'
 import {EffectComposer} from 'three/addons/postprocessing/EffectComposer.js'
 import {SSAARenderPass} from 'three/addons/postprocessing/SSAARenderPass.js'
@@ -19,31 +16,7 @@ export function initDom() {
   global.window = dom.window
   global.document = window.document
   global.self = global.window
-  global.Blob = Blob
   global.self.URL = url.URL
-/*  console.log('url', url.URL)
-  class MyBlob {
-    constructor(buf) {
-      this.buf = buf[0]
-      // console.log('BUFFF', buf)
-    }
-  }
-  global.Blob = MyBlob
-  // console.log('Global Blob:', Blob)
-  global.self.URL = {
-    createObjectURL: (stuff) => {
-      const obj = Buffer.from(stuff.buf).toString('base64')
-      // console.log('createObjectURL: stuff.buf, obj', stuff, stuff.buf, obj)
-      const str = `data:image/png;base64,${obj}`
-      //global.Blob = Blob
-      // console.log(str)
-      return str
-    }
-  }
-*/
-
-  // console.log('Global URL:', URL, URL.createObjectURL)
-  //global.Worker = Worker
 
   // Needed by camera-controls
   global.DOMRect = class DOMRect {