( url, onLoad, onProgress, onError ) { if ( this.path !== undefined ) url = this.path + url; url = this.manager.resolveURL( url ); const scope = this; const cached = Cache.get( `image:${url}` ); if ( cached !== undefined ) { if ( cached.complete === true ) { scope.manager.itemStart( url ); setTimeout( function () { if ( onLoad ) onLoad( cached ); scope.manager.itemEnd( url ); }, 0 ); } else { let arr = _loading.get( cached ); if ( arr === undefined ) { arr = []; _loading.set( cached, arr ); } arr.push( { onLoad, onError } ); } return cached; } const image = createElementNS( 'img' ); function onImageLoad() { removeEventListeners(); if ( onLoad ) onLoad( this ); // const callbacks = _loading.get( this ) || []; for ( let i = 0; i < callbacks.length; i ++ ) { const callback = callbacks[ i ]; if ( callback.onLoad ) callback.onLoad( this ); } _loading.delete( this ); scope.manager.itemEnd( url ); } function onImageError( event ) { removeEventListeners(); if ( onError ) onError( event ); Cache.remove( `image:${url}` ); // const callbacks = _loading.get( this ) || []; for ( let i = 0; i < callbacks.length; i ++ ) { const callback = callbacks[ i ]; if ( callback.onError ) callback.onError( event ); } _loading.delete( this ); scope.manager.itemError( url ); scope.manager.itemEnd( url ); } function removeEventListeners() { image.removeEventListener( 'load', onImageLoad, false ); image.removeEventListener( 'error', onImageError, false ); } image.addEventListener( 'load', onImageLoad, false ); image.addEventListener( 'error', onImageError, false ); if ( url.slice( 0, 5 ) !== 'data:' ) { if ( this.crossOrigin !== undefined ) image.crossOrigin = this.crossOrigin; } Cache.add( `image:${url}`, image ); scope.manager.itemStart( url ); image.src = url; return image; } } /** * Class for loading cube textures. Images are internally loaded via {@link ImageLoader}. * * The loader returns an instance of {@link CubeTexture} and expects the cube map to * be defined as six separate images representing the sides of a cube. Other cube map definitions * like vertical and horizontal cross, column and row layouts are not supported. * * Note that, by convention, cube maps are specified in a coordinate system * in which positive-x is to the right when looking up the positive-z axis -- * in other words, using a left-handed coordinate system. Since three.js uses * a right-handed coordinate system, environment maps used in three.js will * have pos-x and neg-x swapped. * * The loaded cube texture is in sRGB color space. Meaning {@link Texture#colorSpace} * is set to `SRGBColorSpace` by default. * * ```js * const loader = new THREE.CubeTextureLoader().setPath( 'textures/cubeMaps/' ); * const cubeTexture = await loader.loadAsync( [ * 'px.png', 'nx.png', 'py.png', 'ny.png', 'pz.png', 'nz.png' * ] ); * scene.background = cubeTexture; * ``` * * @augments Loader */ class CubeTextureLoader extends Loader { /** * Constructs a new cube texture loader. * * @param {LoadingManager} [manager] - The loading manager. */ constructor( manager ) { super( manager ); } /** * Starts loading from the given URL and pass the fully loaded cube texture * to the `onLoad()` callback. The method also returns a new cube texture object which can * directly be used for material creation. If you do it this way, the cube texture * may pop up in your scene once the respective loading process is finished. * * @param {Array} urls - Array of 6 URLs to images, one for each side of the * cube texture. The urls should be specified in the following order: pos-x, * neg-x, pos-y, neg-y, pos-z, neg-z. An array of data URIs are allowed as well. * @param {function(CubeTexture)} onLoad - Executed when the loading process has been finished. * @param {onProgressCallback} onProgress - Unsupported in this loader. * @param {onErrorCallback} onError - Executed when errors occur. * @return {CubeTexture} The cube texture. */ load( urls, onLoad, onProgress, onError ) { const texture = new CubeTexture(); texture.colorSpace = SRGBColorSpace; const loader = new ImageLoader( this.manager ); loader.setCrossOrigin( this.crossOrigin ); loader.setPath( this.path ); let loaded = 0; function loadTexture( i ) { loader.load( urls[ i ], function ( image ) { texture.images[ i ] = image; loaded ++; if ( loaded === 6 ) { texture.needsUpdate = true; if ( onLoad ) onLoad( texture ); } }, undefined, onError ); } for ( let i = 0; i < urls.length; ++ i ) { loadTexture( i ); } return texture; } } /** * Abstract base class for loading binary texture formats RGBE, EXR or TGA. * Texture