Load events for `Texture`

Discussion
22

Why do you disagree? You asked questions, I answered them, but you didn’t say why you disagree really. I think it was only me trying to convince anyone.

It is hardly any work to add this, and the benefit is there.

This is also a small non-breaking change that makes it easy to fix 3rd party code with minimal changes in a good way (IMO).

thirdPartyRenderingAPI.texture = someTexture // it receives a texture and knows when to re-render
23

I’ve been watching this disuccsion closely, being curious where it would lead…

I strongly believe you should separate the concept of images and textures. Userland (your) code is responsible for loading data (images, canvas data, videos and what-not), which you then feed to a Texture once loaded. From what I understand is that you’re effectively trying to move (copy) a problem that is already being solved.

There is no callback or event to listen to when it comes to uploading texture data to the GPU. And this is precisely the job of a Texture class. Please keep the concern of a data source and target separated. It’ll only add confusion since everything you’re looking for is already solved by the browser.

1 Like
24

For what it’s worth I added this to check if the images referenced by a texture were loaded:

const getTextureSources = <T extends Texture>(
  texture: T
): HTMLImageElement[] => {
  return Array.isArray(texture.image) ? texture.image : [texture.image];
};

const isTextureReady = <T extends Texture>(texture: T) => {
  return getTextureSources(texture).every(img => img.complete);
};

const waitForTextureReady = async <T extends Texture>(texture: T) => {
  return await new Promise<void>(resolve => {
    if (isTextureReady(texture)) {
      resolve();
    } else {
      getTextureSources(texture).forEach(img =>
        img.addEventListener('load', () => {
          if (isTextureReady(texture)) {
            resolve();
          }
        })
      );
    }
  });
};
25

Although that’s great and works well when the image source is something that fires a load event, it requires knowing specifics of each type of texture (in this case, the texture has an Image instance).

It would be awesome if Three’s Textures had their own load events so it wouldn’t matter what the underlying image source is; a Three user would have a single way to observe any texture being loaded.