NodeMaterial: Particles

examples/files.json

@@ -234,6 +234,7 @@
 		"webgl_materials_standard_nodes",
 		"webgl_mirror_nodes",
 		"webgl_performance_nodes",
+		"webgl_points_nodes",
 		"webgl_postprocessing_nodes",
 		"webgl_postprocessing_nodes_pass",
 		"webgl_sprites_nodes"

examples/jsm/renderers/nodes/accessors/PointUVNode.js

@@ -0,0 +1,24 @@
+import Node from '../core/Node.js';
+
+class PointUVNode extends Node {
+
+	constructor() {
+
+		super( 'vec2' );
+
+		Object.defineProperty( this, 'isPointUVNode', { value: true } );
+
+	}
+
+	generate( builder, output ) {
+
+		const type = this.getType( builder );
+		const snippet = 'vec2( gl_PointCoord.x, 1.0 - gl_PointCoord.y )';
+
+		return builder.format( snippet, type, output );
+
+	}
+
+}
+
+export default PointUVNode;

examples/jsm/renderers/nodes/accessors/PositionNode.js

@@ -24,7 +24,7 @@ class PositionNode extends Node {
 	generate( builder, output ) {
 
 		const type = this.getType( builder );
-		const nodeData = builder.getDataFromNode( this, builder.shaderStage );
+		const nodeData = builder.getDataFromNode( this );
 		const scope = this.scope;
 
 		let localPositionNode = nodeData.localPositionNode;

examples/jsm/renderers/nodes/materials/PointsNodeMaterial.js

@@ -13,6 +13,8 @@ class PointsNodeMaterial extends PointsMaterial {
 
 		this.lightNode = null;
 
+		this.sizeNode = null;
+
 		this.positionNode = null;
 
 	}
@@ -26,6 +28,8 @@ class PointsNodeMaterial extends PointsMaterial {
 
 		this.lightNode = source.lightNode;
 
+		this.sizeNode = source.sizeNode;
+
 		this.positionNode = source.positionNode;
 
 		return super.copy( source );

examples/jsm/renderers/nodes/utils/JoinNode.js

@@ -0,0 +1,44 @@
+import Node from '../core/Node.js';
+
+class JoinNode extends Node {
+
+	constructor( values = [] ) {
+
+		super();
+
+		this.values = values;
+
+	}
+
+	getType( builder ) {
+
+		return builder.getTypeFromLength( this.values.length );
+
+	}
+
+	generate( builder, output ) {
+
+		const type = this.getType( builder );
+		const values = this.values;
+
+		const snippetValues = [];
+
+		for ( let i = 0; i < values.length; i ++ ) {
+
+			const input = values[ i ];
+
+			const inputSnippet = input.build( builder, 'float' );
+
+			snippetValues.push( inputSnippet );
+
+		}
+
+		const snippet = `${type}( ${ snippetValues.join( ', ' ) } )`;
+
+		return builder.format( snippet, type, output );
+
+	}
+
+}
+
+export default JoinNode;

examples/jsm/renderers/nodes/utils/SpriteSheetUVNode.js

@@ -0,0 +1,69 @@
+import Node from '../core/Node.js';
+import FloatNode from '../inputs/FloatNode.js';
+import UVNode from '../accessors/UVNode.js';
+import MathNode from '../math/MathNode.js';
+import OperatorNode from '../math/OperatorNode.js';
+import SplitNode from '../utils/SplitNode.js';
+import JoinNode from '../utils/JoinNode.js';
+
+class SpriteSheetUVNode extends Node {
+
+	constructor( count, uv = new UVNode() ) {
+
+		super( 'vec2' );
+
+		this.count = count;
+		this.uv = uv;
+		this.frame = new FloatNode( 0 ).setConst( true );
+
+	}
+
+	generate( builder, output ) {
+
+		const nodeData = builder.getDataFromNode( this );
+
+		let uvFrame = nodeData.uvFrame;
+
+		if ( nodeData.uvFrame === undefined ) {
+
+			const uv = this.uv;
+			const count = this.count;
+			const frame = this.frame;
+
+			const one = new FloatNode( 1 ).setConst( true );
+
+			const width = new SplitNode( count, 'x' );
+			const height = new SplitNode( count, 'y' );
+
+			const total = new OperatorNode( '*', width, height );
+
+			const roundFrame = new MathNode( MathNode.FLOOR, new MathNode( MathNode.MOD, frame, total ) );
+
+			const frameNum = new OperatorNode( '+', roundFrame, one );
+
+			const cell = new MathNode( MathNode.MOD, roundFrame, width );
+			const row = new MathNode( MathNode.CEIL, new OperatorNode( '/', frameNum, width ) );
+			const rowInv = new OperatorNode( '-', height, row );
+
+			const scale = new OperatorNode( '/', one, count );
+
+			const uvFrameOffset = new JoinNode( [
+				new OperatorNode( '*', cell, new SplitNode( scale, 'x' ) ),
+				new OperatorNode( '*', rowInv, new SplitNode( scale, 'y' ) )
+			] );
+
+			const uvScale = new OperatorNode( '*', uv, scale );
+
+			uvFrame = new OperatorNode( '+', uvScale, uvFrameOffset );
+
+			nodeData.uvFrame = uvFrame;
+
+		}
+
+		return uvFrame.build( builder, output );
+
+	}
+
+}
+
+export default SpriteSheetUVNode;

examples/jsm/renderers/webgl/nodes/WebGLNodeBuilder.js

@@ -94,6 +94,18 @@ class WebGLNodeBuilder extends NodeBuilder {
 
 		}
 
+		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 ) {
@@ -250,13 +262,6 @@ class WebGLNodeBuilder extends NodeBuilder {
 
 	}
 
-	/*prependCode( code ) {
-
-		this.shader.vertexShader = code + this.shader.vertexShader;
-		this.shader.fragmentShader = code + this.shader.fragmentShader;
-
-	}*/
-
 	build() {
 
 		super.build();
@@ -346,6 +351,22 @@ class WebGLNodeBuilder extends NodeBuilder {
 
 			#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() {',