diff --git a/examples/jsm/nodes/Nodes.js b/examples/jsm/nodes/Nodes.js index ed8bfeb92e84a2..3c806cf4682029 100644 --- a/examples/jsm/nodes/Nodes.js +++ b/examples/jsm/nodes/Nodes.js @@ -27,7 +27,7 @@ export { default as NodeUniform } from './core/NodeUniform.js'; export { default as NodeVar } from './core/NodeVar.js'; export { default as NodeVarying } from './core/NodeVarying.js'; export { default as ParameterNode, parameter } from './core/ParameterNode.js'; -export { default as PropertyNode, property, output, diffuseColor, roughness, metalness, clearcoat, clearcoatRoughness, sheen, sheenRoughness, iridescence, iridescenceIOR, iridescenceThickness, specularColor, shininess, dashSize, gapSize, pointWidth } from './core/PropertyNode.js'; +export { default as PropertyNode, property, varyingProperty, output, diffuseColor, roughness, metalness, clearcoat, clearcoatRoughness, sheen, sheenRoughness, iridescence, iridescenceIOR, iridescenceThickness, specularColor, shininess, dashSize, gapSize, pointWidth } from './core/PropertyNode.js'; export { default as StackNode, stack } from './core/StackNode.js'; export { default as TempNode } from './core/TempNode.js'; export { default as UniformGroupNode, uniformGroup, objectGroup, renderGroup, frameGroup } from './core/UniformGroupNode.js'; diff --git a/examples/jsm/nodes/core/NodeBuilder.js b/examples/jsm/nodes/core/NodeBuilder.js index c5860c9a1dc965..125d9ac93e1b7d 100644 --- a/examples/jsm/nodes/core/NodeBuilder.js +++ b/examples/jsm/nodes/core/NodeBuilder.js @@ -740,7 +740,7 @@ class NodeBuilder { } - getVaryingFromNode( node, type ) { + getVaryingFromNode( node, name = null, type = node.getNodeType( this ) ) { const nodeData = this.getDataFromNode( node, 'any' ); @@ -751,7 +751,9 @@ class NodeBuilder { const varyings = this.varyings; const index = varyings.length; - nodeVarying = new NodeVarying( 'nodeVarying' + index, type ); + if ( name === null ) name = 'nodeVarying' + index; + + nodeVarying = new NodeVarying( name, type ); varyings.push( nodeVarying ); diff --git a/examples/jsm/nodes/core/PropertyNode.js b/examples/jsm/nodes/core/PropertyNode.js index 8b150ac9604888..4f15318ae17f9e 100644 --- a/examples/jsm/nodes/core/PropertyNode.js +++ b/examples/jsm/nodes/core/PropertyNode.js @@ -3,11 +3,12 @@ import { nodeImmutable, nodeObject } from '../shadernode/ShaderNode.js'; class PropertyNode extends Node { - constructor( nodeType, name = null ) { + constructor( nodeType, name = null, varying = false ) { super( nodeType ); this.name = name; + this.varying = varying; this.isPropertyNode = true; @@ -27,7 +28,20 @@ class PropertyNode extends Node { generate( builder ) { - return builder.getPropertyName( builder.getVarFromNode( this, this.name ) ); + let nodeVar; + + if ( this.varying === true ) { + + nodeVar = builder.getVaryingFromNode( this, this.name ); + nodeVar.needsInterpolation = true; + + } else { + + nodeVar = builder.getVarFromNode( this, this.name ); + + } + + return builder.getPropertyName( nodeVar ); } @@ -36,6 +50,7 @@ class PropertyNode extends Node { export default PropertyNode; export const property = ( type, name ) => nodeObject( new PropertyNode( type, name ) ); +export const varyingProperty = ( type, name ) => nodeObject( new PropertyNode( type, name, true ) ); export const diffuseColor = nodeImmutable( PropertyNode, 'vec4', 'DiffuseColor' ); export const roughness = nodeImmutable( PropertyNode, 'float', 'Roughness' ); diff --git a/examples/jsm/nodes/core/VaryingNode.js b/examples/jsm/nodes/core/VaryingNode.js index fbaa69c69c7ae3..de15d6641b88ba 100644 --- a/examples/jsm/nodes/core/VaryingNode.js +++ b/examples/jsm/nodes/core/VaryingNode.js @@ -40,17 +40,11 @@ class VaryingNode extends Node { const { name, node } = this; const type = this.getNodeType( builder ); - const nodeVarying = builder.getVaryingFromNode( this, type ); + const nodeVarying = builder.getVaryingFromNode( this, name, type ); // this property can be used to check if the varying can be optimized for a var nodeVarying.needsInterpolation || ( nodeVarying.needsInterpolation = ( builder.shaderStage === 'fragment' ) ); - if ( name !== null ) { - - nodeVarying.name = name; - - } - const propertyName = builder.getPropertyName( nodeVarying, NodeShaderStage.VERTEX ); // force node run in vertex stage diff --git a/examples/jsm/nodes/materials/Line2NodeMaterial.js b/examples/jsm/nodes/materials/Line2NodeMaterial.js index f1c099da69b136..c686716c2d92bf 100644 --- a/examples/jsm/nodes/materials/Line2NodeMaterial.js +++ b/examples/jsm/nodes/materials/Line2NodeMaterial.js @@ -1,7 +1,7 @@ import NodeMaterial, { addNodeMaterial } from './NodeMaterial.js'; import { temp } from '../core/VarNode.js'; import { varying } from '../core/VaryingNode.js'; -import { property } from '../core/PropertyNode.js'; +import { property, varyingProperty } from '../core/PropertyNode.js'; import { attribute } from '../core/AttributeNode.js'; import { cameraProjectionMatrix } from '../accessors/CameraNode.js'; import { materialColor, materialLineScale, materialLineDashSize, materialLineGapSize, materialLineDashOffset, materialLineWidth } from '../accessors/MaterialNode.js'; @@ -60,7 +60,7 @@ class Line2NodeMaterial extends NodeMaterial { const a = cameraProjectionMatrix.element( 2 ).element( 2 ); // 3nd entry in 3th column const b = cameraProjectionMatrix.element( 3 ).element( 2 ); // 3nd entry in 4th column - const nearEstimate = b.mul( -0.5 ).div( a ); + const nearEstimate = b.mul( - 0.5 ).div( a ); const alpha = nearEstimate.sub( start.z ).div( end.z.sub( start.z ) ); @@ -70,7 +70,7 @@ class Line2NodeMaterial extends NodeMaterial { this.vertexNode = tslFn( () => { - varying( vec2(), 'vUv' ).assign( uv() ); // @TODO: Analyze other way to do this + varyingProperty( 'vec2', 'vUv' ).assign( uv() ); const instanceStart = attribute( 'instanceStart' ); const instanceEnd = attribute( 'instanceEnd' ); @@ -85,8 +85,8 @@ class Line2NodeMaterial extends NodeMaterial { if ( useWorldUnits ) { - varying( vec3(), 'worldStart' ).assign( start.xyz ); - varying( vec3(), 'worldEnd' ).assign( end.xyz ); + varyingProperty( 'vec3', 'worldStart' ).assign( start.xyz ); + varyingProperty( 'vec3', 'worldEnd' ).assign( end.xyz ); } @@ -97,7 +97,7 @@ class Line2NodeMaterial extends NodeMaterial { // but we need to perform ndc-space calculations in the shader, so we must address this issue directly // perhaps there is a more elegant solution -- WestLangley - const perspective = cameraProjectionMatrix.element( 2 ).element( 3 ).equal( -1.0 ); // 4th entry in the 3rd column + const perspective = cameraProjectionMatrix.element( 2 ).element( 3 ).equal( - 1.0 ); // 4th entry in the 3rd column If( perspective, () => { @@ -173,7 +173,7 @@ class Line2NodeMaterial extends NodeMaterial { // set the world position - const worldPos = varying( vec4(), 'worldPos' ); + const worldPos = varyingProperty( 'vec4', 'worldPos' ); worldPos.assign( positionGeometry.y.lessThan( 0.5 ).cond( start, end ) ); worldPos.assign( worldPos.add( vec4( offset, 0 ) ) ); @@ -257,7 +257,7 @@ class Line2NodeMaterial extends NodeMaterial { this.colorNode = tslFn( () => { - const vUv = varying( vec2(), 'vUv' ); + const vUv = varyingProperty( 'vec2', 'vUv' ); if ( useDash ) { @@ -288,11 +288,11 @@ class Line2NodeMaterial extends NodeMaterial { if ( useWorldUnits ) { - const worldStart = varying( vec3(), 'worldStart' ); - const worldEnd = varying( vec3(), 'worldEnd' ); + const worldStart = varyingProperty( 'vec3', 'worldStart' ); + const worldEnd = varyingProperty( 'vec3', 'worldEnd' ); // Find the closest points on the view ray and the line segment - const rayEnd = varying( vec4(), 'worldPos' ).xyz.normalize().mul( 1e5 ); + const rayEnd = varyingProperty( 'vec4', 'worldPos' ).xyz.normalize().mul( 1e5 ); const lineDir = worldEnd.sub( worldStart ); const params = closestLineToLine( { p1: worldStart, p2: worldEnd, p3: vec3( 0.0, 0.0, 0.0 ), p4: rayEnd } ); diff --git a/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js b/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js index f0126c88d5103d..3f136c19b6ee5d 100644 --- a/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js +++ b/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js @@ -259,7 +259,7 @@ class WGSLNodeBuilder extends NodeBuilder { if ( shaderStage === 'vertex' ) { - return `NodeVaryings.${ node.name }`; + return `varyings.${ node.name }`; } @@ -654,7 +654,7 @@ ${ flowData.code } const code = snippets.join( ',\n\t' ); - return shaderStage === 'vertex' ? this._getWGSLStruct( 'NodeVaryingsStruct', '\t' + code ) : code; + return shaderStage === 'vertex' ? this._getWGSLStruct( 'VaryingsStruct', '\t' + code ) : code; } @@ -808,7 +808,7 @@ ${ flowData.code } if ( shaderStage === 'vertex' ) { - flow += 'NodeVaryings.Vertex = '; + flow += 'varyings.Vertex = '; } else if ( shaderStage === 'fragment' ) { @@ -888,15 +888,13 @@ ${shaderData.uniforms} // varyings ${shaderData.varyings} +var varyings : VaryingsStruct; // codes ${shaderData.codes} @vertex -fn main( ${shaderData.attributes} ) -> NodeVaryingsStruct { - - // system - var NodeVaryings: NodeVaryingsStruct; +fn main( ${shaderData.attributes} ) -> VaryingsStruct { // vars ${shaderData.vars} @@ -904,7 +902,7 @@ fn main( ${shaderData.attributes} ) -> NodeVaryingsStruct { // flow ${shaderData.flow} - return NodeVaryings; + return varyings; } `;