import { MathNode, GLSLNodeParser, NodeBuilder, NodeMaterial, FunctionNode } from '../../../nodes/Nodes.js'; import UniformBuffer from '../../common/UniformBuffer.js'; import UniformsGroup from '../../common/UniformsGroup.js'; import { NodeSampledTexture, NodeSampledCubeTexture } from '../../common/nodes/NodeSampledTexture.js'; const glslMethods = { [ MathNode.ATAN2 ]: 'atan', textureDimensions: 'textureSize' }; const precisionLib = { low: 'lowp', medium: 'mediump', high: 'highp' }; const supports = { instance: true }; class GLSLNodeBuilder extends NodeBuilder { constructor( object, renderer, scene = null ) { super( object, renderer, new GLSLNodeParser(), scene ); this.uniformsGroup = {}; } getMethod( method ) { return glslMethods[ method ] || method; } getPropertyName( node, shaderStage ) { if ( node.isOutputStructVar ) return ''; return super.getPropertyName( node, shaderStage ); } buildFunctionNode( shaderNode ) { const layout = shaderNode.layout; const flowData = this.flowShaderNode( shaderNode ); const parameters = []; for ( const input of layout.inputs ) { parameters.push( this.getType( input.type ) + ' ' + input.name ); } // const code = `${ this.getType( layout.type ) } ${ layout.name }( ${ parameters.join( ', ' ) } ) { ${ flowData.vars } ${ flowData.code } return ${ flowData.result }; }`; // return new FunctionNode( code ); } getTexture( texture, textureProperty, uvSnippet ) { if ( texture.isTextureCube ) { return `textureCube( ${textureProperty}, ${uvSnippet} )`; } else if ( texture.isDepthTexture ) { return `texture( ${textureProperty}, ${uvSnippet} ).x`; } else { return `texture( ${textureProperty}, ${uvSnippet} )`; } } getTextureLevel( texture, textureProperty, uvSnippet, biasSnippet ) { return `textureLod( ${textureProperty}, ${uvSnippet}, ${biasSnippet} )`; } getTextureCompare( texture, textureProperty, uvSnippet, compareSnippet, shaderStage = this.shaderStage ) { if ( shaderStage === 'fragment' ) { return `texture( ${textureProperty}, vec3( ${uvSnippet}, ${compareSnippet} ) )`; } else { console.error( `WebGPURenderer: THREE.DepthTexture.compareFunction() does not support ${ shaderStage } shader.` ); } } getVars( shaderStage ) { const snippets = []; const vars = this.vars[ shaderStage ]; if ( vars !== undefined ) { for ( const variable of vars ) { if ( variable.isOutputStructVar ) continue; snippets.push( `${ this.getVar( variable.type, variable.name ) };` ); } } return snippets.join( '\n\t' ); } getUniforms( shaderStage ) { const uniforms = this.uniforms[ shaderStage ]; const bindingSnippets = []; const groupSnippets = []; for ( const uniform of uniforms ) { let snippet = null; let group = false; if ( uniform.type === 'texture' ) { if ( uniform.node.value.compareFunction ) { snippet = `sampler2DShadow ${uniform.name};`; } else { snippet = `sampler2D ${uniform.name};`; } } else if ( uniform.type === 'cubeTexture' ) { snippet = `samplerCube ${uniform.name};`; } else if ( uniform.type === 'buffer' ) { const bufferNode = uniform.node; const bufferType = this.getType( bufferNode.bufferType ); const bufferCount = bufferNode.bufferCount; const bufferCountSnippet = bufferCount > 0 ? bufferCount : ''; snippet = `${bufferNode.name} {\n\t${bufferType} ${uniform.name}[${bufferCountSnippet}];\n};\n`; } else { const vectorType = this.getVectorType( uniform.type ); snippet = `${vectorType} ${uniform.name};`; group = true; } const precision = uniform.node.precision; if ( precision !== null ) { snippet = precisionLib[ precision ] + ' ' + snippet; } if ( group ) { snippet = '\t' + snippet; groupSnippets.push( snippet ); } else { snippet = 'uniform ' + snippet; bindingSnippets.push( snippet ); } } let output = ''; if ( groupSnippets.length > 0 ) { output += this._getGLSLUniformStruct( shaderStage + 'NodeUniforms', groupSnippets.join( '\n' ) ) + '\n'; } output += bindingSnippets.join( '\n' ); return output; } getAttributes( shaderStage ) { let snippet = ''; if ( shaderStage === 'vertex' ) { const attributes = this.getAttributesArray(); let location = 0; for ( const attribute of attributes ) { snippet += `layout( location = ${ location ++ } ) in ${ attribute.type } ${ attribute.name };\n`; } } return snippet; } getStructMembers( struct ) { const snippets = []; const members = struct.getMemberTypes(); for ( let i = 0; i < members.length; i ++ ) { const member = members[ i ]; snippets.push( `layout( location = ${i} ) out ${ member} m${i};` ); } return snippets.join( '\n' ); } getStructs( shaderStage ) { const snippets = []; const structs = this.structs[ shaderStage ]; if ( structs.length === 0 ) { return 'layout( location = 0 ) out vec4 fragColor;\n'; } for ( let index = 0, length = structs.length; index < length; index ++ ) { const struct = structs[ index ]; let snippet = '\n'; snippet += this.getStructMembers( struct ); snippet += '\n'; snippets.push( snippet ); } return snippets.join( '\n\n' ); } getVaryings( shaderStage ) { let snippet = ''; const varyings = this.varyings; if ( shaderStage === 'vertex' ) { for ( const varying of varyings ) { const type = varying.type; const flat = type === 'int' || type === 'uint' ? 'flat ' : ''; snippet += `${flat}${varying.needsInterpolation ? 'out' : '/*out*/'} ${type} ${varying.name};\n`; } } else if ( shaderStage === 'fragment' ) { for ( const varying of varyings ) { if ( varying.needsInterpolation ) { const type = varying.type; const flat = type === 'int' || type === 'uint' ? 'flat ' : ''; snippet += `${flat}in ${type} ${varying.name};\n`; } } } return snippet; } getVertexIndex() { return 'gl_VertexID'; } getInstanceIndex() { return 'uint( gl_InstanceID )'; } getFrontFacing() { return 'gl_FrontFacing'; } getFragCoord() { return 'gl_FragCoord'; } isAvailable( name ) { return supports[ name ] === true; } isFlipY() { return true; } _getGLSLUniformStruct( name, vars ) { return ` layout( std140 ) uniform ${name} { ${vars} };`; } _getGLSLVertexCode( shaderData ) { return `#version 300 es ${ this.getSignature() } // precision precision highp float; precision highp int; // uniforms ${shaderData.uniforms} // varyings ${shaderData.varyings} // attributes ${shaderData.attributes} // codes ${shaderData.codes} void main() { // vars ${shaderData.vars} // flow ${shaderData.flow} gl_PointSize = 1.0; } `; } _getGLSLFragmentCode( shaderData ) { return `#version 300 es ${ this.getSignature() } // precision precision highp float; precision highp int; precision lowp sampler2DShadow; // uniforms ${shaderData.uniforms} // varyings ${shaderData.varyings} // codes ${shaderData.codes} ${shaderData.structs} void main() { // vars ${shaderData.vars} // flow ${shaderData.flow} } `; } buildCode() { const shadersData = this.material !== null ? { fragment: {}, vertex: {} } : { compute: {} }; for ( const shaderStage in shadersData ) { let flow = '// code\n\n'; flow += this.flowCode[ shaderStage ]; const flowNodes = this.flowNodes[ shaderStage ]; const mainNode = flowNodes[ flowNodes.length - 1 ]; for ( const node of flowNodes ) { const flowSlotData = this.getFlowData( node/*, shaderStage*/ ); const slotName = node.name; if ( slotName ) { if ( flow.length > 0 ) flow += '\n'; flow += `\t// flow -> ${ slotName }\n\t`; } flow += `${ flowSlotData.code }\n\t`; if ( node === mainNode && shaderStage !== 'compute' ) { flow += '// result\n\t'; if ( shaderStage === 'vertex' ) { flow += 'gl_Position = '; flow += `${ flowSlotData.result };`; } else if ( shaderStage === 'fragment' ) { if ( ! node.outputNode.isOutputStructNode ) { flow += 'fragColor = '; flow += `${ flowSlotData.result };`; } } } } const stageData = shadersData[ shaderStage ]; stageData.uniforms = this.getUniforms( shaderStage ); stageData.attributes = this.getAttributes( shaderStage ); stageData.varyings = this.getVaryings( shaderStage ); stageData.vars = this.getVars( shaderStage ); stageData.structs = this.getStructs( shaderStage ); stageData.codes = this.getCodes( shaderStage ); stageData.flow = flow; } if ( this.material !== null ) { this.vertexShader = this._getGLSLVertexCode( shadersData.vertex ); this.fragmentShader = this._getGLSLFragmentCode( shadersData.fragment ); } else { console.warn( 'GLSLNodeBuilder: compute shaders are not supported.' ); //this.computeShader = this._getGLSLComputeCode( shadersData.compute ); } } getUniformFromNode( node, type, shaderStage, name = null ) { const uniformNode = super.getUniformFromNode( node, type, shaderStage, name ); const nodeData = this.getDataFromNode( node, shaderStage ); let uniformGPU = nodeData.uniformGPU; if ( uniformGPU === undefined ) { if ( type === 'texture' ) { uniformGPU = new NodeSampledTexture( uniformNode.name, uniformNode.node ); this.bindings[ shaderStage ].push( uniformGPU ); } else if ( type === 'cubeTexture' ) { uniformGPU = new NodeSampledCubeTexture( uniformNode.name, uniformNode.node ); this.bindings[ shaderStage ].push( uniformGPU ); } else if ( type === 'buffer' ) { node.name = `NodeBuffer_${node.id}`; const buffer = new UniformBuffer( node.name, node.value ); uniformNode.name = `buffer${node.id}`; this.bindings[ shaderStage ].push( buffer ); uniformGPU = buffer; } else { let uniformsGroup = this.uniformsGroup[ shaderStage ]; if ( uniformsGroup === undefined ) { uniformsGroup = new UniformsGroup( shaderStage + 'NodeUniforms' ); //uniformsGroup.setVisibility( gpuShaderStageLib[ shaderStage ] ); this.uniformsGroup[ shaderStage ] = uniformsGroup; this.bindings[ shaderStage ].push( uniformsGroup ); } uniformGPU = this.getNodeUniform( uniformNode, type ); uniformsGroup.addUniform( uniformGPU ); } nodeData.uniformGPU = uniformGPU; } return uniformNode; } build() { // @TODO: Move this code to super.build() const { object, material } = this; if ( material !== null ) { NodeMaterial.fromMaterial( material ).build( this ); } else { this.addFlow( 'compute', object ); } return super.build(); } } export default GLSLNodeBuilder;