Skip to content

Commit 800d6b3

Browse files
authored
Merge pull request #20182 from Mugen87/dev44
WebGLCubeRenderTarget: Use CubeTexture.
2 parents f93563c + 1732817 commit 800d6b3

File tree

7 files changed

+144
-152
lines changed

7 files changed

+144
-152
lines changed

src/renderers/WebGLCubeRenderTarget.d.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { WebGLRenderTargetOptions, WebGLRenderTarget } from './WebGLRenderTarget';
22
import { WebGLRenderer } from './WebGLRenderer';
33
import { Texture } from './../textures/Texture';
4+
import { CubeTexture } from './../textures/CubeTexture';
45

56
export class WebGLCubeRenderTarget extends WebGLRenderTarget {
67

@@ -9,6 +10,8 @@ export class WebGLCubeRenderTarget extends WebGLRenderTarget {
910
options?: WebGLRenderTargetOptions
1011
);
1112

13+
texture: CubeTexture;
14+
1215
fromEquirectangularTexture( renderer: WebGLRenderer, texture: Texture ): this;
1316

1417
}

src/renderers/WebGLCubeRenderTarget.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { ShaderMaterial } from '../materials/ShaderMaterial.js';
55
import { cloneUniforms } from './shaders/UniformsUtils.js';
66
import { WebGLRenderTarget } from './WebGLRenderTarget.js';
77
import { CubeCamera } from '../cameras/CubeCamera.js';
8+
import { CubeTexture } from '../textures/CubeTexture.js';
89

910
function WebGLCubeRenderTarget( size, options, dummy ) {
1011

@@ -18,7 +19,11 @@ function WebGLCubeRenderTarget( size, options, dummy ) {
1819

1920
WebGLRenderTarget.call( this, size, size, options );
2021

21-
this.texture.isWebGLCubeRenderTargetTexture = true; // HACK Why is texture not a CubeTexture?
22+
options = options || {};
23+
24+
this.texture = new CubeTexture( undefined, options.mapping, options.wrapS, options.wrapT, options.magFilter, options.minFilter, options.format, options.type, options.anisotropy, options.encoding );
25+
26+
this.texture._needsFlipEnvMap = false;
2227

2328
}
2429

src/renderers/webgl/WebGLBackground.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ function WebGLBackground( renderer, cubemaps, state, objects, premultipliedAlpha
5858

5959
}
6060

61-
if ( background && ( background.isCubeTexture || background.isWebGLCubeRenderTarget || background.isWebGLCubeRenderTargetTexture || background.mapping === CubeUVReflectionMapping ) ) {
61+
if ( background && ( background.isCubeTexture || background.isWebGLCubeRenderTarget || background.mapping === CubeUVReflectionMapping ) ) {
6262

6363
if ( boxMesh === undefined ) {
6464

@@ -109,7 +109,7 @@ function WebGLBackground( renderer, cubemaps, state, objects, premultipliedAlpha
109109
}
110110

111111
boxMesh.material.uniforms.envMap.value = background;
112-
boxMesh.material.uniforms.flipEnvMap.value = background.isCubeTexture ? - 1 : 1;
112+
boxMesh.material.uniforms.flipEnvMap.value = ( background.isCubeTexture && background._needsFlipEnvMap ) ? - 1 : 1;
113113

114114
if ( currentBackground !== background ||
115115
currentBackgroundVersion !== background.version ||

src/renderers/webgl/WebGLMaterials.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,7 @@ function WebGLMaterials( properties ) {
145145

146146
uniforms.envMap.value = envMap;
147147

148-
uniforms.flipEnvMap.value = envMap.isCubeTexture ? - 1 : 1;
148+
uniforms.flipEnvMap.value = ( envMap.isCubeTexture && envMap._needsFlipEnvMap ) ? - 1 : 1;
149149

150150
uniforms.reflectivity.value = material.reflectivity;
151151
uniforms.refractionRatio.value = material.refractionRatio;

src/renderers/webgl/WebGLTextures.d.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ export class WebGLTextures {
2323
setTexture2DArray( texture: any, slot: number ): void;
2424
setTexture3D( texture: any, slot: number ): void;
2525
setTextureCube( texture: any, slot: number ): void;
26-
setTextureCubeDynamic( texture: any, slot: number ): void;
2726
setupRenderTarget( renderTarget: any ): void;
2827
updateRenderTargetMipmap( renderTarget: any ): void;
2928
updateMultisampleRenderTarget( renderTarget: any ): void;

src/renderers/webgl/WebGLTextures.js

Lines changed: 130 additions & 147 deletions
Original file line numberDiff line numberDiff line change
@@ -379,145 +379,17 @@ function WebGLTextures( _gl, extensions, state, properties, capabilities, utils,
379379

380380
function setTextureCube( texture, slot ) {
381381

382-
if ( texture.image.length !== 6 ) return;
383-
384382
const textureProperties = properties.get( texture );
385383

386384
if ( texture.version > 0 && textureProperties.__version !== texture.version ) {
387385

388-
initTexture( textureProperties, texture );
389-
390-
state.activeTexture( _gl.TEXTURE0 + slot );
391-
state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__webglTexture );
392-
393-
_gl.pixelStorei( _gl.UNPACK_FLIP_Y_WEBGL, texture.flipY );
394-
395-
const isCompressed = ( texture && ( texture.isCompressedTexture || texture.image[ 0 ].isCompressedTexture ) );
396-
const isDataTexture = ( texture.image[ 0 ] && texture.image[ 0 ].isDataTexture );
397-
398-
const cubeImage = [];
399-
400-
for ( let i = 0; i < 6; i ++ ) {
401-
402-
if ( ! isCompressed && ! isDataTexture ) {
403-
404-
cubeImage[ i ] = resizeImage( texture.image[ i ], false, true, maxCubemapSize );
405-
406-
} else {
407-
408-
cubeImage[ i ] = isDataTexture ? texture.image[ i ].image : texture.image[ i ];
409-
410-
}
411-
412-
}
413-
414-
const image = cubeImage[ 0 ],
415-
supportsMips = isPowerOfTwo( image ) || isWebGL2,
416-
glFormat = utils.convert( texture.format ),
417-
glType = utils.convert( texture.type ),
418-
glInternalFormat = getInternalFormat( texture.internalFormat, glFormat, glType );
419-
420-
setTextureParameters( _gl.TEXTURE_CUBE_MAP, texture, supportsMips );
421-
422-
let mipmaps;
423-
424-
if ( isCompressed ) {
425-
426-
for ( let i = 0; i < 6; i ++ ) {
427-
428-
mipmaps = cubeImage[ i ].mipmaps;
429-
430-
for ( let j = 0; j < mipmaps.length; j ++ ) {
431-
432-
const mipmap = mipmaps[ j ];
433-
434-
if ( texture.format !== RGBAFormat && texture.format !== RGBFormat ) {
435-
436-
if ( glFormat !== null ) {
437-
438-
state.compressedTexImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glInternalFormat, mipmap.width, mipmap.height, 0, mipmap.data );
439-
440-
} else {
441-
442-
console.warn( 'THREE.WebGLRenderer: Attempt to load unsupported compressed texture format in .setTextureCube()' );
443-
444-
}
445-
446-
} else {
447-
448-
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glInternalFormat, mipmap.width, mipmap.height, 0, glFormat, glType, mipmap.data );
449-
450-
}
451-
452-
}
453-
454-
}
455-
456-
textureProperties.__maxMipLevel = mipmaps.length - 1;
457-
458-
} else {
459-
460-
mipmaps = texture.mipmaps;
461-
462-
for ( let i = 0; i < 6; i ++ ) {
463-
464-
if ( isDataTexture ) {
465-
466-
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glInternalFormat, cubeImage[ i ].width, cubeImage[ i ].height, 0, glFormat, glType, cubeImage[ i ].data );
467-
468-
for ( let j = 0; j < mipmaps.length; j ++ ) {
469-
470-
const mipmap = mipmaps[ j ];
471-
const mipmapImage = mipmap.image[ i ].image;
472-
473-
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j + 1, glInternalFormat, mipmapImage.width, mipmapImage.height, 0, glFormat, glType, mipmapImage.data );
474-
475-
}
476-
477-
} else {
478-
479-
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glInternalFormat, glFormat, glType, cubeImage[ i ] );
480-
481-
for ( let j = 0; j < mipmaps.length; j ++ ) {
482-
483-
const mipmap = mipmaps[ j ];
484-
485-
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j + 1, glInternalFormat, glFormat, glType, mipmap.image[ i ] );
486-
487-
}
488-
489-
}
490-
491-
}
492-
493-
textureProperties.__maxMipLevel = mipmaps.length;
494-
495-
}
496-
497-
if ( textureNeedsGenerateMipmaps( texture, supportsMips ) ) {
498-
499-
// We assume images for cube map have the same size.
500-
generateMipmap( _gl.TEXTURE_CUBE_MAP, texture, image.width, image.height );
501-
502-
}
503-
504-
textureProperties.__version = texture.version;
505-
506-
if ( texture.onUpdate ) texture.onUpdate( texture );
507-
508-
} else {
509-
510-
state.activeTexture( _gl.TEXTURE0 + slot );
511-
state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__webglTexture );
386+
uploadCubeTexture( textureProperties, texture, slot );
387+
return;
512388

513389
}
514390

515-
}
516-
517-
function setTextureCubeDynamic( texture, slot ) {
518-
519391
state.activeTexture( _gl.TEXTURE0 + slot );
520-
state.bindTexture( _gl.TEXTURE_CUBE_MAP, properties.get( texture ).__webglTexture );
392+
state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__webglTexture );
521393

522394
}
523395

@@ -827,6 +699,132 @@ function WebGLTextures( _gl, extensions, state, properties, capabilities, utils,
827699

828700
}
829701

702+
function uploadCubeTexture( textureProperties, texture, slot ) {
703+
704+
if ( texture.image.length !== 6 ) return;
705+
706+
initTexture( textureProperties, texture );
707+
708+
state.activeTexture( _gl.TEXTURE0 + slot );
709+
state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__webglTexture );
710+
711+
_gl.pixelStorei( _gl.UNPACK_FLIP_Y_WEBGL, texture.flipY );
712+
713+
const isCompressed = ( texture && ( texture.isCompressedTexture || texture.image[ 0 ].isCompressedTexture ) );
714+
const isDataTexture = ( texture.image[ 0 ] && texture.image[ 0 ].isDataTexture );
715+
716+
const cubeImage = [];
717+
718+
for ( let i = 0; i < 6; i ++ ) {
719+
720+
if ( ! isCompressed && ! isDataTexture ) {
721+
722+
cubeImage[ i ] = resizeImage( texture.image[ i ], false, true, maxCubemapSize );
723+
724+
} else {
725+
726+
cubeImage[ i ] = isDataTexture ? texture.image[ i ].image : texture.image[ i ];
727+
728+
}
729+
730+
}
731+
732+
const image = cubeImage[ 0 ],
733+
supportsMips = isPowerOfTwo( image ) || isWebGL2,
734+
glFormat = utils.convert( texture.format ),
735+
glType = utils.convert( texture.type ),
736+
glInternalFormat = getInternalFormat( texture.internalFormat, glFormat, glType );
737+
738+
setTextureParameters( _gl.TEXTURE_CUBE_MAP, texture, supportsMips );
739+
740+
let mipmaps;
741+
742+
if ( isCompressed ) {
743+
744+
for ( let i = 0; i < 6; i ++ ) {
745+
746+
mipmaps = cubeImage[ i ].mipmaps;
747+
748+
for ( let j = 0; j < mipmaps.length; j ++ ) {
749+
750+
const mipmap = mipmaps[ j ];
751+
752+
if ( texture.format !== RGBAFormat && texture.format !== RGBFormat ) {
753+
754+
if ( glFormat !== null ) {
755+
756+
state.compressedTexImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glInternalFormat, mipmap.width, mipmap.height, 0, mipmap.data );
757+
758+
} else {
759+
760+
console.warn( 'THREE.WebGLRenderer: Attempt to load unsupported compressed texture format in .setTextureCube()' );
761+
762+
}
763+
764+
} else {
765+
766+
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glInternalFormat, mipmap.width, mipmap.height, 0, glFormat, glType, mipmap.data );
767+
768+
}
769+
770+
}
771+
772+
}
773+
774+
textureProperties.__maxMipLevel = mipmaps.length - 1;
775+
776+
} else {
777+
778+
mipmaps = texture.mipmaps;
779+
780+
for ( let i = 0; i < 6; i ++ ) {
781+
782+
if ( isDataTexture ) {
783+
784+
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glInternalFormat, cubeImage[ i ].width, cubeImage[ i ].height, 0, glFormat, glType, cubeImage[ i ].data );
785+
786+
for ( let j = 0; j < mipmaps.length; j ++ ) {
787+
788+
const mipmap = mipmaps[ j ];
789+
const mipmapImage = mipmap.image[ i ].image;
790+
791+
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j + 1, glInternalFormat, mipmapImage.width, mipmapImage.height, 0, glFormat, glType, mipmapImage.data );
792+
793+
}
794+
795+
} else {
796+
797+
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glInternalFormat, glFormat, glType, cubeImage[ i ] );
798+
799+
for ( let j = 0; j < mipmaps.length; j ++ ) {
800+
801+
const mipmap = mipmaps[ j ];
802+
803+
state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j + 1, glInternalFormat, glFormat, glType, mipmap.image[ i ] );
804+
805+
}
806+
807+
}
808+
809+
}
810+
811+
textureProperties.__maxMipLevel = mipmaps.length;
812+
813+
}
814+
815+
if ( textureNeedsGenerateMipmaps( texture, supportsMips ) ) {
816+
817+
// We assume images for cube map have the same size.
818+
generateMipmap( _gl.TEXTURE_CUBE_MAP, texture, image.width, image.height );
819+
820+
}
821+
822+
textureProperties.__version = texture.version;
823+
824+
if ( texture.onUpdate ) texture.onUpdate( texture );
825+
826+
}
827+
830828
// Render targets
831829

832830
// Setup storage for target texture and bind it to correct framebuffer
@@ -1247,22 +1245,8 @@ function WebGLTextures( _gl, extensions, state, properties, capabilities, utils,
12471245

12481246
}
12491247

1250-
// currently relying on the fact that WebGLCubeRenderTarget.texture is a Texture and NOT a CubeTexture
1251-
// TODO: unify these code paths
1252-
if ( ( texture && texture.isCubeTexture ) ||
1253-
( Array.isArray( texture.image ) && texture.image.length === 6 ) ) {
1254-
1255-
// CompressedTexture can have Array in image :/
12561248

1257-
// this function alone should take care of cube textures
1258-
setTextureCube( texture, slot );
1259-
1260-
} else {
1261-
1262-
// assumed: texture property of THREE.WebGLCubeRenderTarget
1263-
setTextureCubeDynamic( texture, slot );
1264-
1265-
}
1249+
setTextureCube( texture, slot );
12661250

12671251
}
12681252

@@ -1275,7 +1259,6 @@ function WebGLTextures( _gl, extensions, state, properties, capabilities, utils,
12751259
this.setTexture2DArray = setTexture2DArray;
12761260
this.setTexture3D = setTexture3D;
12771261
this.setTextureCube = setTextureCube;
1278-
this.setTextureCubeDynamic = setTextureCubeDynamic;
12791262
this.setupRenderTarget = setupRenderTarget;
12801263
this.updateRenderTargetMipmap = updateRenderTargetMipmap;
12811264
this.updateMultisampleRenderTarget = updateMultisampleRenderTarget;

src/textures/CubeTexture.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ function CubeTexture( images, mapping, wrapS, wrapT, magFilter, minFilter, forma
1111

1212
this.flipY = false;
1313

14+
this._needsFlipEnvMap = true;
15+
1416
}
1517

1618
CubeTexture.prototype = Object.create( Texture.prototype );

0 commit comments

Comments
 (0)