Can Three JS colladaLoader load ZAE files?

I'm trying to use ThreeJS to load collada files and I've copied the code in their demos section. It seems to load .dae files fine, even if they have textures in other files. Unfortunately I need to have a single file loaded which contains textures.

It looks like .zae files are the way forward but when I try to load one I get a blank screen and a console error:

Uncaught TypeError: Cannot read property 'getAttribute' of undefined

Debugger shows it happens on the following line in the colladaLoader.js package

var version = collada.getAttribute( 'version' );

Is this because .zae files aren't supported or have I done something wrong?

Solution

No, the default ColladaLoader can't do that.

But from glancing over the collada specification (Page 20), it should be possible to write a loader based on (or using the) ColladaLoader that can handle zae-files.

Something like this:

load the file and unzip it (other loaders are using JSZip for that, for example the THREE.KMZLoader)
parse the manifest.xml from the archive to get the main .dae filename from the <dae_root> element.
parse that .dae-file using the normal THREE.ColladaLoader
the loader will try to load textures directly (using textureLoader.load()), so you need to provide a THREE.LoadingManager to the ColladaLoader that can return images from the archive. This can be done by specifying an 'url-modifier' function to the LoadingManager that:
- checks if the url matches a file in the archive
- extract the file from the archive into a Blob instance
- return an object-url for the blob as resolved URL (see URL.createObjectUrl()). So for example:
```
THREE.DefaultLoadingManager.setURLModifier(url => {
  if (existsInArchive(url)) {
    return URL.createObjectUrl(new Blob([getFromArchive(url)]));
  }

  return url;
});
```