WebGPUNodeBuilder.js 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913
  1. import { LinearEncoding } from 'three';
  2. import WebGPUNodeUniformsGroup from './WebGPUNodeUniformsGroup.js';
  3. import {
  4. FloatNodeUniform, Vector2NodeUniform, Vector3NodeUniform, Vector4NodeUniform,
  5. ColorNodeUniform, Matrix3NodeUniform, Matrix4NodeUniform
  6. } from './WebGPUNodeUniform.js';
  7. import WebGPUNodeSampler from './WebGPUNodeSampler.js';
  8. import { WebGPUNodeSampledTexture, WebGPUNodeSampledCubeTexture } from './WebGPUNodeSampledTexture.js';
  9. import WebGPUUniformBuffer from '../WebGPUUniformBuffer.js';
  10. import { getVectorLength, getStrideLength } from '../WebGPUBufferUtils.js';
  11. import VarNode from 'three-nodes/core/VarNode.js';
  12. import CodeNode from 'three-nodes/core/CodeNode.js';
  13. import BypassNode from 'three-nodes/core/BypassNode.js';
  14. import ExpressionNode from 'three-nodes/core/ExpressionNode.js';
  15. import NodeBuilder from 'three-nodes/core/NodeBuilder.js';
  16. import MaterialNode from 'three-nodes/accessors/MaterialNode.js';
  17. import PositionNode from 'three-nodes/accessors/PositionNode.js';
  18. import NormalNode from 'three-nodes/accessors/NormalNode.js';
  19. import ModelViewProjectionNode from 'three-nodes/accessors/ModelViewProjectionNode.js';
  20. import SkinningNode from 'three-nodes/accessors/SkinningNode.js';
  21. import ColorSpaceNode from 'three-nodes/display/ColorSpaceNode.js';
  22. import LightContextNode from 'three-nodes/lights/LightContextNode.js';
  23. import OperatorNode from 'three-nodes/math/OperatorNode.js';
  24. import WGSLNodeParser from 'three-nodes/parsers/WGSLNodeParser.js';
  25. import { vec3, add, join, mix, nodeObject } from 'three-nodes/ShaderNode.js';
  26. import { getRoughness } from 'three-nodes/functions/PhysicalMaterialFunctions.js';
  27. const wgslTypeLib = {
  28. float: 'f32',
  29. int: 'i32',
  30. uint: 'u32',
  31. bool: 'bool',
  32. vec2: 'vec2<f32>',
  33. ivec2: 'vec2<i32>',
  34. uvec2: 'vec2<u32>',
  35. bvec2: 'vec2<bool>',
  36. vec3: 'vec3<f32>',
  37. ivec3: 'vec3<i32>',
  38. uvec3: 'vec3<u32>',
  39. bvec3: 'vec3<bool>',
  40. vec4: 'vec4<f32>',
  41. ivec4: 'vec4<i32>',
  42. uvec4: 'vec4<u32>',
  43. bvec4: 'vec4<bool>',
  44. mat3: 'mat3x3<f32>',
  45. imat3: 'mat3x3<i32>',
  46. umat3: 'mat3x3<u32>',
  47. bmat3: 'mat3x3<bool>',
  48. mat4: 'mat4x4<f32>',
  49. imat4: 'mat4x4<i32>',
  50. umat4: 'mat4x4<u32>',
  51. bmat4: 'mat4x4<bool>'
  52. };
  53. const wgslMethods = {
  54. dFdx: 'dpdx',
  55. dFdy: 'dpdy'
  56. };
  57. const wgslPolyfill = {
  58. lessThanEqual: new CodeNode( `
  59. fn lessThanEqual( a : vec3<f32>, b : vec3<f32> ) -> vec3<bool> {
  60. return vec3<bool>( a.x <= b.x, a.y <= b.y, a.z <= b.z );
  61. }
  62. ` ),
  63. mod: new CodeNode( `
  64. fn mod( x : f32, y : f32 ) -> f32 {
  65. return x - y * floor( x / y );
  66. }
  67. ` ),
  68. smoothstep: new CodeNode( `
  69. fn smoothstep( low : f32, high : f32, x : f32 ) -> f32 {
  70. let t = clamp( ( x - low ) / ( high - low ), 0.0, 1.0 );
  71. return t * t * ( 3.0 - 2.0 * t );
  72. }
  73. ` ),
  74. repeatWrapping: new CodeNode( `
  75. fn repeatWrapping( uv : vec2<f32>, dimension : vec2<i32> ) -> vec2<i32> {
  76. let uvScaled = vec2<i32>( uv * vec2<f32>( dimension ) );
  77. return ( ( uvScaled % dimension ) + dimension ) % dimension;
  78. }
  79. ` ),
  80. inversesqrt: new CodeNode( `
  81. fn inversesqrt( x : f32 ) -> f32 {
  82. return 1.0 / sqrt( x );
  83. }
  84. ` )
  85. };
  86. class WebGPUNodeBuilder extends NodeBuilder {
  87. constructor( object, renderer ) {
  88. super( object, renderer, new WGSLNodeParser() );
  89. this.lightNode = null;
  90. this.fogNode = null;
  91. this.bindings = { vertex: [], fragment: [] };
  92. this.bindingsOffset = { vertex: 0, fragment: 0 };
  93. this.uniformsGroup = {};
  94. }
  95. build() {
  96. this._parseObject();
  97. return super.build();
  98. }
  99. _parseObject() {
  100. const object = this.object;
  101. const material = this.material;
  102. // parse inputs
  103. if ( material.isMeshStandardMaterial || material.isMeshBasicMaterial || material.isPointsMaterial || material.isLineBasicMaterial ) {
  104. let lightNode = material.lightNode;
  105. if ( material.isMeshStandardMaterial && lightNode === null && this.lightNode ) {
  106. // use scene lights
  107. lightNode = this.lightNode;
  108. }
  109. // VERTEX STAGE
  110. let vertex = new PositionNode( PositionNode.GEOMETRY );
  111. if ( material.positionNode && material.positionNode.isNode ) {
  112. const assignPositionNode = new OperatorNode( '=', new PositionNode( PositionNode.LOCAL ), material.positionNode );
  113. vertex = new BypassNode( vertex, assignPositionNode );
  114. }
  115. if ( object.isSkinnedMesh === true ) {
  116. vertex = new BypassNode( vertex, new SkinningNode( object ) );
  117. }
  118. this.context.vertex = vertex;
  119. this.addFlow( 'vertex', new VarNode( new ModelViewProjectionNode(), 'MVP', 'vec4' ) );
  120. // COLOR
  121. let colorNode = null;
  122. if ( material.colorNode && material.colorNode.isNode ) {
  123. colorNode = material.colorNode;
  124. } else {
  125. colorNode = new MaterialNode( MaterialNode.COLOR );
  126. }
  127. colorNode = this.addFlow( 'fragment', new VarNode( colorNode, 'Color', 'vec4' ) );
  128. const diffuseColorNode = this.addFlow( 'fragment', new VarNode( colorNode, 'DiffuseColor', 'vec4' ) );
  129. // OPACITY
  130. let opacityNode = null;
  131. if ( material.opacityNode && material.opacityNode.isNode ) {
  132. opacityNode = material.opacityNode;
  133. } else {
  134. opacityNode = new VarNode( new MaterialNode( MaterialNode.OPACITY ) );
  135. }
  136. this.addFlow( 'fragment', new VarNode( opacityNode, 'OPACITY', 'float' ) );
  137. this.addFlow( 'fragment', new ExpressionNode( 'DiffuseColor.a = DiffuseColor.a * OPACITY;' ) );
  138. // ALPHA TEST
  139. let alphaTest = null;
  140. if ( material.alphaTestNode && material.alphaTestNode.isNode ) {
  141. alphaTest = material.alphaTestNode;
  142. } else if ( material.alphaTest > 0 ) {
  143. alphaTest = new MaterialNode( MaterialNode.ALPHA_TEST );
  144. }
  145. if ( alphaTest !== null ) {
  146. this.addFlow( 'fragment', new VarNode( alphaTest, 'AlphaTest', 'float' ) );
  147. this.addFlow( 'fragment', new ExpressionNode( 'if ( DiffuseColor.a <= AlphaTest ) { discard; }' ) );
  148. }
  149. if ( material.isMeshStandardMaterial ) {
  150. // METALNESS
  151. let metalnessNode = null;
  152. if ( material.metalnessNode && material.metalnessNode.isNode ) {
  153. metalnessNode = material.metalnessNode;
  154. } else {
  155. metalnessNode = new MaterialNode( MaterialNode.METALNESS );
  156. }
  157. this.addFlow( 'fragment', new VarNode( metalnessNode, 'Metalness', 'float' ) );
  158. this.addFlow( 'fragment', new ExpressionNode( 'DiffuseColor = vec4<f32>( DiffuseColor.rgb * ( 1.0 - Metalness ), DiffuseColor.a );' ) );
  159. // ROUGHNESS
  160. let roughnessNode = null;
  161. if ( material.roughnessNode && material.roughnessNode.isNode ) {
  162. roughnessNode = material.roughnessNode;
  163. } else {
  164. roughnessNode = new MaterialNode( MaterialNode.ROUGHNESS );
  165. }
  166. roughnessNode = getRoughness( { roughness: roughnessNode } );
  167. this.addFlow( 'fragment', new VarNode( roughnessNode, 'Roughness', 'float' ) );
  168. // SPECULAR_TINT
  169. this.addFlow( 'fragment', new VarNode( new ExpressionNode( 'mix( vec3<f32>( 0.04 ), Color.rgb, Metalness )', 'vec3' ), 'SpecularColor', 'color' ) );
  170. // NORMAL_VIEW
  171. let normalNode = null;
  172. if ( material.normalNode && material.normalNode.isNode ) {
  173. normalNode = material.normalNode;
  174. } else {
  175. normalNode = new NormalNode( NormalNode.VIEW );
  176. }
  177. this.addFlow( 'fragment', new VarNode( normalNode, 'TransformedNormalView', 'vec3' ) );
  178. }
  179. // LIGHT
  180. let outputNode = diffuseColorNode;
  181. if ( lightNode && lightNode.isNode && lightNode.hasLight !== false ) {
  182. const lightContextNode = new LightContextNode( lightNode );
  183. outputNode = this.addFlow( 'fragment', new VarNode( lightContextNode, 'Light', 'vec3' ) );
  184. }
  185. // OUTGOING LIGHT
  186. let outgoingLightNode = vec3( outputNode );
  187. // EMISSIVE
  188. const emissiveNode = material.emissiveNode;
  189. if ( emissiveNode && emissiveNode.isNode ) {
  190. outgoingLightNode = add( emissiveNode, outgoingLightNode );
  191. }
  192. // OUTPUT
  193. outputNode = join( vec3( outgoingLightNode ), nodeObject( diffuseColorNode ).w );
  194. // ENCODING
  195. const outputEncoding = this.renderer.outputEncoding;
  196. if ( outputEncoding !== LinearEncoding ) {
  197. outputNode = new ColorSpaceNode( ColorSpaceNode.LINEAR_TO_LINEAR, outputNode );
  198. outputNode.fromEncoding( outputEncoding );
  199. }
  200. // FOG
  201. const fogNode = this.fogNode;
  202. if ( fogNode && fogNode.isFogNode ) {
  203. outputNode = mix( outputNode, fogNode.colorNode, fogNode );
  204. }
  205. // RESULT
  206. this.addFlow( 'fragment', new VarNode( outputNode, 'Output', 'vec4' ) );
  207. }
  208. }
  209. addFlowCode( code ) {
  210. if ( ! /;\s*$/.test( code ) ) {
  211. code += ';';
  212. }
  213. super.addFlowCode( code + '\n\t' );
  214. }
  215. getSampler( textureProperty, uvSnippet, shaderStage = this.shaderStage ) {
  216. if ( shaderStage === 'fragment' ) {
  217. return `textureSample( ${textureProperty}, ${textureProperty}_sampler, ${uvSnippet} )`;
  218. } else {
  219. this._include( 'repeatWrapping' );
  220. const dimension = `textureDimensions( ${textureProperty}, 0 )`;
  221. return `textureLoad( ${textureProperty}, repeatWrapping( ${uvSnippet}, ${dimension} ), 0 )`;
  222. }
  223. }
  224. getTexture( textureProperty, uvSnippet, shaderStage = this.shaderStage ) {
  225. return this.getSampler( textureProperty, uvSnippet, shaderStage );
  226. }
  227. getCubeTexture( textureProperty, uvSnippet, shaderStage = this.shaderStage ) {
  228. return this.getSampler( textureProperty, uvSnippet, shaderStage );
  229. }
  230. getPropertyName( node, shaderStage = this.shaderStage ) {
  231. if ( node.isNodeVary === true ) {
  232. if ( shaderStage === 'vertex' ) {
  233. return `NodeVarys.${ node.name }`;
  234. }
  235. } else if ( node.isNodeUniform === true ) {
  236. const name = node.name;
  237. const type = node.type;
  238. if ( type === 'texture' || type === 'cubeTexture' ) {
  239. return name;
  240. } else if ( type === 'buffer' ) {
  241. return `NodeBuffer.${name}`;
  242. } else {
  243. return `NodeUniforms.${name}`;
  244. }
  245. }
  246. return super.getPropertyName( node );
  247. }
  248. getBindings() {
  249. const bindings = this.bindings;
  250. return [ ...bindings.vertex, ...bindings.fragment ];
  251. }
  252. getUniformFromNode( node, shaderStage, type ) {
  253. const uniformNode = super.getUniformFromNode( node, shaderStage, type );
  254. const nodeData = this.getDataFromNode( node, shaderStage );
  255. if ( nodeData.uniformGPU === undefined ) {
  256. let uniformGPU;
  257. const bindings = this.bindings[ shaderStage ];
  258. if ( type === 'texture' || type === 'cubeTexture' ) {
  259. const sampler = new WebGPUNodeSampler( `${uniformNode.name}_sampler`, uniformNode.node );
  260. let texture = null;
  261. if ( type === 'texture' ) {
  262. texture = new WebGPUNodeSampledTexture( uniformNode.name, uniformNode.node );
  263. } else if ( type === 'cubeTexture' ) {
  264. texture = new WebGPUNodeSampledCubeTexture( uniformNode.name, uniformNode.node );
  265. }
  266. // add first textures in sequence and group for last
  267. const lastBinding = bindings[ bindings.length - 1 ];
  268. const index = lastBinding && lastBinding.isUniformsGroup ? bindings.length - 1 : bindings.length;
  269. if ( shaderStage === 'fragment' ) {
  270. bindings.splice( index, 0, sampler, texture );
  271. uniformGPU = [ sampler, texture ];
  272. } else {
  273. bindings.splice( index, 0, texture );
  274. uniformGPU = [ texture ];
  275. }
  276. } else if ( type === 'buffer' ) {
  277. const buffer = new WebGPUUniformBuffer( 'NodeBuffer', node.value );
  278. // add first textures in sequence and group for last
  279. const lastBinding = bindings[ bindings.length - 1 ];
  280. const index = lastBinding && lastBinding.isUniformsGroup ? bindings.length - 1 : bindings.length;
  281. bindings.splice( index, 0, buffer );
  282. uniformGPU = buffer;
  283. } else {
  284. let uniformsGroup = this.uniformsGroup[ shaderStage ];
  285. if ( uniformsGroup === undefined ) {
  286. uniformsGroup = new WebGPUNodeUniformsGroup( shaderStage );
  287. this.uniformsGroup[ shaderStage ] = uniformsGroup;
  288. bindings.push( uniformsGroup );
  289. }
  290. if ( node.isArrayUniformNode === true ) {
  291. uniformGPU = [];
  292. for ( const uniformNode of node.nodes ) {
  293. const uniformNodeGPU = this._getNodeUniform( uniformNode, type );
  294. // fit bounds to buffer
  295. uniformNodeGPU.boundary = getVectorLength( uniformNodeGPU.itemSize );
  296. uniformNodeGPU.itemSize = getStrideLength( uniformNodeGPU.itemSize );
  297. uniformsGroup.addUniform( uniformNodeGPU );
  298. uniformGPU.push( uniformNodeGPU );
  299. }
  300. } else {
  301. uniformGPU = this._getNodeUniform( uniformNode, type );
  302. uniformsGroup.addUniform( uniformGPU );
  303. }
  304. }
  305. nodeData.uniformGPU = uniformGPU;
  306. if ( shaderStage === 'vertex' ) {
  307. this.bindingsOffset[ 'fragment' ] = bindings.length;
  308. }
  309. }
  310. return uniformNode;
  311. }
  312. isReference( type ) {
  313. return super.isReference( type ) || type === 'texture_2d' || type === 'texture_cube';
  314. }
  315. getAttributes( shaderStage ) {
  316. let snippet = '';
  317. if ( shaderStage === 'vertex' ) {
  318. const attributes = this.attributes;
  319. const length = attributes.length;
  320. snippet += '\n';
  321. for ( let index = 0; index < length; index ++ ) {
  322. const attribute = attributes[ index ];
  323. const name = attribute.name;
  324. const type = this.getType( attribute.type );
  325. snippet += `\t@location( ${index} ) ${ name } : ${ type }`;
  326. if ( index + 1 < length ) {
  327. snippet += ',\n';
  328. }
  329. }
  330. snippet += '\n';
  331. }
  332. return snippet;
  333. }
  334. getVars( shaderStage ) {
  335. let snippet = '';
  336. const vars = this.vars[ shaderStage ];
  337. for ( let index = 0; index < vars.length; index ++ ) {
  338. const variable = vars[ index ];
  339. const name = variable.name;
  340. const type = this.getType( variable.type );
  341. snippet += `var ${name} : ${type}; `;
  342. }
  343. return snippet;
  344. }
  345. getVarys( shaderStage ) {
  346. let snippet = '';
  347. if ( shaderStage === 'vertex' ) {
  348. snippet += '\t@builtin( position ) Vertex: vec4<f32>;\n';
  349. const varys = this.varys;
  350. for ( let index = 0; index < varys.length; index ++ ) {
  351. const vary = varys[ index ];
  352. snippet += `\t@location( ${index} ) ${ vary.name } : ${ this.getType( vary.type ) };\n`;
  353. }
  354. snippet = this._getWGSLStruct( 'NodeVarysStruct', snippet );
  355. } else if ( shaderStage === 'fragment' ) {
  356. const varys = this.varys;
  357. snippet += '\n';
  358. for ( let index = 0; index < varys.length; index ++ ) {
  359. const vary = varys[ index ];
  360. snippet += `\t@location( ${index} ) ${ vary.name } : ${ this.getType( vary.type ) }`;
  361. if ( index + 1 < varys.length ) {
  362. snippet += ',\n';
  363. }
  364. }
  365. snippet += '\n';
  366. }
  367. return snippet;
  368. }
  369. getUniforms( shaderStage ) {
  370. const uniforms = this.uniforms[ shaderStage ];
  371. let snippet = '';
  372. let groupSnippet = '';
  373. let index = this.bindingsOffset[ shaderStage ];
  374. for ( const uniform of uniforms ) {
  375. if ( uniform.type === 'texture' ) {
  376. if ( shaderStage === 'fragment' ) {
  377. snippet += `@group( 0 ) @binding( ${index ++} ) var ${uniform.name}_sampler : sampler; `;
  378. }
  379. snippet += `@group( 0 ) @binding( ${index ++} ) var ${uniform.name} : texture_2d<f32>; `;
  380. } else if ( uniform.type === 'cubeTexture' ) {
  381. if ( shaderStage === 'fragment' ) {
  382. snippet += `@group( 0 ) @binding( ${index ++} ) var ${uniform.name}_sampler : sampler; `;
  383. }
  384. snippet += `@group( 0 ) @binding( ${index ++} ) var ${uniform.name} : texture_cube<f32>; `;
  385. } else if ( uniform.type === 'buffer' ) {
  386. const bufferNode = uniform.node;
  387. const bufferType = this.getType( bufferNode.bufferType );
  388. const bufferCount = bufferNode.bufferCount;
  389. const bufferSnippet = `\t${uniform.name} : array< ${bufferType}, ${bufferCount} >;\n`;
  390. snippet += this._getWGSLUniforms( 'NodeBuffer', bufferSnippet, index ++ ) + '\n\n';
  391. } else {
  392. const vectorType = this.getType( this.getVectorType( uniform.type ) );
  393. if ( Array.isArray( uniform.value ) === true ) {
  394. const length = uniform.value.length;
  395. groupSnippet += `uniform ${vectorType}[ ${length} ] ${uniform.name}; `;
  396. } else {
  397. groupSnippet += `\t${uniform.name} : ${ vectorType};\n`;
  398. }
  399. }
  400. }
  401. if ( groupSnippet ) {
  402. snippet += this._getWGSLUniforms( 'NodeUniforms', groupSnippet, index ++ );
  403. }
  404. return snippet;
  405. }
  406. buildCode() {
  407. const shadersData = { fragment: {}, vertex: {} };
  408. for ( const shaderStage in shadersData ) {
  409. let flow = '// code\n';
  410. flow += `\t${ this.flowCode[ shaderStage ] }`;
  411. flow += '\n';
  412. const flowNodes = this.flowNodes[ shaderStage ];
  413. const mainNode = flowNodes[ flowNodes.length - 1 ];
  414. for ( const node of flowNodes ) {
  415. const flowSlotData = this.getFlowData( shaderStage, node );
  416. const slotName = node.name;
  417. if ( slotName ) {
  418. if ( flow.length > 0 ) flow += '\n';
  419. flow += `\t// FLOW -> ${ slotName }\n\t`;
  420. }
  421. flow += `${ flowSlotData.code }\n\t`;
  422. if ( node === mainNode ) {
  423. flow += '// FLOW RESULT\n\t';
  424. if ( shaderStage === 'vertex' ) {
  425. flow += 'NodeVarys.Vertex = ';
  426. } else if ( shaderStage === 'fragment' ) {
  427. flow += 'return ';
  428. }
  429. flow += `${ flowSlotData.result };`;
  430. }
  431. }
  432. const stageData = shadersData[ shaderStage ];
  433. stageData.uniforms = this.getUniforms( shaderStage );
  434. stageData.attributes = this.getAttributes( shaderStage );
  435. stageData.varys = this.getVarys( shaderStage );
  436. stageData.vars = this.getVars( shaderStage );
  437. stageData.codes = this.getCodes( shaderStage );
  438. stageData.flow = flow;
  439. }
  440. this.vertexShader = this._getWGSLVertexCode( shadersData.vertex );
  441. this.fragmentShader = this._getWGSLFragmentCode( shadersData.fragment );
  442. }
  443. getMethod( method ) {
  444. if ( wgslPolyfill[ method ] !== undefined ) {
  445. this._include( method );
  446. }
  447. return wgslMethods[ method ] || method;
  448. }
  449. getType( type ) {
  450. return wgslTypeLib[ type ] || type;
  451. }
  452. _include( name ) {
  453. wgslPolyfill[ name ].build( this );
  454. }
  455. _getNodeUniform( uniformNode, type ) {
  456. if ( type === 'float' ) return new FloatNodeUniform( uniformNode );
  457. if ( type === 'vec2' ) return new Vector2NodeUniform( uniformNode );
  458. if ( type === 'vec3' ) return new Vector3NodeUniform( uniformNode );
  459. if ( type === 'vec4' ) return new Vector4NodeUniform( uniformNode );
  460. if ( type === 'color' ) return new ColorNodeUniform( uniformNode );
  461. if ( type === 'mat3' ) return new Matrix3NodeUniform( uniformNode );
  462. if ( type === 'mat4' ) return new Matrix4NodeUniform( uniformNode );
  463. throw new Error( `Uniform "${type}" not declared.` );
  464. }
  465. _getWGSLVertexCode( shaderData ) {
  466. return `${ this.getSignature() }
  467. // uniforms
  468. ${shaderData.uniforms}
  469. // varys
  470. ${shaderData.varys}
  471. // codes
  472. ${shaderData.codes}
  473. @stage( vertex )
  474. fn main( ${shaderData.attributes} ) -> NodeVarysStruct {
  475. // system
  476. var NodeVarys: NodeVarysStruct;
  477. // vars
  478. ${shaderData.vars}
  479. // flow
  480. ${shaderData.flow}
  481. return NodeVarys;
  482. }
  483. `;
  484. }
  485. _getWGSLFragmentCode( shaderData ) {
  486. return `${ this.getSignature() }
  487. // uniforms
  488. ${shaderData.uniforms}
  489. // codes
  490. ${shaderData.codes}
  491. @stage( fragment )
  492. fn main( ${shaderData.varys} ) -> @location( 0 ) vec4<f32> {
  493. // vars
  494. ${shaderData.vars}
  495. // flow
  496. ${shaderData.flow}
  497. }
  498. `;
  499. }
  500. _getWGSLStruct( name, vars ) {
  501. return `
  502. struct ${name} {
  503. \n${vars}
  504. };`;
  505. }
  506. _getWGSLUniforms( name, vars, binding = 0, group = 0 ) {
  507. const structName = name + 'Struct';
  508. const structSnippet = this._getWGSLStruct( structName, vars );
  509. return `${structSnippet}
  510. @binding( ${binding} ) @group( ${group} )
  511. var<uniform> ${name} : ${structName};`;
  512. }
  513. }
  514. export default WebGPUNodeBuilder;