123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432 |
- import WebGPUNodeUniformsGroup from './WebGPUNodeUniformsGroup.js';
- import {
- FloatNodeUniform, Vector2NodeUniform, Vector3NodeUniform, Vector4NodeUniform,
- ColorNodeUniform, Matrix3NodeUniform, Matrix4NodeUniform
- } from './WebGPUNodeUniform.js';
- import WebGPUNodeSampler from './WebGPUNodeSampler.js';
- import { WebGPUNodeSampledTexture } from './WebGPUNodeSampledTexture.js';
- import NodeSlot from '../../nodes/core/NodeSlot.js';
- import VarNode from '../../nodes/core/VarNode.js';
- import NodeBuilder from '../../nodes/core/NodeBuilder.js';
- import MaterialNode from '../../nodes/accessors/MaterialNode.js';
- import NormalNode from '../../nodes/accessors/NormalNode.js';
- import ModelViewProjectionNode from '../../nodes/accessors/ModelViewProjectionNode.js';
- import LightContextNode from '../../nodes/lights/LightContextNode.js';
- import ShaderLib from './ShaderLib.js';
- class WebGPUNodeBuilder extends NodeBuilder {
- constructor( material, renderer, lightNode = null ) {
- super( material, renderer );
- this.lightNode = lightNode;
- this.bindings = { vertex: [], fragment: [] };
- this.bindingsOffset = { vertex: 0, fragment: 0 };
- this.uniformsGroup = {};
- this.nativeShader = null;
- this._parseMaterial();
- }
- _parseMaterial() {
- const material = this.material;
- // get shader
- let shader = null;
- if ( material.isMeshStandardMaterial ) {
- shader = ShaderLib.standard;
- } else {
- shader = ShaderLib.common;
- }
- this.nativeShader = shader;
- // parse inputs
- if ( material.isMeshStandardMaterial || material.isMeshPhongMaterial || material.isMeshBasicMaterial || material.isPointsMaterial || material.isLineBasicMaterial ) {
- const mvpNode = new ModelViewProjectionNode();
- let lightNode = material.lightNode;
- if ( lightNode === undefined && this.lightNode && this.lightNode.hasLights === true ) {
- lightNode = this.lightNode;
- }
- if ( material.positionNode !== undefined ) {
- mvpNode.position = material.positionNode;
- }
- this.addSlot( 'vertex', new NodeSlot( mvpNode, 'MVP', 'vec4' ) );
- if ( material.alphaTestNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.alphaTestNode, 'ALPHA_TEST', 'float' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.ALPHA_TEST ), 'ALPHA_TEST', 'float' ) );
- }
- if ( material.colorNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.colorNode, 'COLOR', 'vec4' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.COLOR ), 'COLOR', 'vec4' ) );
- }
- if ( material.opacityNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.opacityNode, 'OPACITY', 'float' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.OPACITY ), 'OPACITY', 'float' ) );
- }
- if ( material.isMeshStandardMaterial ) {
- if ( material.metalnessNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.metalnessNode, 'METALNESS', 'float' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.METALNESS ), 'METALNESS', 'float' ) );
- }
- if ( material.roughnessNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.roughnessNode, 'ROUGHNESS', 'float' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.ROUGHNESS ), 'ROUGHNESS', 'float' ) );
- }
- let normalNode = null;
- if ( material.normalNode !== undefined ) {
- normalNode = material.normalNode;
- } else {
- normalNode = new NormalNode( NormalNode.VIEW );
- }
- this.addSlot( 'fragment', new NodeSlot( new VarNode( normalNode, 'TransformedNormalView', 'vec3' ), 'NORMAL', 'vec3' ) );
- } else if ( material.isMeshPhongMaterial ) {
- if ( material.specularNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.specularNode, 'SPECULAR', 'vec3' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.SPECULAR ), 'SPECULAR', 'vec3' ) );
- }
- if ( material.shininessNode !== undefined ) {
- this.addSlot( 'fragment', new NodeSlot( material.shininessNode, 'SHININESS', 'float' ) );
- } else {
- this.addSlot( 'fragment', new NodeSlot( new MaterialNode( MaterialNode.SHININESS ), 'SHININESS', 'float' ) );
- }
- }
- if ( lightNode && lightNode.isNode ) {
- const lightContextNode = new LightContextNode( lightNode );
- this.addSlot( 'fragment', new NodeSlot( lightContextNode, 'LIGHT', 'vec3' ) );
- }
- }
- }
- getTexture( textureProperty, uvSnippet, biasSnippet = null ) {
- if ( biasSnippet !== null ) {
- return `texture( sampler2D( ${textureProperty}, ${textureProperty}_sampler ), ${uvSnippet}, ${biasSnippet} )`;
- } else {
- return `texture( sampler2D( ${textureProperty}, ${textureProperty}_sampler ), ${uvSnippet} )`;
- }
- }
- getPropertyName( node ) {
- if ( node.isNodeUniform === true ) {
- const name = node.name;
- const type = node.type;
- if ( type === 'texture' ) {
- return name;
- } else {
- return `nodeUniforms.${name}`;
- }
- }
- return super.getPropertyName( node );
- }
- getBindings() {
- const bindings = this.bindings;
- return [ ...bindings.vertex, ...bindings.fragment ];
- }
- getUniformFromNode( node, shaderStage, type ) {
- const uniformNode = super.getUniformFromNode( node, shaderStage, type );
- const nodeData = this.getDataFromNode( node, shaderStage );
- if ( nodeData.uniformGPU === undefined ) {
- let uniformGPU;
- const bindings = this.bindings[ shaderStage ];
- if ( type === 'texture' ) {
- const sampler = new WebGPUNodeSampler( `${uniformNode.name}_sampler`, uniformNode.node );
- const texture = new WebGPUNodeSampledTexture( uniformNode.name, uniformNode.node );
- // add first textures in sequence and group for last
- const lastBinding = bindings[ bindings.length - 1 ];
- const index = lastBinding && lastBinding.isUniformsGroup ? bindings.length - 1 : bindings.length;
- bindings.splice( index, 0, sampler, texture );
- uniformGPU = { sampler, texture };
- } else {
- let uniformsGroup = this.uniformsGroup[ shaderStage ];
- if ( uniformsGroup === undefined ) {
- uniformsGroup = new WebGPUNodeUniformsGroup( shaderStage );
- this.uniformsGroup[ shaderStage ] = uniformsGroup;
- bindings.push( uniformsGroup );
- }
- if ( type === 'float' ) {
- uniformGPU = new FloatNodeUniform( uniformNode );
- } else if ( type === 'vec2' ) {
- uniformGPU = new Vector2NodeUniform( uniformNode );
- } else if ( type === 'vec3' ) {
- uniformGPU = new Vector3NodeUniform( uniformNode );
- } else if ( type === 'vec4' ) {
- uniformGPU = new Vector4NodeUniform( uniformNode );
- } else if ( type === 'color' ) {
- uniformGPU = new ColorNodeUniform( uniformNode );
- } else if ( type === 'mat3' ) {
- uniformGPU = new Matrix3NodeUniform( uniformNode );
- } else if ( type === 'mat4' ) {
- uniformGPU = new Matrix4NodeUniform( uniformNode );
- } else {
- throw new Error( `Uniform "${type}" not declared.` );
- }
- uniformsGroup.addUniform( uniformGPU );
- }
- nodeData.uniformGPU = uniformGPU;
- if ( shaderStage === 'vertex' ) {
- this.bindingsOffset[ 'fragment' ] = bindings.length;
- }
- }
- return uniformNode;
- }
- getAttributes( shaderStage ) {
- let snippet = '';
- if ( shaderStage === 'vertex' ) {
- const attributes = this.attributes;
- for ( let index = 0; index < attributes.length; index ++ ) {
- const attribute = attributes[ index ];
- snippet += `layout(location = ${index}) in ${attribute.type} ${attribute.name}; `;
- }
- }
- return snippet;
- }
- getVarys( shaderStage ) {
- let snippet = '';
- const varys = this.varys;
- const ioStage = shaderStage === 'vertex' ? 'out' : 'in';
- for ( let index = 0; index < varys.length; index ++ ) {
- const vary = varys[ index ];
- snippet += `layout(location = ${index}) ${ioStage} ${vary.type} ${vary.name}; `;
- }
- return snippet;
- }
- getUniforms( shaderStage ) {
- const uniforms = this.uniforms[ shaderStage ];
- let snippet = '';
- let groupSnippet = '';
- let index = this.bindingsOffset[ shaderStage ];
- for ( const uniform of uniforms ) {
- if ( uniform.type === 'texture' ) {
- snippet += `layout(set = 0, binding = ${index ++}) uniform sampler ${uniform.name}_sampler; `;
- snippet += `layout(set = 0, binding = ${index ++}) uniform texture2D ${uniform.name}; `;
- } else {
- const vectorType = this.getVectorType( uniform.type );
- groupSnippet += `uniform ${vectorType} ${uniform.name}; `;
- }
- }
- if ( groupSnippet ) {
- snippet += `layout(set = 0, binding = ${index ++}) uniform NodeUniforms { ${groupSnippet} } nodeUniforms; `;
- }
- return snippet;
- }
- composeShaderCode( code, snippet ) {
- // use regex maybe for security?
- const versionStrIndex = code.indexOf( '\n' );
- let finalCode = code.substr( 0, versionStrIndex ) + '\n\n';
- finalCode += snippet;
- finalCode += code.substr( versionStrIndex );
- return finalCode;
- }
- build() {
- const keywords = this.getContextValue( 'keywords' );
- for ( const shaderStage of [ 'vertex', 'fragment' ] ) {
- this.shaderStage = shaderStage;
- keywords.include( this, this.nativeShader.fragmentShader );
- }
- super.build();
- this.vertexShader = this.composeShaderCode( this.nativeShader.vertexShader, this.vertexShader );
- this.fragmentShader = this.composeShaderCode( this.nativeShader.fragmentShader, this.fragmentShader );
- return this;
- }
- }
- export default WebGPUNodeBuilder;
|