TextureCubeUVNode.js 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. import { TempNode } from '../core/TempNode.js';
  2. import { ConstNode } from '../core/ConstNode.js';
  3. import { StructNode } from '../core/StructNode.js';
  4. import { FunctionNode } from '../core/FunctionNode.js';
  5. import { FunctionCallNode } from '../core/FunctionCallNode.js';
  6. import { ExpressionNode } from '../core/ExpressionNode.js';
  7. import { FloatNode } from '../inputs/FloatNode.js';
  8. import { OperatorNode } from '../math/OperatorNode.js';
  9. import { MathNode } from '../math/MathNode.js';
  10. import { ColorSpaceNode } from '../utils/ColorSpaceNode.js';
  11. function TextureCubeUVNode( value, uv, bias ) {
  12. TempNode.call( this, 'v4' );
  13. this.value = value,
  14. this.uv = uv;
  15. this.bias = bias;
  16. }
  17. TextureCubeUVNode.Nodes = ( function () {
  18. var TextureCubeUVData = new StructNode(
  19. `struct TextureCubeUVData {
  20. vec4 tl;
  21. vec4 tr;
  22. vec4 br;
  23. vec4 bl;
  24. vec2 f;
  25. }` );
  26. var cubeUV_maxMipLevel = new ConstNode( 'float cubeUV_maxMipLevel 8.0', true );
  27. var cubeUV_minMipLevel = new ConstNode( 'float cubeUV_minMipLevel 4.0', true );
  28. var cubeUV_maxTileSize = new ConstNode( 'float cubeUV_maxTileSize 256.0', true );
  29. var cubeUV_minTileSize = new ConstNode( 'float cubeUV_minTileSize 16.0', true );
  30. // These shader functions convert between the UV coordinates of a single face of
  31. // a cubemap, the 0-5 integer index of a cube face, and the direction vector for
  32. // sampling a textureCube (not generally normalized).
  33. var getFace = new FunctionNode(
  34. `float getFace(vec3 direction) {
  35. vec3 absDirection = abs(direction);
  36. float face = -1.0;
  37. if (absDirection.x > absDirection.z) {
  38. if (absDirection.x > absDirection.y)
  39. face = direction.x > 0.0 ? 0.0 : 3.0;
  40. else
  41. face = direction.y > 0.0 ? 1.0 : 4.0;
  42. } else {
  43. if (absDirection.z > absDirection.y)
  44. face = direction.z > 0.0 ? 2.0 : 5.0;
  45. else
  46. face = direction.y > 0.0 ? 1.0 : 4.0;
  47. }
  48. return face;
  49. }` );
  50. getFace.useKeywords = false;
  51. var getUV = new FunctionNode(
  52. `vec2 getUV(vec3 direction, float face) {
  53. vec2 uv;
  54. if (face == 0.0) {
  55. uv = vec2(direction.z, direction.y) / abs(direction.x); // pos x
  56. } else if (face == 1.0) {
  57. uv = vec2(-direction.x, -direction.z) / abs(direction.y); // pos y
  58. } else if (face == 2.0) {
  59. uv = vec2(-direction.x, direction.y) / abs(direction.z); // pos z
  60. } else if (face == 3.0) {
  61. uv = vec2(-direction.z, direction.y) / abs(direction.x); // neg x
  62. } else if (face == 4.0) {
  63. uv = vec2(-direction.x, direction.z) / abs(direction.y); // neg y
  64. } else {
  65. uv = vec2(direction.x, direction.y) / abs(direction.z); // neg z
  66. }
  67. return 0.5 * (uv + 1.0);
  68. }` );
  69. getUV.useKeywords = false;
  70. var bilinearCubeUV = new FunctionNode(
  71. `TextureCubeUVData bilinearCubeUV(sampler2D envMap, vec3 direction, float mipInt) {
  72. float face = getFace(direction);
  73. float filterInt = max(cubeUV_minMipLevel - mipInt, 0.0);
  74. mipInt = max(mipInt, cubeUV_minMipLevel);
  75. float faceSize = exp2(mipInt);
  76. float texelSize = 1.0 / (3.0 * cubeUV_maxTileSize);
  77. vec2 uv = getUV(direction, face) * (faceSize - 1.0);
  78. vec2 f = fract(uv);
  79. uv += 0.5 - f;
  80. if (face > 2.0) {
  81. uv.y += faceSize;
  82. face -= 3.0;
  83. }
  84. uv.x += face * faceSize;
  85. if(mipInt < cubeUV_maxMipLevel){
  86. uv.y += 2.0 * cubeUV_maxTileSize;
  87. }
  88. uv.y += filterInt * 2.0 * cubeUV_minTileSize;
  89. uv.x += 3.0 * max(0.0, cubeUV_maxTileSize - 2.0 * faceSize);
  90. uv *= texelSize;
  91. vec4 tl = texture2D(envMap, uv);
  92. uv.x += texelSize;
  93. vec4 tr = texture2D(envMap, uv);
  94. uv.y += texelSize;
  95. vec4 br = texture2D(envMap, uv);
  96. uv.x -= texelSize;
  97. vec4 bl = texture2D(envMap, uv);
  98. return TextureCubeUVData( tl, tr, br, bl, f );
  99. }`, [ TextureCubeUVData, getFace, getUV, cubeUV_maxMipLevel, cubeUV_minMipLevel, cubeUV_maxTileSize, cubeUV_minTileSize ] );
  100. bilinearCubeUV.useKeywords = false;
  101. // These defines must match with PMREMGenerator
  102. var r0 = new ConstNode( 'float r0 1.0', true );
  103. var v0 = new ConstNode( 'float v0 0.339', true );
  104. var m0 = new ConstNode( 'float m0 -2.0', true );
  105. var r1 = new ConstNode( 'float r1 0.8', true );
  106. var v1 = new ConstNode( 'float v1 0.276', true );
  107. var m1 = new ConstNode( 'float m1 -1.0', true );
  108. var r4 = new ConstNode( 'float r4 0.4', true );
  109. var v4 = new ConstNode( 'float v4 0.046', true );
  110. var m4 = new ConstNode( 'float m4 2.0', true );
  111. var r5 = new ConstNode( 'float r5 0.305', true );
  112. var v5 = new ConstNode( 'float v5 0.016', true );
  113. var m5 = new ConstNode( 'float m5 3.0', true );
  114. var r6 = new ConstNode( 'float r6 0.21', true );
  115. var v6 = new ConstNode( 'float v6 0.0038', true );
  116. var m6 = new ConstNode( 'float m6 4.0', true );
  117. var defines = [ r0, v0, m0, r1, v1, m1, r4, v4, m4, r5, v5, m5, r6, v6, m6 ];
  118. var roughnessToMip = new FunctionNode(
  119. `float roughnessToMip(float roughness) {
  120. float mip = 0.0;
  121. if (roughness >= r1) {
  122. mip = (r0 - roughness) * (m1 - m0) / (r0 - r1) + m0;
  123. } else if (roughness >= r4) {
  124. mip = (r1 - roughness) * (m4 - m1) / (r1 - r4) + m1;
  125. } else if (roughness >= r5) {
  126. mip = (r4 - roughness) * (m5 - m4) / (r4 - r5) + m4;
  127. } else if (roughness >= r6) {
  128. mip = (r5 - roughness) * (m6 - m5) / (r5 - r6) + m5;
  129. } else {
  130. mip = -2.0 * log2(1.16 * roughness);// 1.16 = 1.79^0.25
  131. }
  132. return mip;
  133. }`, defines );
  134. return {
  135. bilinearCubeUV: bilinearCubeUV,
  136. roughnessToMip: roughnessToMip,
  137. m0: m0,
  138. cubeUV_maxMipLevel: cubeUV_maxMipLevel
  139. };
  140. } )();
  141. TextureCubeUVNode.prototype = Object.create( TempNode.prototype );
  142. TextureCubeUVNode.prototype.constructor = TextureCubeUVNode;
  143. TextureCubeUVNode.prototype.nodeType = 'TextureCubeUV';
  144. TextureCubeUVNode.prototype.bilinearCubeUV = function ( builder, texture, uv, mipInt ) {
  145. var bilinearCubeUV = new FunctionCallNode( TextureCubeUVNode.Nodes.bilinearCubeUV, [ texture, uv, mipInt ] );
  146. this.colorSpaceTL = this.colorSpaceTL || new ColorSpaceNode( new ExpressionNode( '', 'v4' ) );
  147. this.colorSpaceTL.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
  148. this.colorSpaceTL.input.parse( bilinearCubeUV.build( builder ) + '.tl' );
  149. this.colorSpaceTR = this.colorSpaceTR || new ColorSpaceNode( new ExpressionNode( '', 'v4' ) );
  150. this.colorSpaceTR.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
  151. this.colorSpaceTR.input.parse( bilinearCubeUV.build( builder ) + '.tr' );
  152. this.colorSpaceBL = this.colorSpaceBL || new ColorSpaceNode( new ExpressionNode( '', 'v4' ) );
  153. this.colorSpaceBL.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
  154. this.colorSpaceBL.input.parse( bilinearCubeUV.build( builder ) + '.bl' );
  155. this.colorSpaceBR = this.colorSpaceBR || new ColorSpaceNode( new ExpressionNode( '', 'v4' ) );
  156. this.colorSpaceBR.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
  157. this.colorSpaceBR.input.parse( bilinearCubeUV.build( builder ) + '.br' );
  158. // add a custom context for fix incompatibility with the core
  159. // include ColorSpace function only for vertex shader (in fragment shader color space functions is added automatically by core)
  160. // this should be removed in the future
  161. // context.include =: is used to include or not functions if used FunctionNode
  162. // context.ignoreCache =: not create temp variables nodeT0..9 to optimize the code
  163. var context = { include: builder.isShader( 'vertex' ), ignoreCache: true };
  164. builder.addContext( context );
  165. this.colorSpaceTLExp = new ExpressionNode( this.colorSpaceTL.build( builder, 'v4' ), 'v4' );
  166. this.colorSpaceTRExp = new ExpressionNode( this.colorSpaceTR.build( builder, 'v4' ), 'v4' );
  167. this.colorSpaceBLExp = new ExpressionNode( this.colorSpaceBL.build( builder, 'v4' ), 'v4' );
  168. this.colorSpaceBRExp = new ExpressionNode( this.colorSpaceBR.build( builder, 'v4' ), 'v4' );
  169. // end custom context
  170. builder.removeContext();
  171. // --
  172. var output = new ExpressionNode( 'mix( mix( cubeUV_TL, cubeUV_TR, cubeUV.f.x ), mix( cubeUV_BL, cubeUV_BR, cubeUV.f.x ), cubeUV.f.y )', 'v4' );
  173. output.keywords[ 'cubeUV_TL' ] = this.colorSpaceTLExp;
  174. output.keywords[ 'cubeUV_TR' ] = this.colorSpaceTRExp;
  175. output.keywords[ 'cubeUV_BL' ] = this.colorSpaceBLExp;
  176. output.keywords[ 'cubeUV_BR' ] = this.colorSpaceBRExp;
  177. output.keywords[ 'cubeUV' ] = bilinearCubeUV;
  178. return output;
  179. };
  180. TextureCubeUVNode.prototype.generate = function ( builder, output ) {
  181. if ( builder.isShader( 'fragment' ) ) {
  182. var uv = this.uv;
  183. var bias = this.bias || builder.context.roughness;
  184. var mipV = new FunctionCallNode( TextureCubeUVNode.Nodes.roughnessToMip, [ bias ] );
  185. var mip = new MathNode( mipV, TextureCubeUVNode.Nodes.m0, TextureCubeUVNode.Nodes.cubeUV_maxMipLevel, MathNode.CLAMP );
  186. var mipInt = new MathNode( mip, MathNode.FLOOR );
  187. var mipF = new MathNode( mip, MathNode.FRACT );
  188. var color0 = this.bilinearCubeUV( builder, this.value, uv, mipInt );
  189. var color1 = this.bilinearCubeUV( builder, this.value, uv, new OperatorNode(
  190. mipInt,
  191. new FloatNode( 1 ).setReadonly( true ),
  192. OperatorNode.ADD
  193. ) );
  194. var color1Mix = new MathNode( color0, color1, mipF, MathNode.MIX );
  195. /*
  196. // TODO: Optimize this in the future
  197. var cond = new CondNode(
  198. mipF,
  199. new FloatNode( 0 ).setReadonly( true ),
  200. CondNode.EQUAL,
  201. color0, // if
  202. color1Mix // else
  203. );
  204. */
  205. return builder.format( color1Mix.build( builder ), 'v4', output );
  206. } else {
  207. console.warn( 'THREE.TextureCubeUVNode is not compatible with ' + builder.shader + ' shader.' );
  208. return builder.format( 'vec4( 0.0 )', this.getType( builder ), output );
  209. }
  210. };
  211. TextureCubeUVNode.prototype.toJSON = function ( meta ) {
  212. var data = this.getJSONNode( meta );
  213. if ( ! data ) {
  214. data = this.createJSONNode( meta );
  215. data.value = this.value.toJSON( meta ).uuid;
  216. data.uv = this.uv.toJSON( meta ).uuid;
  217. data.bias = this.bias.toJSON( meta ).uuid;
  218. }
  219. return data;
  220. };
  221. export { TextureCubeUVNode };