GLSLNodeBuilder.js 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527
  1. import { MathNode, GLSLNodeParser, NodeBuilder, NodeMaterial } from '../../../nodes/Nodes.js';
  2. import UniformsGroup from '../../common/UniformsGroup.js';
  3. import { NodeSampledTexture, NodeSampledCubeTexture } from '../../common/nodes/NodeSampledTexture.js';
  4. const glslMethods = {
  5. [ MathNode.ATAN2 ]: 'atan',
  6. textureDimensions: 'textureSize'
  7. };
  8. const precisionLib = {
  9. low: 'lowp',
  10. medium: 'mediump',
  11. high: 'highp'
  12. };
  13. class GLSLNodeBuilder extends NodeBuilder {
  14. constructor( object, renderer, scene = null ) {
  15. super( object, renderer, new GLSLNodeParser(), scene );
  16. this.uniformsGroup = {};
  17. }
  18. getMethod( method ) {
  19. return glslMethods[ method ] || method;
  20. }
  21. getPropertyName( node, shaderStage ) {
  22. if ( node.isOutputStructVar ) return '';
  23. return super.getPropertyName( node, shaderStage );
  24. }
  25. getTexture( texture, textureProperty, uvSnippet ) {
  26. if ( texture.isTextureCube ) {
  27. return `textureCube( ${textureProperty}, ${uvSnippet} )`;
  28. } else if ( texture.isDepthTexture ) {
  29. return `texture( ${textureProperty}, ${uvSnippet} ).x`;
  30. } else {
  31. return `texture( ${textureProperty}, ${uvSnippet} )`;
  32. }
  33. }
  34. getTextureLevel( texture, textureProperty, uvSnippet, biasSnippet ) {
  35. return `textureLod( ${textureProperty}, ${uvSnippet}, ${biasSnippet} )`;
  36. }
  37. getTextureCompare( texture, textureProperty, uvSnippet, compareSnippet, shaderStage = this.shaderStage ) {
  38. if ( shaderStage === 'fragment' ) {
  39. return `texture( ${textureProperty}, vec3( ${uvSnippet}, ${compareSnippet} ) )`;
  40. } else {
  41. console.error( `WebGPURenderer: THREE.DepthTexture.compareFunction() does not support ${ shaderStage } shader.` );
  42. }
  43. }
  44. getVars( shaderStage ) {
  45. const snippets = [];
  46. const vars = this.vars[ shaderStage ];
  47. for ( const variable of vars ) {
  48. if ( variable.isOutputStructVar ) continue;
  49. snippets.push( `${ this.getVar( variable.type, variable.name ) };` );
  50. }
  51. return snippets.join( '\n\t' );
  52. }
  53. getUniforms( shaderStage ) {
  54. const uniforms = this.uniforms[ shaderStage ];
  55. const bindingSnippets = [];
  56. const groupSnippets = [];
  57. for ( const uniform of uniforms ) {
  58. let snippet = null;
  59. let group = false;
  60. if ( uniform.type === 'texture' ) {
  61. if ( uniform.node.value.compareFunction ) {
  62. snippet = `sampler2DShadow ${uniform.name};`;
  63. } else {
  64. snippet = `sampler2D ${uniform.name};`;
  65. }
  66. } else if ( uniform.type === 'cubeTexture' ) {
  67. snippet = `samplerCube ${uniform.name};`;
  68. } else {
  69. const vectorType = this.getVectorType( uniform.type );
  70. snippet = `${vectorType} ${uniform.name};`;
  71. group = true;
  72. }
  73. const precision = uniform.node.precision;
  74. if ( precision !== null ) {
  75. snippet = precisionLib[ precision ] + ' ' + snippet;
  76. }
  77. if ( group ) {
  78. snippet = '\t' + snippet;
  79. groupSnippets.push( snippet );
  80. } else {
  81. snippet = 'uniform ' + snippet;
  82. bindingSnippets.push( snippet );
  83. }
  84. }
  85. let output = '';
  86. if ( groupSnippets.length > 0 ) {
  87. output += this._getGLSLUniformStruct( shaderStage + 'NodeUniforms', groupSnippets.join( '\n' ) ) + '\n';
  88. }
  89. output += bindingSnippets.join( '\n' );
  90. return output;
  91. }
  92. getAttributes( shaderStage ) {
  93. let snippet = '';
  94. if ( shaderStage === 'vertex' ) {
  95. const attributes = this.attributes;
  96. let location = 0;
  97. for ( const attribute of attributes ) {
  98. snippet += `layout( location = ${ location ++ } ) in ${ attribute.type } ${ attribute.name };\n`;
  99. }
  100. }
  101. return snippet;
  102. }
  103. getStructMembers( struct ) {
  104. const snippets = [];
  105. const members = struct.getMemberTypes();
  106. for ( let i = 0; i < members.length; i ++ ) {
  107. const member = members[ i ];
  108. snippets.push( `layout( location = ${i} ) out ${ member} m${i};` );
  109. }
  110. return snippets.join( '\n' );
  111. }
  112. getStructs( shaderStage ) {
  113. const snippets = [];
  114. const structs = this.structs[ shaderStage ];
  115. if ( structs.length === 0 ) {
  116. return "layout( location = 0 ) out vec4 fragColor;\n";
  117. }
  118. for ( let index = 0, length = structs.length; index < length; index ++ ) {
  119. const struct = structs[ index ];
  120. let snippet = `\n`;
  121. snippet += this.getStructMembers( struct );
  122. snippet += '\n';
  123. snippets.push( snippet );
  124. }
  125. return snippets.join( '\n\n' );
  126. }
  127. getVaryings( shaderStage ) {
  128. let snippet = '';
  129. const varyings = this.varyings;
  130. if ( shaderStage === 'vertex' ) {
  131. for ( const varying of varyings ) {
  132. snippet += `${varying.needsInterpolation ? 'out' : '/*out*/'} ${varying.type} ${varying.name};\n`;
  133. }
  134. } else if ( shaderStage === 'fragment' ) {
  135. for ( const varying of varyings ) {
  136. if ( varying.needsInterpolation ) {
  137. snippet += `in ${varying.type} ${varying.name};\n`;
  138. }
  139. }
  140. }
  141. return snippet;
  142. }
  143. getVertexIndex() {
  144. return 'gl_VertexID';
  145. }
  146. getFrontFacing() {
  147. return 'gl_FrontFacing';
  148. }
  149. getFragCoord() {
  150. return 'gl_FragCoord';
  151. }
  152. isFlipY() {
  153. return true;
  154. }
  155. _getGLSLUniformStruct( name, vars ) {
  156. return `
  157. layout( std140 ) uniform ${name} {
  158. ${vars}
  159. };`;
  160. }
  161. _getGLSLVertexCode( shaderData ) {
  162. return `#version 300 es
  163. ${ this.getSignature() }
  164. // precision
  165. precision highp float;
  166. precision highp int;
  167. // uniforms
  168. ${shaderData.uniforms}
  169. // varyings
  170. ${shaderData.varyings}
  171. // attributes
  172. ${shaderData.attributes}
  173. // codes
  174. ${shaderData.codes}
  175. void main() {
  176. // vars
  177. ${shaderData.vars}
  178. // flow
  179. ${shaderData.flow}
  180. gl_PointSize = 1.0;
  181. }
  182. `;
  183. }
  184. _getGLSLFragmentCode( shaderData ) {
  185. return `#version 300 es
  186. ${ this.getSignature() }
  187. // precision
  188. precision highp float;
  189. precision highp int;
  190. precision lowp sampler2DShadow;
  191. // uniforms
  192. ${shaderData.uniforms}
  193. // varyings
  194. ${shaderData.varyings}
  195. // codes
  196. ${shaderData.codes}
  197. ${shaderData.structs}
  198. void main() {
  199. // vars
  200. ${shaderData.vars}
  201. // flow
  202. ${shaderData.flow}
  203. }
  204. `;
  205. }
  206. buildCode() {
  207. const shadersData = this.material !== null ? { fragment: {}, vertex: {} } : { compute: {} };
  208. for ( const shaderStage in shadersData ) {
  209. let flow = '// code\n\n';
  210. flow += this.flowCode[ shaderStage ];
  211. const flowNodes = this.flowNodes[ shaderStage ];
  212. const mainNode = flowNodes[ flowNodes.length - 1 ];
  213. for ( const node of flowNodes ) {
  214. const flowSlotData = this.getFlowData( node/*, shaderStage*/ );
  215. const slotName = node.name;
  216. if ( slotName ) {
  217. if ( flow.length > 0 ) flow += '\n';
  218. flow += `\t// flow -> ${ slotName }\n\t`;
  219. }
  220. flow += `${ flowSlotData.code }\n\t`;
  221. if ( node === mainNode && shaderStage !== 'compute' ) {
  222. flow += '// result\n\t';
  223. if ( shaderStage === 'vertex' ) {
  224. flow += 'gl_Position = ';
  225. flow += `${ flowSlotData.result };`;
  226. } else if ( shaderStage === 'fragment' ) {
  227. if ( ! node.outputNode.isOutputStructNode ) {
  228. flow += 'fragColor = ';
  229. flow += `${ flowSlotData.result };`;
  230. }
  231. }
  232. }
  233. }
  234. const stageData = shadersData[ shaderStage ];
  235. stageData.uniforms = this.getUniforms( shaderStage );
  236. stageData.attributes = this.getAttributes( shaderStage );
  237. stageData.varyings = this.getVaryings( shaderStage );
  238. stageData.vars = this.getVars( shaderStage );
  239. stageData.structs = this.getStructs( shaderStage );
  240. stageData.codes = this.getCodes( shaderStage );
  241. stageData.flow = flow;
  242. }
  243. if ( this.material !== null ) {
  244. this.vertexShader = this._getGLSLVertexCode( shadersData.vertex );
  245. this.fragmentShader = this._getGLSLFragmentCode( shadersData.fragment );
  246. //console.log( this.vertexShader );
  247. //console.log( this.fragmentShader );
  248. } else {
  249. console.warn( 'GLSLNodeBuilder: compute shaders are not supported.' );
  250. //this.computeShader = this._getGLSLComputeCode( shadersData.compute );
  251. }
  252. }
  253. getUniformFromNode( node, type, shaderStage, name = null ) {
  254. const uniformNode = super.getUniformFromNode( node, type, shaderStage, name );
  255. const nodeData = this.getDataFromNode( node, shaderStage );
  256. let uniformGPU = nodeData.uniformGPU;
  257. if ( uniformGPU === undefined ) {
  258. if ( type === 'texture' ) {
  259. uniformGPU = new NodeSampledTexture( uniformNode.name, uniformNode.node );
  260. this.bindings[ shaderStage ].push( uniformGPU );
  261. } else if ( type === 'cubeTexture' ) {
  262. uniformGPU = new NodeSampledCubeTexture( uniformNode.name, uniformNode.node );
  263. this.bindings[ shaderStage ].push( uniformGPU );
  264. } else {
  265. let uniformsGroup = this.uniformsGroup[ shaderStage ];
  266. if ( uniformsGroup === undefined ) {
  267. uniformsGroup = new UniformsGroup( shaderStage + 'NodeUniforms' );
  268. //uniformsGroup.setVisibility( gpuShaderStageLib[ shaderStage ] );
  269. this.uniformsGroup[ shaderStage ] = uniformsGroup;
  270. this.bindings[ shaderStage ].push( uniformsGroup );
  271. }
  272. uniformGPU = this.getNodeUniform( uniformNode, type );
  273. uniformsGroup.addUniform( uniformGPU );
  274. }
  275. nodeData.uniformGPU = uniformGPU;
  276. }
  277. return uniformNode;
  278. }
  279. build() {
  280. // @TODO: Move this code to super.build()
  281. const { object, material } = this;
  282. if ( material !== null ) {
  283. NodeMaterial.fromMaterial( material ).build( this );
  284. } else {
  285. this.addFlow( 'compute', object );
  286. }
  287. return super.build();
  288. }
  289. }
  290. export default GLSLNodeBuilder;