MaterialNode.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
  1. import Node, { addNodeClass } from '../core/Node.js';
  2. import { reference } from './ReferenceNode.js';
  3. import { materialReference } from './MaterialReferenceNode.js';
  4. import { normalView } from './NormalNode.js';
  5. import { nodeImmutable, float, vec2, mat2 } from '../shadernode/ShaderNode.js';
  6. import { uniform } from '../core/UniformNode.js';
  7. import { Vector2 } from 'three';
  8. const _propertyCache = new Map();
  9. class MaterialNode extends Node {
  10. constructor( scope ) {
  11. super();
  12. this.scope = scope;
  13. }
  14. getCache( property, type ) {
  15. let node = _propertyCache.get( property );
  16. if ( node === undefined ) {
  17. node = materialReference( property, type );
  18. _propertyCache.set( property, node );
  19. }
  20. return node;
  21. }
  22. getFloat( property ) {
  23. return this.getCache( property, 'float' );
  24. }
  25. getColor( property ) {
  26. return this.getCache( property, 'color' );
  27. }
  28. getTexture( property ) {
  29. return this.getCache( property === 'map' ? 'map' : property + 'Map', 'texture' );
  30. }
  31. setup( builder ) {
  32. const material = builder.context.material;
  33. const scope = this.scope;
  34. let node = null;
  35. if ( scope === MaterialNode.COLOR ) {
  36. const colorNode = this.getColor( scope );
  37. if ( material.map && material.map.isTexture === true ) {
  38. node = colorNode.mul( this.getTexture( 'map' ) );
  39. } else {
  40. node = colorNode;
  41. }
  42. } else if ( scope === MaterialNode.OPACITY ) {
  43. const opacityNode = this.getFloat( scope );
  44. if ( material.alphaMap && material.alphaMap.isTexture === true ) {
  45. node = opacityNode.mul( this.getTexture( 'alpha' ) );
  46. } else {
  47. node = opacityNode;
  48. }
  49. } else if ( scope === MaterialNode.SPECULAR_STRENGTH ) {
  50. if ( material.specularMap && material.specularMap.isTexture === true ) {
  51. node = this.getTexture( 'specular' ).r;
  52. } else {
  53. node = float( 1 );
  54. }
  55. } else if ( scope === MaterialNode.SPECULAR_INTENSITY ) {
  56. const specularIntensity = this.getFloat( scope );
  57. if ( material.specularMap ) {
  58. node = specularIntensity.mul( this.getTexture( scope ).a );
  59. } else {
  60. node = specularIntensity;
  61. }
  62. } else if ( scope === MaterialNode.SPECULAR_COLOR ) {
  63. const specularColorNode = this.getColor( scope );
  64. if ( material.specularColorMap && material.specularColorMap.isTexture === true ) {
  65. node = specularColorNode.mul( this.getTexture( scope ).rgb );
  66. } else {
  67. node = specularColorNode;
  68. }
  69. } else if ( scope === MaterialNode.ROUGHNESS ) { // TODO: cleanup similar branches
  70. const roughnessNode = this.getFloat( scope );
  71. if ( material.roughnessMap && material.roughnessMap.isTexture === true ) {
  72. node = roughnessNode.mul( this.getTexture( scope ).g );
  73. } else {
  74. node = roughnessNode;
  75. }
  76. } else if ( scope === MaterialNode.METALNESS ) {
  77. const metalnessNode = this.getFloat( scope );
  78. if ( material.metalnessMap && material.metalnessMap.isTexture === true ) {
  79. node = metalnessNode.mul( this.getTexture( scope ).b );
  80. } else {
  81. node = metalnessNode;
  82. }
  83. } else if ( scope === MaterialNode.EMISSIVE ) {
  84. const emissiveNode = this.getColor( scope );
  85. if ( material.emissiveMap && material.emissiveMap.isTexture === true ) {
  86. node = emissiveNode.mul( this.getTexture( scope ) );
  87. } else {
  88. node = emissiveNode;
  89. }
  90. } else if ( scope === MaterialNode.NORMAL ) {
  91. if ( material.normalMap ) {
  92. node = this.getTexture( 'normal' ).normalMap( this.getCache( 'normalScale', 'vec2' ) );
  93. } else if ( material.bumpMap ) {
  94. node = this.getTexture( 'bump' ).r.bumpMap( this.getFloat( 'bumpScale' ) );
  95. } else {
  96. node = normalView;
  97. }
  98. } else if ( scope === MaterialNode.CLEARCOAT ) {
  99. const clearcoatNode = this.getFloat( scope );
  100. if ( material.clearcoatMap && material.clearcoatMap.isTexture === true ) {
  101. node = clearcoatNode.mul( this.getTexture( scope ).r );
  102. } else {
  103. node = clearcoatNode;
  104. }
  105. } else if ( scope === MaterialNode.CLEARCOAT_ROUGHNESS ) {
  106. const clearcoatRoughnessNode = this.getFloat( scope );
  107. if ( material.clearcoatRoughnessMap && material.clearcoatRoughnessMap.isTexture === true ) {
  108. node = clearcoatRoughnessNode.mul( this.getTexture( scope ).r );
  109. } else {
  110. node = clearcoatRoughnessNode;
  111. }
  112. } else if ( scope === MaterialNode.CLEARCOAT_NORMAL ) {
  113. if ( material.clearcoatNormalMap ) {
  114. node = this.getTexture( scope ).normalMap( this.getCache( scope + 'Scale', 'vec2' ) );
  115. } else {
  116. node = normalView;
  117. }
  118. } else if ( scope === MaterialNode.SHEEN ) {
  119. const sheenNode = this.getColor( 'sheenColor' ).mul( this.getFloat( 'sheen' ) ); // Move this mul() to CPU
  120. if ( material.sheenColorMap && material.sheenColorMap.isTexture === true ) {
  121. node = sheenNode.mul( this.getTexture( 'sheenColor' ).rgb );
  122. } else {
  123. node = sheenNode;
  124. }
  125. } else if ( scope === MaterialNode.SHEEN_ROUGHNESS ) {
  126. const sheenRoughnessNode = this.getFloat( scope );
  127. if ( material.sheenRoughnessMap && material.sheenRoughnessMap.isTexture === true ) {
  128. node = sheenRoughnessNode.mul( this.getTexture( scope ).a );
  129. } else {
  130. node = sheenRoughnessNode;
  131. }
  132. node = node.clamp( 0.07, 1.0 );
  133. } else if ( scope === MaterialNode.ANISOTROPY ) {
  134. if ( material.anisotropyMap && material.anisotropyMap.isTexture === true ) {
  135. const anisotropyPolar = this.getTexture( scope );
  136. const anisotropyMat = mat2( materialAnisotropyVector.x, materialAnisotropyVector.y, materialAnisotropyVector.y.negate(), materialAnisotropyVector.x );
  137. node = anisotropyMat.mul( anisotropyPolar.rg.mul( 2.0 ).sub( vec2( 1.0 ) ).normalize().mul( anisotropyPolar.b ) );
  138. } else {
  139. node = materialAnisotropyVector;
  140. }
  141. } else if ( scope === MaterialNode.IRIDESCENCE_THICKNESS ) {
  142. const iridescenceThicknessMaximum = reference( '1', 'float', material.iridescenceThicknessRange );
  143. if ( material.iridescenceThicknessMap ) {
  144. const iridescenceThicknessMinimum = reference( '0', 'float', material.iridescenceThicknessRange );
  145. node = iridescenceThicknessMaximum.sub( iridescenceThicknessMinimum ).mul( this.getTexture( scope ).g ).add( iridescenceThicknessMinimum );
  146. } else {
  147. node = iridescenceThicknessMaximum;
  148. }
  149. } else if ( scope === MaterialNode.TRANSMISSION ) {
  150. const transmissionNode = this.getFloat( scope );
  151. if ( material.transmissionMap ) {
  152. node = transmissionNode.mul( this.getTexture( scope ).r );
  153. } else {
  154. node = transmissionNode;
  155. }
  156. } else if ( scope === MaterialNode.THICKNESS ) {
  157. const thicknessNode = this.getFloat( scope );
  158. if ( material.thicknessMap ) {
  159. node = thicknessNode.mul( this.getTexture( scope ).g );
  160. } else {
  161. node = thicknessNode;
  162. }
  163. } else if ( scope === MaterialNode.IOR ) {
  164. node = this.getFloat( scope );
  165. } else {
  166. const outputType = this.getNodeType( builder );
  167. node = this.getCache( scope, outputType );
  168. }
  169. return node;
  170. }
  171. }
  172. MaterialNode.ALPHA_TEST = 'alphaTest';
  173. MaterialNode.COLOR = 'color';
  174. MaterialNode.OPACITY = 'opacity';
  175. MaterialNode.SHININESS = 'shininess';
  176. MaterialNode.SPECULAR = 'specular';
  177. MaterialNode.SPECULAR_STRENGTH = 'specularStrength';
  178. MaterialNode.SPECULAR_INTENSITY = 'specularIntensity';
  179. MaterialNode.SPECULAR_COLOR = 'specularColor';
  180. MaterialNode.REFLECTIVITY = 'reflectivity';
  181. MaterialNode.ROUGHNESS = 'roughness';
  182. MaterialNode.METALNESS = 'metalness';
  183. MaterialNode.NORMAL = 'normal';
  184. MaterialNode.CLEARCOAT = 'clearcoat';
  185. MaterialNode.CLEARCOAT_ROUGHNESS = 'clearcoatRoughness';
  186. MaterialNode.CLEARCOAT_NORMAL = 'clearcoatNormal';
  187. MaterialNode.EMISSIVE = 'emissive';
  188. MaterialNode.ROTATION = 'rotation';
  189. MaterialNode.SHEEN = 'sheen';
  190. MaterialNode.SHEEN_ROUGHNESS = 'sheenRoughness';
  191. MaterialNode.ANISOTROPY = 'anisotropy';
  192. MaterialNode.IRIDESCENCE = 'iridescence';
  193. MaterialNode.IRIDESCENCE_IOR = 'iridescenceIOR';
  194. MaterialNode.IRIDESCENCE_THICKNESS = 'iridescenceThickness';
  195. MaterialNode.IOR = 'ior';
  196. MaterialNode.TRANSMISSION = 'transmission';
  197. MaterialNode.THICKNESS = 'thickness';
  198. MaterialNode.ATTENUATION_DISTANCE = 'attenuationDistance';
  199. MaterialNode.ATTENUATION_COLOR = 'attenuationColor';
  200. MaterialNode.LINE_SCALE = 'scale';
  201. MaterialNode.LINE_DASH_SIZE = 'dashSize';
  202. MaterialNode.LINE_GAP_SIZE = 'gapSize';
  203. MaterialNode.LINE_WIDTH = 'linewidth';
  204. MaterialNode.LINE_DASH_OFFSET = 'dashOffset';
  205. MaterialNode.POINT_WIDTH = 'pointWidth';
  206. MaterialNode.DISPERSION = 'dispersion';
  207. export default MaterialNode;
  208. export const materialAlphaTest = nodeImmutable( MaterialNode, MaterialNode.ALPHA_TEST );
  209. export const materialColor = nodeImmutable( MaterialNode, MaterialNode.COLOR );
  210. export const materialShininess = nodeImmutable( MaterialNode, MaterialNode.SHININESS );
  211. export const materialEmissive = nodeImmutable( MaterialNode, MaterialNode.EMISSIVE );
  212. export const materialOpacity = nodeImmutable( MaterialNode, MaterialNode.OPACITY );
  213. export const materialSpecular = nodeImmutable( MaterialNode, MaterialNode.SPECULAR );
  214. export const materialSpecularIntensity = nodeImmutable( MaterialNode, MaterialNode.SPECULAR_INTENSITY );
  215. export const materialSpecularColor = nodeImmutable( MaterialNode, MaterialNode.SPECULAR_COLOR );
  216. export const materialSpecularStrength = nodeImmutable( MaterialNode, MaterialNode.SPECULAR_STRENGTH );
  217. export const materialReflectivity = nodeImmutable( MaterialNode, MaterialNode.REFLECTIVITY );
  218. export const materialRoughness = nodeImmutable( MaterialNode, MaterialNode.ROUGHNESS );
  219. export const materialMetalness = nodeImmutable( MaterialNode, MaterialNode.METALNESS );
  220. export const materialNormal = nodeImmutable( MaterialNode, MaterialNode.NORMAL );
  221. export const materialClearcoat = nodeImmutable( MaterialNode, MaterialNode.CLEARCOAT );
  222. export const materialClearcoatRoughness = nodeImmutable( MaterialNode, MaterialNode.CLEARCOAT_ROUGHNESS );
  223. export const materialClearcoatNormal = nodeImmutable( MaterialNode, MaterialNode.CLEARCOAT_NORMAL );
  224. export const materialRotation = nodeImmutable( MaterialNode, MaterialNode.ROTATION );
  225. export const materialSheen = nodeImmutable( MaterialNode, MaterialNode.SHEEN );
  226. export const materialSheenRoughness = nodeImmutable( MaterialNode, MaterialNode.SHEEN_ROUGHNESS );
  227. export const materialAnisotropy = nodeImmutable( MaterialNode, MaterialNode.ANISOTROPY );
  228. export const materialIridescence = nodeImmutable( MaterialNode, MaterialNode.IRIDESCENCE );
  229. export const materialIridescenceIOR = nodeImmutable( MaterialNode, MaterialNode.IRIDESCENCE_IOR );
  230. export const materialIridescenceThickness = nodeImmutable( MaterialNode, MaterialNode.IRIDESCENCE_THICKNESS );
  231. export const materialTransmission = nodeImmutable( MaterialNode, MaterialNode.TRANSMISSION );
  232. export const materialThickness = nodeImmutable( MaterialNode, MaterialNode.THICKNESS );
  233. export const materialIOR = nodeImmutable( MaterialNode, MaterialNode.IOR );
  234. export const materialAttenuationDistance = nodeImmutable( MaterialNode, MaterialNode.ATTENUATION_DISTANCE );
  235. export const materialAttenuationColor = nodeImmutable( MaterialNode, MaterialNode.ATTENUATION_COLOR );
  236. export const materialLineScale = nodeImmutable( MaterialNode, MaterialNode.LINE_SCALE );
  237. export const materialLineDashSize = nodeImmutable( MaterialNode, MaterialNode.LINE_DASH_SIZE );
  238. export const materialLineGapSize = nodeImmutable( MaterialNode, MaterialNode.LINE_GAP_SIZE );
  239. export const materialLineWidth = nodeImmutable( MaterialNode, MaterialNode.LINE_WIDTH );
  240. export const materialLineDashOffset = nodeImmutable( MaterialNode, MaterialNode.LINE_DASH_OFFSET );
  241. export const materialPointWidth = nodeImmutable( MaterialNode, MaterialNode.POINT_WIDTH );
  242. export const materialDispersion = nodeImmutable( MaterialNode, MaterialNode.DISPERSION );
  243. export const materialAnisotropyVector = uniform( new Vector2() ).onReference( function ( frame ) {
  244. return frame.material;
  245. } ).onRenderUpdate( function ( { material } ) {
  246. this.value.set( material.anisotropy * Math.cos( material.anisotropyRotation ), material.anisotropy * Math.sin( material.anisotropyRotation ) );
  247. } );
  248. addNodeClass( 'MaterialNode', MaterialNode );