2
0

GLSLNodeBuilder.js 11 KB

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