Class DefaultImageProvider

packages/view/src/ImageProvider.ts:54–124

}

export class DefaultImageProvider implements ImageProvider {
	readonly nullTexture: Texture = createTexture('__NULL_TEXTURE', NULL_IMAGE_URI);
	readonly loadingTexture: Texture = createTexture('__LOADING_TEXTURE', LOADING_IMAGE_URI);

	private _cache = new Map<Uint8Array<ArrayBuffer>, Texture | CompressedTexture>();
	private _ktx2Loader: KTX2Loader | null = null;

	async initTexture(textureDef: TextureDef): Promise<void> {
		await this.getTexture(textureDef);
	}

	async getTexture(textureDef: TextureDef): Promise<Texture | CompressedTexture> {
		const image = textureDef.getImage()!;
		const mimeType = textureDef.getMimeType();

		let texture = this._cache.get(image);

		if (texture) return texture;

		texture = mimeType === 'image/ktx2' ? await this._loadKTX2Image(image) : await this._loadImage(image, mimeType);

		this._cache.set(image, texture);
		return texture;
	}

	setKTX2Loader(loader: KTX2Loader): this {
		this._ktx2Loader = loader;
		return this;
	}

	clear(): void {
		for (const [_, texture] of this._cache) {
			texture.dispose();
		}
		this._cache.clear();
	}

	dispose(): void {
		this.clear();
		if (this._ktx2Loader) this._ktx2Loader.dispose();
	}

	/** Load PNG, JPEG, or other browser-supported image format. */
	private async _loadImage(image: Uint8Array<ArrayBuffer>, mimeType: string): Promise<Texture> {
		return new Promise((resolve, reject) => {
			const blob = new Blob([image], { type: mimeType });
			const imageURL = URL.createObjectURL(blob);
			const imageEl = document.createElement('img');

			const texture = new Texture(imageEl);
			texture.flipY = false;

			imageEl.src = imageURL;
			imageEl.onload = () => {
				URL.revokeObjectURL(imageURL);
				resolve(texture);
			};
			imageEl.onerror = reject;