mrdoob · Oletus · Jun 7, 2023 · Aug 14, 2023 · Sep 25, 2023 · Sep 25, 2023
diff --git a/examples/jsm/effects/OutlineEffect.js b/examples/jsm/effects/OutlineEffect.js
@@ -164,9 +164,9 @@ class OutlineEffect {
 
 			'	gl_FragColor = vec4( outlineColor, outlineAlpha );',
 
+			'	#include <fog_fragment>',
 			'	#include <tonemapping_fragment>',
 			'	#include <colorspace_fragment>',
-			'	#include <fog_fragment>',
 			'	#include <premultiplied_alpha_fragment>',
 
 			'}'

diff --git a/examples/jsm/lines/LineMaterial.js b/examples/jsm/lines/LineMaterial.js
@@ -425,9 +425,9 @@ ShaderLib[ 'line' ] = {
 
 			gl_FragColor = vec4( diffuseColor.rgb, alpha );
 
+			#include <fog_fragment>
 			#include <tonemapping_fragment>
 			#include <colorspace_fragment>
-			#include <fog_fragment>
 			#include <premultiplied_alpha_fragment>
 
 		}

diff --git a/examples/jsm/loaders/LDrawLoader.js b/examples/jsm/loaders/LDrawLoader.js
@@ -132,9 +132,9 @@ class LDrawConditionalLineMaterial extends ShaderMaterial {
 				#include <color_fragment>
 				outgoingLight = diffuseColor.rgb; // simple shader
 				gl_FragColor = vec4( outgoingLight, diffuseColor.a );
+				#include <fog_fragment>
 				#include <tonemapping_fragment>
 				#include <colorspace_fragment>
-				#include <fog_fragment>
 				#include <premultiplied_alpha_fragment>
 			}
 			`,

diff --git a/examples/jsm/materials/MeshGouraudMaterial.js b/examples/jsm/materials/MeshGouraudMaterial.js
@@ -293,9 +293,9 @@ const GouraudShader = {
 			#include <envmap_fragment>
 
 			#include <opaque_fragment>
+			#include <fog_fragment>
 			#include <tonemapping_fragment>
 			#include <colorspace_fragment>
-			#include <fog_fragment>
 			#include <premultiplied_alpha_fragment>
 			#include <dithering_fragment>
 

diff --git a/examples/jsm/objects/Water.js b/examples/jsm/objects/Water.js
@@ -180,9 +180,9 @@ class Water extends Mesh {
 					vec3 outgoingLight = albedo;
 					gl_FragColor = vec4( outgoingLight, alpha );
 
+					#include <fog_fragment>
 					#include <tonemapping_fragment>
 					#include <colorspace_fragment>
-					#include <fog_fragment>	
 				}`
 
 		};

diff --git a/examples/jsm/objects/Water2.js b/examples/jsm/objects/Water2.js
@@ -347,9 +347,9 @@ Water.WaterShader = {
 			// multiply water color with the mix of both textures
 			gl_FragColor = vec4( color, 1.0 ) * mix( refractColor, reflectColor, reflectance );
 
+			#include <fog_fragment>
 			#include <tonemapping_fragment>
 			#include <colorspace_fragment>
-			#include <fog_fragment>
 
 		}`
 

diff --git a/examples/screenshots/games_fps.jpg b/examples/screenshots/games_fps.jpg
diff --git a/examples/screenshots/misc_controls_map.jpg b/examples/screenshots/misc_controls_map.jpg
diff --git a/examples/screenshots/webaudio_orientation.jpg b/examples/screenshots/webaudio_orientation.jpg
diff --git a/examples/screenshots/webgl_animation_skinning_ik.jpg b/examples/screenshots/webgl_animation_skinning_ik.jpg
diff --git a/examples/screenshots/webgl_buffergeometry.jpg b/examples/screenshots/webgl_buffergeometry.jpg
diff --git a/examples/screenshots/webgl_buffergeometry_points.jpg b/examples/screenshots/webgl_buffergeometry_points.jpg
diff --git a/examples/screenshots/webgl_buffergeometry_points_interleaved.jpg b/examples/screenshots/webgl_buffergeometry_points_interleaved.jpg
diff --git a/examples/screenshots/webgl_buffergeometry_uint.jpg b/examples/screenshots/webgl_buffergeometry_uint.jpg
diff --git a/examples/screenshots/webgl_custom_attributes_points2.jpg b/examples/screenshots/webgl_custom_attributes_points2.jpg
diff --git a/examples/screenshots/webgl_custom_attributes_points3.jpg b/examples/screenshots/webgl_custom_attributes_points3.jpg
diff --git a/examples/screenshots/webgl_geometry_dynamic.jpg b/examples/screenshots/webgl_geometry_dynamic.jpg
diff --git a/examples/screenshots/webgl_geometry_terrain.jpg b/examples/screenshots/webgl_geometry_terrain.jpg
diff --git a/examples/screenshots/webgl_geometry_text.jpg b/examples/screenshots/webgl_geometry_text.jpg
diff --git a/examples/screenshots/webgl_gpgpu_birds_gltf.jpg b/examples/screenshots/webgl_gpgpu_birds_gltf.jpg
diff --git a/examples/screenshots/webgl_gpgpu_protoplanet.jpg b/examples/screenshots/webgl_gpgpu_protoplanet.jpg
diff --git a/examples/screenshots/webgl_helpers.jpg b/examples/screenshots/webgl_helpers.jpg
diff --git a/examples/screenshots/webgl_interactive_buffergeometry.jpg b/examples/screenshots/webgl_interactive_buffergeometry.jpg
diff --git a/examples/screenshots/webgl_interactive_points.jpg b/examples/screenshots/webgl_interactive_points.jpg
diff --git a/examples/screenshots/webgl_loader_amf.jpg b/examples/screenshots/webgl_loader_amf.jpg
diff --git a/examples/screenshots/webgl_loader_gcode.jpg b/examples/screenshots/webgl_loader_gcode.jpg
diff --git a/examples/screenshots/webgl_loader_md2_control.jpg b/examples/screenshots/webgl_loader_md2_control.jpg
diff --git a/examples/screenshots/webgl_loader_pcd.jpg b/examples/screenshots/webgl_loader_pcd.jpg
diff --git a/examples/screenshots/webgl_loader_texture_ktx.jpg b/examples/screenshots/webgl_loader_texture_ktx.jpg
diff --git a/examples/screenshots/webgl_loader_ttf.jpg b/examples/screenshots/webgl_loader_ttf.jpg
diff --git a/examples/screenshots/webgl_lod.jpg b/examples/screenshots/webgl_lod.jpg
diff --git a/examples/screenshots/webgl_materials_texture_filters.jpg b/examples/screenshots/webgl_materials_texture_filters.jpg
diff --git a/examples/screenshots/webgl_materials_texture_manualmipmap.jpg b/examples/screenshots/webgl_materials_texture_manualmipmap.jpg
diff --git a/examples/screenshots/webgl_points_billboards.jpg b/examples/screenshots/webgl_points_billboards.jpg
diff --git a/examples/screenshots/webgl_postprocessing_glitch.jpg b/examples/screenshots/webgl_postprocessing_glitch.jpg
diff --git a/examples/screenshots/webgl_postprocessing_pixel.jpg b/examples/screenshots/webgl_postprocessing_pixel.jpg
diff --git a/examples/screenshots/webgl_postprocessing_procedural.jpg b/examples/screenshots/webgl_postprocessing_procedural.jpg
diff --git a/examples/screenshots/webgl_sprites.jpg b/examples/screenshots/webgl_sprites.jpg
diff --git a/examples/screenshots/webxr_vr_teleport.jpg b/examples/screenshots/webxr_vr_teleport.jpg
diff --git a/examples/screenshots/webxr_xr_cubes.jpg b/examples/screenshots/webxr_xr_cubes.jpg
diff --git a/examples/screenshots/webxr_xr_dragging.jpg b/examples/screenshots/webxr_xr_dragging.jpg
diff --git a/src/renderers/shaders/ShaderLib/linedashed.glsl.js b/src/renderers/shaders/ShaderLib/linedashed.glsl.js
@@ -66,9 +66,9 @@ void main() {
 	outgoingLight = diffuseColor.rgb; // simple shader
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 
 }

diff --git a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js
@@ -104,9 +104,9 @@ void main() {
 	#include <envmap_fragment>
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js
@@ -112,9 +112,9 @@ void main() {
 
 	#include <envmap_fragment>
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js
@@ -99,9 +99,9 @@ void main() {
 	vec3 outgoingLight = diffuseColor.rgb * matcapColor.rgb;
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/meshphong.glsl.js b/src/renderers/shaders/ShaderLib/meshphong.glsl.js
@@ -114,9 +114,9 @@ void main() {
 
 	#include <envmap_fragment>
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js
@@ -212,9 +212,9 @@ void main() {
 	#endif
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js
@@ -106,9 +106,9 @@ void main() {
 	vec3 outgoingLight = reflectedLight.directDiffuse + reflectedLight.indirectDiffuse + totalEmissiveRadiance;
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 	#include <dithering_fragment>
 

diff --git a/src/renderers/shaders/ShaderLib/points.glsl.js b/src/renderers/shaders/ShaderLib/points.glsl.js
@@ -77,9 +77,9 @@ void main() {
 	outgoingLight = diffuseColor.rgb;
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 	#include <premultiplied_alpha_fragment>
 
 }

diff --git a/src/renderers/shaders/ShaderLib/shadow.glsl.js b/src/renderers/shaders/ShaderLib/shadow.glsl.js
@@ -46,9 +46,9 @@ void main() {
 
 	gl_FragColor = vec4( color, opacity * ( 1.0 - getShadowMask() ) );
 
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 
 }
 `;
diff --git a/src/renderers/shaders/ShaderLib/sprite.glsl.js b/src/renderers/shaders/ShaderLib/sprite.glsl.js
@@ -73,9 +73,9 @@ void main() {
 	outgoingLight = diffuseColor.rgb;
 
 	#include <opaque_fragment>
+	#include <fog_fragment>
 	#include <tonemapping_fragment>
 	#include <colorspace_fragment>
-	#include <fog_fragment>
 
 }
 `;
diff --git a/src/renderers/webgl/WebGLMaterials.js b/src/renderers/webgl/WebGLMaterials.js
@@ -1,5 +1,5 @@
-import { BackSide } from '../../constants.js';
-import { getUnlitUniformColorSpace } from '../shaders/UniformsUtils.js';
+import { BackSide, LinearSRGBColorSpace, SRGBColorSpace } from '../../constants.js';
+import { ColorManagement } from '../../math/ColorManagement.js';
 
 function WebGLMaterials( renderer, properties ) {
 
@@ -17,7 +17,26 @@
 
 	function refreshFogUniforms( uniforms, fog ) {
 
-		fog.color.getRGB( uniforms.fogColor.value, getUnlitUniformColorSpace( renderer ) );
+		if ( ColorManagement.enabled ) {
+
+			fog.color.getRGB( uniforms.fogColor.value, LinearSRGBColorSpace );
+
+		} else {
+
+			if ( getUnlitUniformColorSpace( renderer ) === SRGBColorSpace ) {
+
+				// We do this to match previous behaviour, though it's a bit unintuitive to apply color management operations in case color management is disabled.
+
+				_color.copySRGBToLinear( fog.color );
+				_color.getRGB( uniforms.fogColor.value );
+
+			} else {
+
+				fog.color.getRGB( uniforms.fogColor.value );
+
+			}
+
+		}
 
 		if ( fog.isFog ) {