LUTPass.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173
  1. import { ShaderPass } from './ShaderPass.js';
  2. const LUTShader = {
  3. defines: {
  4. USE_3DTEXTURE: 1,
  5. },
  6. uniforms: {
  7. lut3d: { value: null },
  8. lut: { value: null },
  9. lutSize: { value: 0 },
  10. tDiffuse: { value: null },
  11. intensity: { value: 1.0 },
  12. },
  13. vertexShader: /* glsl */`
  14. varying vec2 vUv;
  15. void main() {
  16. vUv = uv;
  17. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  18. }
  19. `,
  20. fragmentShader: /* glsl */`
  21. uniform float lutSize;
  22. #if USE_3DTEXTURE
  23. precision highp sampler3D;
  24. uniform sampler3D lut3d;
  25. #else
  26. uniform sampler2D lut;
  27. vec3 lutLookup( sampler2D tex, float size, vec3 rgb ) {
  28. float sliceHeight = 1.0 / size;
  29. float yPixelHeight = 1.0 / ( size * size );
  30. // Get the slices on either side of the sample
  31. float slice = rgb.b * size;
  32. float interp = fract( slice );
  33. float slice0 = slice - interp;
  34. float centeredInterp = interp - 0.5;
  35. float slice1 = slice0 + sign( centeredInterp );
  36. // Pull y sample in by half a pixel in each direction to avoid color
  37. // bleeding from adjacent slices.
  38. float greenOffset = clamp( rgb.g * sliceHeight, yPixelHeight * 0.5, sliceHeight - yPixelHeight * 0.5 );
  39. vec2 uv0 = vec2(
  40. rgb.r,
  41. slice0 * sliceHeight + greenOffset
  42. );
  43. vec2 uv1 = vec2(
  44. rgb.r,
  45. slice1 * sliceHeight + greenOffset
  46. );
  47. vec3 sample0 = texture2D( tex, uv0 ).rgb;
  48. vec3 sample1 = texture2D( tex, uv1 ).rgb;
  49. return mix( sample0, sample1, abs( centeredInterp ) );
  50. }
  51. #endif
  52. varying vec2 vUv;
  53. uniform float intensity;
  54. uniform sampler2D tDiffuse;
  55. void main() {
  56. vec4 val = texture2D( tDiffuse, vUv );
  57. vec4 lutVal;
  58. // pull the sample in by half a pixel so the sample begins
  59. // at the center of the edge pixels.
  60. float pixelWidth = 1.0 / lutSize;
  61. float halfPixelWidth = 0.5 / lutSize;
  62. vec3 uvw = vec3( halfPixelWidth ) + val.rgb * ( 1.0 - pixelWidth );
  63. #if USE_3DTEXTURE
  64. lutVal = vec4( texture( lut3d, uvw ).rgb, val.a );
  65. #else
  66. lutVal = vec4( lutLookup( lut, lutSize, uvw ), val.a );
  67. #endif
  68. gl_FragColor = vec4( mix( val, lutVal, intensity ) );
  69. }
  70. `,
  71. };
  72. class LUTPass extends ShaderPass {
  73. set lut( v ) {
  74. const material = this.material;
  75. if ( v !== this.lut ) {
  76. material.uniforms.lut3d.value = null;
  77. material.uniforms.lut.value = null;
  78. if ( v ) {
  79. const is3dTextureDefine = v.isData3DTexture ? 1 : 0;
  80. if ( is3dTextureDefine !== material.defines.USE_3DTEXTURE ) {
  81. material.defines.USE_3DTEXTURE = is3dTextureDefine;
  82. material.needsUpdate = true;
  83. }
  84. material.uniforms.lutSize.value = v.image.width;
  85. if ( v.isData3DTexture ) {
  86. material.uniforms.lut3d.value = v;
  87. } else {
  88. material.uniforms.lut.value = v;
  89. }
  90. }
  91. }
  92. }
  93. get lut() {
  94. return this.material.uniforms.lut.value || this.material.uniforms.lut3d.value;
  95. }
  96. set intensity( v ) {
  97. this.material.uniforms.intensity.value = v;
  98. }
  99. get intensity() {
  100. return this.material.uniforms.intensity.value;
  101. }
  102. constructor( options = {} ) {
  103. super( LUTShader );
  104. this.lut = options.lut || null;
  105. this.intensity = 'intensity' in options ? options.intensity : 1;
  106. }
  107. }
  108. export { LUTPass };