PMREMGenerator: Add flipEnvMap. (#23158)

* PMREMGenerator: Add flipEnvMap.

* PMREMGenerator: Simplicy flipEnvMap check.

* Examples: Clean up.

* Examples: Add stats.js to dynamic env map demo.

examples/webgl_materials_cubemap_dynamic.html

@@ -19,7 +19,9 @@
 
 			import * as THREE from '../build/three.module.js';
 
-			let camera, scene, renderer;
+			import Stats from './jsm/libs/stats.module.js';
+
+			let camera, scene, renderer, stats;
 			let cube, sphere, torus, material;
 
 			let count = 0, cubeCamera1, cubeCamera2, cubeRenderTarget1, cubeRenderTarget2;
@@ -49,6 +51,9 @@
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				document.body.appendChild( renderer.domElement );
 
+				stats = new Stats();
+				document.body.appendChild( stats.dom );
+
 				scene = new THREE.Scene();
 				scene.background = texture;
 
@@ -56,28 +61,20 @@
 
 				//
 
-				cubeRenderTarget1 = new THREE.WebGLCubeRenderTarget( 256, {
-					format: THREE.RGBFormat,
-					generateMipmaps: true,
-					minFilter: THREE.LinearMipmapLinearFilter
-				} );
+				cubeRenderTarget1 = new THREE.WebGLCubeRenderTarget( 256 );
 
 				cubeCamera1 = new THREE.CubeCamera( 1, 1000, cubeRenderTarget1 );
 
-				cubeRenderTarget2 = new THREE.WebGLCubeRenderTarget( 256, {
-					format: THREE.RGBFormat,
-					generateMipmaps: true,
-					minFilter: THREE.LinearMipmapLinearFilter
-				} );
+				cubeRenderTarget2 = new THREE.WebGLCubeRenderTarget( 256 );
 
 				cubeCamera2 = new THREE.CubeCamera( 1, 1000, cubeRenderTarget2 );
 
 				//
 
-				material = new THREE.MeshBasicMaterial( {
+				material = new THREE.MeshStandardMaterial( {
 					envMap: cubeRenderTarget2.texture,
-					combine: THREE.MultiplyOperation,
-					reflectivity: 1
+					roughness: 0,
+					metalness: 1
 				} );
 
 				sphere = new THREE.Mesh( new THREE.IcosahedronGeometry( 20, 8 ), material );
@@ -201,6 +198,8 @@
 
 				renderer.render( scene, camera );
 
+				stats.update();
+
 			}
 
 		</script>

src/extras/PMREMGenerator.js

@@ -342,6 +342,8 @@ class PMREMGenerator {
 
 			}
 
+			this._cubemapShader.uniforms.flipEnvMap.value = ( texture.isRenderTargetTexture === false ) ? - 1 : 1;
+
 		} else {
 
 			if ( this._equirectShader == null ) {
@@ -763,7 +765,8 @@ function _getCubemapShader() {
 		name: 'CubemapToCubeUV',
 
 		uniforms: {
-			'envMap': { value: null }
+			'envMap': { value: null },
+			'flipEnvMap': { value: - 1 }
 		},
 
 		vertexShader: _getCommonVertexShader(),
@@ -773,13 +776,15 @@ function _getCubemapShader() {
 			precision mediump float;
 			precision mediump int;
 
+			uniform float flipEnvMap;
+
 			varying vec3 vOutputDirection;
 
 			uniform samplerCube envMap;
 
 			void main() {
 
-				gl_FragColor = textureCube( envMap, vec3( - vOutputDirection.x, vOutputDirection.yz ) );
+				gl_FragColor = textureCube( envMap, vec3( flipEnvMap * vOutputDirection.x, vOutputDirection.yz ) );
 
 			}
 		`,

src/renderers/WebGLCubeRenderTarget.js

@@ -37,8 +37,6 @@ class WebGLCubeRenderTarget extends WebGLRenderTarget {
 		this.texture.generateMipmaps = options.generateMipmaps !== undefined ? options.generateMipmaps : false;
 		this.texture.minFilter = options.minFilter !== undefined ? options.minFilter : LinearFilter;
 
-		this.texture._needsFlipEnvMap = false;
-
 	}
 
 	fromEquirectangularTexture( renderer, texture ) {