123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424 |
- import NodeBuilder from '../../nodes/core/NodeBuilder.js';
- import NodeSlot from '../../nodes/core/NodeSlot.js';
- import GLSLNodeParser from '../../nodes/parsers/GLSLNodeParser.js';
- import WebGLPhysicalContextNode from './WebGLPhysicalContextNode.js';
- import { ShaderChunk, LinearEncoding, RGBAFormat, UnsignedByteType, sRGBEncoding } from 'three';
- const shaderStages = [ 'vertex', 'fragment' ];
- function getIncludeSnippet( name ) {
- return `#include <${name}>`;
- }
- function getShaderStageProperty( shaderStage ) {
- return `${shaderStage}Shader`;
- }
- class WebGLNodeBuilder extends NodeBuilder {
- constructor( object, renderer, shader ) {
- super( object, renderer, new GLSLNodeParser() );
- this.shader = shader;
- this._parseObject();
- }
- _parseObject() {
- const material = this.material;
- // parse inputs
- if ( material.colorNode && material.colorNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.colorNode, 'COLOR', 'vec4' ) );
- }
- if ( material.opacityNode && material.opacityNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.opacityNode, 'OPACITY', 'float' ) );
- }
- if ( material.normalNode && material.normalNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.normalNode, 'NORMAL', 'vec3' ) );
- }
- if ( material.emissiveNode && material.emissiveNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.emissiveNode, 'EMISSIVE', 'vec3' ) );
- }
- if ( material.metalnessNode && material.metalnessNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.metalnessNode, 'METALNESS', 'float' ) );
- }
- if ( material.roughnessNode && material.roughnessNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.roughnessNode, 'ROUGHNESS', 'float' ) );
- }
- if ( material.clearcoatNode && material.clearcoatNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.clearcoatNode, 'CLEARCOAT', 'float' ) );
- }
- if ( material.clearcoatRoughnessNode && material.clearcoatRoughnessNode.isNode ) {
- this.addSlot( 'fragment', new NodeSlot( material.clearcoatRoughnessNode, 'CLEARCOAT_ROUGHNESS', 'float' ) );
- }
- if ( material.envNode && material.envNode.isNode ) {
- const envRadianceNode = new WebGLPhysicalContextNode( WebGLPhysicalContextNode.RADIANCE, material.envNode );
- const envIrradianceNode = new WebGLPhysicalContextNode( WebGLPhysicalContextNode.IRRADIANCE, material.envNode );
- this.addSlot( 'fragment', new NodeSlot( envRadianceNode, 'RADIANCE', 'vec3' ) );
- this.addSlot( 'fragment', new NodeSlot( envIrradianceNode, 'IRRADIANCE', 'vec3' ) );
- }
- if ( material.sizeNode && material.sizeNode.isNode ) {
- this.addSlot( 'vertex', new NodeSlot( material.sizeNode, 'SIZE', 'float' ) );
- }
- if ( material.positionNode && material.positionNode.isNode ) {
- this.addSlot( 'vertex', new NodeSlot( material.positionNode, 'POSITION', 'vec3' ) );
- }
- }
- getTexture( textureProperty, uvSnippet, biasSnippet = null ) {
- if ( biasSnippet !== null ) {
- return `texture2D( ${textureProperty}, ${uvSnippet}, ${biasSnippet} )`;
- } else {
- return `texture2D( ${textureProperty}, ${uvSnippet} )`;
- }
- }
- getCubeTexture( textureProperty, uvSnippet, biasSnippet = null ) {
- const textureCube = 'textureCubeLodEXT'; // textureCubeLodEXT textureLod
- if ( biasSnippet !== null ) {
- return `${textureCube}( ${textureProperty}, ${uvSnippet}, ${biasSnippet} )`;
- } else {
- return `${textureCube}( ${textureProperty}, ${uvSnippet} )`;
- }
- }
- getUniforms( shaderStage ) {
- const uniforms = this.uniforms[ shaderStage ];
- let snippet = '';
- for ( const uniform of uniforms ) {
- if ( uniform.type === 'texture' ) {
- snippet += `uniform sampler2D ${uniform.name}; `;
- } else if ( uniform.type === 'cubeTexture' ) {
- snippet += `uniform samplerCube ${uniform.name}; `;
- } else {
- const vectorType = this.getVectorType( uniform.type );
- snippet += `uniform ${vectorType} ${uniform.name}; `;
- }
- }
- return snippet;
- }
- getAttributes( shaderStage ) {
- let snippet = '';
- if ( shaderStage === 'vertex' ) {
- const attributes = this.attributes;
- for ( let index = 0; index < attributes.length; index ++ ) {
- const attribute = attributes[ index ];
- // ignore common attributes to prevent redefinitions
- if ( attribute.name === 'uv' || attribute.name === 'position' || attribute.name === 'normal' )
- continue;
- snippet += `attribute ${attribute.type} ${attribute.name}; `;
- }
- }
- return snippet;
- }
- getVarys( shaderStage ) {
- let snippet = '';
- const varys = this.varys;
- for ( let index = 0; index < varys.length; index ++ ) {
- const vary = varys[ index ];
- snippet += `varying ${vary.type} ${vary.name}; `;
- }
- return snippet;
- }
- addCodeAfterSnippet( shaderStage, snippet, code ) {
- const shaderProperty = getShaderStageProperty( shaderStage );
- let source = this.shader[ shaderProperty ];
- const index = source.indexOf( snippet );
- if ( index !== - 1 ) {
- const start = source.substring( 0, index + snippet.length );
- const end = source.substring( index + snippet.length );
- source = `${start}\n${code}\n${end}`;
- }
- this.shader[ shaderProperty ] = source;
- }
- addCodeAfterInclude( shaderStage, includeName, code ) {
- const includeSnippet = getIncludeSnippet( includeName );
- this.addCodeAfterSnippet( shaderStage, includeSnippet, code );
- }
- replaceCode( shaderStage, source, target ) {
- const shaderProperty = getShaderStageProperty( shaderStage );
- this.shader[ shaderProperty ] = this.shader[ shaderProperty ].replaceAll( source, target );
- }
- parseInclude( shaderStage, ...includes ) {
- for ( const name of includes ) {
- const includeSnippet = getIncludeSnippet( name );
- const code = ShaderChunk[ name ];
- this.replaceCode( shaderStage, includeSnippet, code );
- }
- }
- getTextureEncodingFromMap( map ) {
- const isWebGL2 = this.renderer.capabilities.isWebGL2;
- if ( isWebGL2 && map && map.isTexture && map.format === RGBAFormat && map.type === UnsignedByteType && map.encoding === sRGBEncoding ) {
- return LinearEncoding; // disable inline decode for sRGB textures in WebGL 2
- }
- return super.getTextureEncodingFromMap( map );
- }
- build() {
- super.build();
- this._addSnippets();
- this._buildShader();
- return this;
- }
- _addSnippets() {
- this.parseInclude( 'fragment', 'lights_physical_fragment' );
- this.addCodeAfterInclude( 'fragment', 'normal_fragment_begin',
- `#ifdef NODE_NORMAL
- NODE_CODE_NORMAL
- normal = NODE_NORMAL;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'color_fragment',
- `#ifdef NODE_COLOR
- NODE_CODE_COLOR
- diffuseColor = NODE_COLOR;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'alphamap_fragment',
- `#ifdef NODE_OPACITY
- NODE_CODE_OPACITY
- diffuseColor.a *= NODE_OPACITY;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'emissivemap_fragment',
- `#ifdef NODE_EMISSIVE
- NODE_CODE_EMISSIVE
- totalEmissiveRadiance = NODE_EMISSIVE;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'roughnessmap_fragment',
- `#ifdef NODE_ROUGHNESS
- NODE_CODE_ROUGHNESS
- roughnessFactor = NODE_ROUGHNESS;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'metalnessmap_fragment',
- `#ifdef NODE_METALNESS
- NODE_CODE_METALNESS
- metalnessFactor = NODE_METALNESS;
- #endif` );
- this.addCodeAfterSnippet( 'fragment', 'material.clearcoatRoughness = clearcoatRoughness;',
- `#ifdef NODE_CLEARCOAT
- NODE_CODE_CLEARCOAT
- material.clearcoat = NODE_CLEARCOAT;
- #endif
- #ifdef NODE_CLEARCOAT_ROUGHNESS
- NODE_CODE_CLEARCOAT_ROUGHNESS
- material.clearcoatRoughness = NODE_CLEARCOAT_ROUGHNESS;
- #endif` );
- this.addCodeAfterInclude( 'fragment', 'lights_fragment_begin',
- `#ifdef NODE_RADIANCE
- NODE_CODE_RADIANCE
- radiance += NODE_RADIANCE;
- NODE_CODE_IRRADIANCE
- iblIrradiance += PI * NODE_IRRADIANCE;
- #endif` );
- this.addCodeAfterInclude( 'vertex', 'begin_vertex',
- `#ifdef NODE_POSITION
- NODE_CODE_POSITION
- transformed = NODE_POSITION;
- #endif` );
- this.addCodeAfterSnippet( 'vertex', 'gl_PointSize = size;',
- `#ifdef NODE_SIZE
- NODE_CODE_SIZE
- gl_PointSize = NODE_SIZE;
- #endif` );
- for ( const shaderStage of shaderStages ) {
- this.addCodeAfterSnippet( shaderStage, 'main() {',
- `#ifdef NODE_CODE
- NODE_CODE
- #endif` );
- }
- }
- _buildShader() {
- for ( const shaderStage of shaderStages ) {
- // uniforms
- for ( const uniform of this.uniforms[ shaderStage ] ) {
- this.shader.uniforms[ uniform.name ] = uniform;
- }
- // code
- const shaderProperty = getShaderStageProperty( shaderStage );
- const nodeCode = this[ shaderProperty ];
- this.shader[ shaderProperty ] = nodeCode + this.shader[ shaderProperty ];
- }
- }
- }
- export { WebGLNodeBuilder };
|