WebGL1 shader fix

Fixed the WebGL1 shader problem.
nilsrydell · Mar 24, 2021 · 7936ca7 · 7936ca7
1 parent 412b99a
commit 7936ca7
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 26 deletions.
diff --git a/examples/jsm/postprocessing/LUTPass.js b/examples/jsm/postprocessing/LUTPass.js
@@ -1,9 +1,11 @@
 import { ShaderPass } from './ShaderPass.js';
 
-const LUTShader = {
+const LUTShader = function(isWebGL2) {
+
+	return {
 
 		defines: {
-		USE_3DTEXTURE: 1,
+			USE_3DTEXTURE: isWebGL2
 		},
 
 		uniforms: {
@@ -30,13 +32,18 @@ const LUTShader = {
 		`,
 
 
-	fragmentShader: /* glsl */`
+		get fragmentShader() {
+			let shader = '';
+			shader += this.defines.USE_3DTEXTURE ? `
 			precision highp sampler3D;
-
+			` : `
+			`;
+			shader += `
 			uniform float lutSize;
-		#if USE_3DTEXTURE
+			`;
+			shader += this.defines.USE_3DTEXTURE ? `
 			uniform sampler3D lut3d;
-		#else
+			` : `
 			uniform sampler2D lut;
 
 			vec3 lutLookup( sampler2D tex, float size, vec3 rgb ) {
@@ -71,8 +78,8 @@ const LUTShader = {
 				return mix( sample0, sample1, abs( centeredInterp ) );
 
 			}
-		#endif
-
+			`;
+			shader += `
 			varying vec2 vUv;
 			uniform float intensity;
 			uniform sampler2D tDiffuse;
@@ -86,23 +93,19 @@ const LUTShader = {
 				float pixelWidth = 1.0 / lutSize;
 				float halfPixelWidth = 0.5 / lutSize;
 				vec3 uvw = vec3( halfPixelWidth ) + val.rgb * ( 1.0 - pixelWidth );
-
-			#if USE_3DTEXTURE
-
+			`;
+			shader += this.defines.USE_3DTEXTURE ? `
 				lutVal = vec4( texture( lut3d, uvw ).rgb, val.a );
-
-			#else
-
+			` : `
 				lutVal = vec4( lutLookup( lut, lutSize, uvw ), val.a );
-
-			#endif
-
+			`;
+			shader += `
 				gl_FragColor = vec4( mix( val, lutVal, intensity ) );
 
+			}`
+			return shader;
+		},
 	}
-
-	`,
-
 };
 
 class LUTPass extends ShaderPass {
@@ -117,10 +120,11 @@ class LUTPass extends ShaderPass {
 
 			if ( v ) {
 
-				const is3dTextureDefine = v.isDataTexture3D ? 1 : 0;
+				const is3dTextureDefine = v.isDataTexture3D ? true : false;
 				if ( is3dTextureDefine !== material.defines.USE_3DTEXTURE ) {
 
 					material.defines.USE_3DTEXTURE = is3dTextureDefine;
+					material.fragmentShader = LUTShader(is3dTextureDefine).fragmentShader;
 					material.needsUpdate = true;
 
 				}
@@ -161,8 +165,7 @@ class LUTPass extends ShaderPass {
 	}
 
 	constructor( options = {} ) {
-
-		super( LUTShader );
+		super(LUTShader(true));
 		this.lut = options.lut || null;
 		this.intensity = 'intensity' in options ? options.intensity : 1;
 

diff --git a/examples/webgl_postprocessing_3dlut.html b/examples/webgl_postprocessing_3dlut.html
@@ -34,7 +34,7 @@
 				enabled: true,
 				lut: 'Bourbon 64.CUBE',
 				intensity: 1,
-				use2dLut: false,
+				use2DLut: false,
 			};
 
 			const lutMap = {
@@ -137,7 +137,8 @@
 
 				if ( renderer.capabilities.isWebGL2 ) {
 
-					gui.add( params, 'use2dLut' );
+					gui.add( params, 'use2DLut' );
+					params.use2DLut = false;
 
 				} else {
 
@@ -161,7 +162,6 @@
 
 			}
 
-			//
 
 			function render() {