WebGLRenderer Shaders: introduce `transformNormalByInverseViewMatrix()` (#33351)

Co-authored-by: Michael Herzog <michael.herzog@human-interactive.org>

examples/jsm/helpers/LightProbeHelper.js

@@ -58,11 +58,12 @@ class LightProbeHelper extends Mesh {
 
 				#define RECIPROCAL_PI 0.318309886
 
-				vec3 inverseTransformDirection( in vec3 normal, in mat4 matrix ) {
 
-					// matrix is assumed to be orthogonal
+				vec3 transformNormalByInverseViewMatrix( in vec3 normal, in mat4 viewMatrix ) {
 
-					return normalize( ( vec4( normal, 0.0 ) * matrix ).xyz );
+					// upper-left 3x3 of view matrix is assumed to be orthogonal
+
+					return normalize( ( vec4( normal, 0.0 ) * viewMatrix ).xyz );
 
 				}
 
@@ -101,7 +102,7 @@ class LightProbeHelper extends Mesh {
 
 					vec3 normal = normalize( vNormal );
 
-					vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
+					vec3 worldNormal = transformNormalByInverseViewMatrix( normal, viewMatrix );
 
 					vec3 irradiance = shGetIrradianceAt( worldNormal, sh );
 

src/renderers/shaders/ShaderChunk/common.glsl.js

@@ -64,12 +64,21 @@ vec3 transformDirection( in vec3 dir, in mat4 matrix ) {
 
 }
 
-vec3 inverseTransformDirection( in vec3 dir, in mat4 matrix ) {
+#define inverseTransformDirection transformNormalByInverseViewMatrix // keeping this for backwards compatibility
 
-	// dir can be either a direction vector or a normal vector
-	// upper-left 3x3 of matrix is assumed to be orthogonal
+vec3 transformNormalByInverseViewMatrix( in vec3 normal, in mat4 viewMatrix ) {
 
-	return normalize( ( vec4( dir, 0.0 ) * matrix ).xyz );
+	// upper-left 3x3 of view matrix is assumed to be orthogonal
+
+	return normalize( ( vec4( normal, 0.0 ) * viewMatrix ).xyz );
+
+}
+
+vec3 transformDirectionByInverseViewMatrix( in vec3 dir, in mat4 viewMatrix ) {
+
+	// upper-left 3x3 of view matrix is assumed to be orthogonal
+
+	return normalize( ( vec4( dir, 0.0 ) * viewMatrix ).xyz );
 
 }
 

src/renderers/shaders/ShaderChunk/envmap_fragment.glsl.js

@@ -16,7 +16,7 @@ export default /* glsl */`
 		}
 
 		// Transforming Normal Vectors with the Inverse Transformation
-		vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
+		vec3 worldNormal = transformNormalByInverseViewMatrix( normal, viewMatrix );
 
 		#ifdef ENVMAP_MODE_REFLECTION
 

src/renderers/shaders/ShaderChunk/envmap_physical_pars_fragment.glsl.js

@@ -5,7 +5,7 @@ export default /* glsl */`
 
 		#ifdef ENVMAP_TYPE_CUBE_UV
 
-			vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
+			vec3 worldNormal = transformNormalByInverseViewMatrix( normal, viewMatrix );
 
 			vec4 envMapColor = textureCubeUV( envMap, envMapRotation * worldNormal, 1.0 );
 
@@ -28,7 +28,7 @@ export default /* glsl */`
 			// Mixing the reflection with the normal is more accurate and keeps rough objects from gathering light from behind their tangent plane.
 			reflectVec = normalize( mix( reflectVec, normal, pow4( roughness ) ) );
 
-			reflectVec = inverseTransformDirection( reflectVec, viewMatrix );
+			reflectVec = transformDirectionByInverseViewMatrix( reflectVec, viewMatrix );
 
 			vec4 envMapColor = textureCubeUV( envMap, envMapRotation * reflectVec, roughness );
 

src/renderers/shaders/ShaderChunk/envmap_vertex.glsl.js

@@ -19,7 +19,7 @@ export default /* glsl */`
 
 		}
 
-		vec3 worldNormal = inverseTransformDirection( transformedNormal, viewMatrix );
+		vec3 worldNormal = transformNormalByInverseViewMatrix( transformedNormal, viewMatrix );
 
 		#ifdef ENVMAP_MODE_REFLECTION
 

src/renderers/shaders/ShaderChunk/lights_pars_begin.glsl.js

@@ -37,7 +37,7 @@ vec3 shGetIrradianceAt( in vec3 normal, in vec3 shCoefficients[ 9 ] ) {
 
 vec3 getLightProbeIrradiance( const in vec3 lightProbe[ 9 ], const in vec3 normal ) {
 
-	vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
+	vec3 worldNormal = transformNormalByInverseViewMatrix( normal, viewMatrix );
 
 	vec3 irradiance = shGetIrradianceAt( worldNormal, lightProbe );
 

src/renderers/shaders/ShaderChunk/shadowmap_vertex.glsl.js

@@ -6,7 +6,7 @@ export default /* glsl */`
 
 		// Offsetting the position used for querying occlusion along the world normal can be used to reduce shadow acne.
 
-		vec3 shadowWorldNormal = inverseTransformDirection( transformedNormal, viewMatrix );
+		vec3 shadowWorldNormal = transformNormalByInverseViewMatrix( transformedNormal, viewMatrix );
 
 	#else
 

src/renderers/shaders/ShaderChunk/transmission_fragment.glsl.js

@@ -21,7 +21,7 @@ export default /* glsl */`
 
 	vec3 pos = vWorldPosition;
 	vec3 v = normalize( cameraPosition - pos );
-	vec3 n = inverseTransformDirection( normal, viewMatrix );
+	vec3 n = transformNormalByInverseViewMatrix( normal, viewMatrix );
 
 	vec4 transmitted = getIBLVolumeRefraction(
 		n, v, material.roughness, material.diffuseContribution, material.specularColorBlended, material.specularF90,