first commit

public/sdk/three/jsm/nodes/utils/ArrayElementNode.js

@@ -0,0 +1,35 @@
+import Node, { addNodeClass } from '../core/Node.js';
+
+class ArrayElementNode extends Node { // @TODO: If extending from TempNode it breaks webgpu_compute
+
+	constructor( node, indexNode ) {
+
+		super();
+
+		this.node = node;
+		this.indexNode = indexNode;
+
+		this.isArrayElementNode = true;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.node.getNodeType( builder );
+
+	}
+
+	generate( builder ) {
+
+		const nodeSnippet = this.node.build( builder );
+		const indexSnippet = this.indexNode.build( builder, 'uint' );
+
+		return `${nodeSnippet}[ ${indexSnippet} ]`;
+
+	}
+
+}
+
+export default ArrayElementNode;
+
+addNodeClass( 'ArrayElementNode', ArrayElementNode );

public/sdk/three/jsm/nodes/utils/ConvertNode.js

@@ -0,0 +1,65 @@
+import Node, { addNodeClass } from '../core/Node.js';
+
+class ConvertNode extends Node {
+
+	constructor( node, convertTo ) {
+
+		super();
+
+		this.node = node;
+		this.convertTo = convertTo;
+
+	}
+
+	getNodeType( builder ) {
+
+		const requestType = this.node.getNodeType( builder );
+
+		let convertTo = null;
+
+		for ( const overloadingType of this.convertTo.split( '|' ) ) {
+
+			if ( convertTo === null || builder.getTypeLength( requestType ) === builder.getTypeLength( overloadingType ) ) {
+
+				convertTo = overloadingType;
+
+			}
+
+		}
+
+		return convertTo;
+
+	}
+
+	serialize( data ) {
+
+		super.serialize( data );
+
+		data.convertTo = this.convertTo;
+
+	}
+
+	deserialize( data ) {
+
+		super.deserialize( data );
+
+		this.convertTo = data.convertTo;
+
+	}
+
+	generate( builder, output ) {
+
+		const node = this.node;
+		const type = this.getNodeType( builder );
+
+		const snippet = node.build( builder, type );
+
+		return builder.format( snippet, type, output );
+
+	}
+
+}
+
+export default ConvertNode;
+
+addNodeClass( 'ConvertNode', ConvertNode );

public/sdk/three/jsm/nodes/utils/DiscardNode.js

@@ -0,0 +1,27 @@
+import CondNode from '../math/CondNode.js';
+import { expression } from '../code/ExpressionNode.js';
+import { addNodeClass } from '../core/Node.js';
+import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
+
+let discardExpression;
+
+class DiscardNode extends CondNode {
+
+	constructor( condNode ) {
+
+		discardExpression = discardExpression || expression( 'discard' );
+
+		super( condNode, discardExpression );
+
+	}
+
+}
+
+export default DiscardNode;
+
+export const inlineDiscard = nodeProxy( DiscardNode );
+export const discard = ( condNode ) => inlineDiscard( condNode ).append();
+
+addNodeElement( 'discard', discard ); // @TODO: Check... this cause a little confusing using in chaining
+
+addNodeClass( 'DiscardNode', DiscardNode );

public/sdk/three/jsm/nodes/utils/EquirectUVNode.js

@@ -0,0 +1,33 @@
+import TempNode from '../core/TempNode.js';
+import { positionWorldDirection } from '../accessors/PositionNode.js';
+import { nodeProxy, vec2 } from '../shadernode/ShaderNode.js';
+import { addNodeClass } from '../core/Node.js';
+
+class EquirectUVNode extends TempNode {
+
+	constructor( dirNode = positionWorldDirection ) {
+
+		super( 'vec2' );
+
+		this.dirNode = dirNode;
+
+	}
+
+	setup() {
+
+		const dir = this.dirNode;
+
+		const u = dir.z.atan2( dir.x ).mul( 1 / ( Math.PI * 2 ) ).add( 0.5 );
+		const v = dir.y.clamp( - 1.0, 1.0 ).asin().mul( 1 / Math.PI ).add( 0.5 );
+
+		return vec2( u, v );
+
+	}
+
+}
+
+export default EquirectUVNode;
+
+export const equirectUV = nodeProxy( EquirectUVNode );
+
+addNodeClass( 'EquirectUVNode', EquirectUVNode );

public/sdk/three/jsm/nodes/utils/FunctionOverloadingNode.js

@@ -0,0 +1,95 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { nodeProxy } from '../shadernode/ShaderNode.js';
+
+class FunctionOverloadingNode extends Node {
+
+	constructor( functionNodes = [], ...parametersNodes ) {
+
+		super();
+
+		this.functionNodes = functionNodes;
+		this.parametersNodes = parametersNodes;
+
+		this._candidateFnCall = null;
+
+	}
+
+	getNodeType() {
+
+		return this.functionNodes[ 0 ].shaderNode.layout.type;
+
+	}
+
+	setup( builder ) {
+
+		const params = this.parametersNodes;
+
+		let candidateFnCall = this._candidateFnCall;
+
+		if ( candidateFnCall === null ) {
+
+			let candidateFn = null;
+			let candidateScore = - 1;
+
+			for ( const functionNode of this.functionNodes ) {
+
+				const shaderNode = functionNode.shaderNode;
+				const layout = shaderNode.layout;
+
+				if ( layout === null ) {
+
+					throw new Error( 'FunctionOverloadingNode: FunctionNode must be a layout.' );
+
+				}
+
+				const inputs = layout.inputs;
+
+				if ( params.length === inputs.length ) {
+
+					let score = 0;
+
+					for ( let i = 0; i < params.length; i ++ ) {
+
+						const param = params[ i ];
+						const input = inputs[ i ];
+
+						if ( param.getNodeType( builder ) === input.type ) {
+
+							score ++;
+
+						} else {
+
+							score = 0;
+
+						}
+
+					}
+
+					if ( score > candidateScore ) {
+
+						candidateFn = functionNode;
+						candidateScore = score;
+
+					}
+
+				}
+
+			}
+
+			this._candidateFnCall = candidateFnCall = candidateFn( ...params );
+
+		}
+
+		return candidateFnCall;
+
+	}
+
+}
+
+export default FunctionOverloadingNode;
+
+const overloadingBaseFn = nodeProxy( FunctionOverloadingNode );
+
+export const overloadingFn = ( functionNodes ) => ( ...params ) => overloadingBaseFn( functionNodes, ...params );
+
+addNodeClass( 'FunctionOverloadingNode', FunctionOverloadingNode );

public/sdk/three/jsm/nodes/utils/JoinNode.js

@@ -0,0 +1,61 @@
+import { addNodeClass } from '../core/Node.js';
+import TempNode from '../core/TempNode.js';
+
+class JoinNode extends TempNode {
+
+	constructor( nodes = [], nodeType = null ) {
+
+		super( nodeType );
+
+		this.nodes = nodes;
+
+	}
+
+	getNodeType( builder ) {
+
+		if ( this.nodeType !== null ) {
+
+			return builder.getVectorType( this.nodeType );
+
+		}
+
+		return builder.getTypeFromLength( this.nodes.reduce( ( count, cur ) => count + builder.getTypeLength( cur.getNodeType( builder ) ), 0 ) );
+
+	}
+
+	generate( builder, output ) {
+
+		const type = this.getNodeType( builder );
+		const nodes = this.nodes;
+
+		const primitiveType = builder.getComponentType( type );
+
+		const snippetValues = [];
+
+		for ( const input of nodes ) {
+
+			let inputSnippet = input.build( builder );
+
+			const inputPrimitiveType = builder.getComponentType( input.getNodeType( builder ) );
+
+			if ( inputPrimitiveType !== primitiveType ) {
+
+				inputSnippet = builder.format( inputSnippet, inputPrimitiveType, primitiveType );
+
+			}
+
+			snippetValues.push( inputSnippet );
+
+		}
+
+		const snippet = `${ builder.getType( type ) }( ${ snippetValues.join( ', ' ) } )`;
+
+		return builder.format( snippet, type, output );
+
+	}
+
+}
+
+export default JoinNode;
+
+addNodeClass( 'JoinNode', JoinNode );

public/sdk/three/jsm/nodes/utils/LoopNode.js

@@ -0,0 +1,200 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { expression } from '../code/ExpressionNode.js';
+import { bypass } from '../core/BypassNode.js';
+import { context } from '../core/ContextNode.js';
+import { addNodeElement, nodeObject, nodeArray } from '../shadernode/ShaderNode.js';
+
+class LoopNode extends Node {
+
+	constructor( params = [] ) {
+
+		super();
+
+		this.params = params;
+
+	}
+
+	getVarName( index ) {
+
+		return String.fromCharCode( 'i'.charCodeAt() + index );
+
+	}
+
+	getProperties( builder ) {
+
+		const properties = builder.getNodeProperties( this );
+
+		if ( properties.stackNode !== undefined ) return properties;
+
+		//
+
+		const inputs = {};
+
+		for ( let i = 0, l = this.params.length - 1; i < l; i ++ ) {
+
+			const param = this.params[ i ];
+
+			const name = ( param.isNode !== true && param.name ) || this.getVarName( i );
+			const type = ( param.isNode !== true && param.type ) || 'int';
+
+			inputs[ name ] = expression( name, type );
+
+		}
+
+		properties.returnsNode = this.params[ this.params.length - 1 ]( inputs, builder.addStack(), builder );
+		properties.stackNode = builder.removeStack();
+
+		return properties;
+
+	}
+
+	getNodeType( builder ) {
+
+		const { returnsNode } = this.getProperties( builder );
+
+		return returnsNode ? returnsNode.getNodeType( builder ) : 'void';
+
+	}
+
+	setup( builder ) {
+
+		// setup properties
+
+		this.getProperties( builder );
+
+	}
+
+	generate( builder ) {
+
+		const properties = this.getProperties( builder );
+
+		const contextData = { tempWrite: false };
+
+		const params = this.params;
+		const stackNode = properties.stackNode;
+
+		for ( let i = 0, l = params.length - 1; i < l; i ++ ) {
+
+			const param = params[ i ];
+
+			let start = null, end = null, name = null, type = null, condition = null, update = null;
+
+			if ( param.isNode ) {
+
+				type = 'int';
+				name = this.getVarName( i );
+				start = '0';
+				end = param.build( builder, type );
+				condition = '<';
+
+			} else {
+
+				type = param.type || 'int';
+				name = param.name || this.getVarName( i );
+				start = param.start;
+				end = param.end;
+				condition = param.condition;
+				update = param.update;
+
+				if ( typeof start === 'number' ) start = start.toString();
+				else if ( start && start.isNode ) start = start.build( builder, type );
+
+				if ( typeof end === 'number' ) end = end.toString();
+				else if ( end && end.isNode ) end = end.build( builder, type );
+
+				if ( start !== undefined && end === undefined ) {
+
+					start = start + ' - 1';
+					end = '0';
+					condition = '>=';
+
+				} else if ( end !== undefined && start === undefined ) {
+
+					start = '0';
+					condition = '<';
+
+				}
+
+				if ( condition === undefined ) {
+
+					if ( Number( start ) > Number( end ) ) {
+
+						condition = '>=';
+
+					} else {
+
+						condition = '<';
+
+					}
+
+				}
+
+			}
+
+			const internalParam = { start, end, condition };
+
+			//
+
+			const startSnippet = internalParam.start;
+			const endSnippet = internalParam.end;
+
+			let declarationSnippet = '';
+			let conditionalSnippet = '';
+			let updateSnippet = '';
+
+			if ( ! update ) {
+
+				if ( type === 'int' || type === 'uint' ) {
+
+					if ( condition.includes( '<' ) ) update = '++';
+					else update = '--';
+
+				} else {
+
+					if ( condition.includes( '<' ) ) update = '+= 1.';
+					else update = '-= 1.';
+
+				}
+
+			}
+
+			declarationSnippet += builder.getVar( type, name ) + ' = ' + startSnippet;
+
+			conditionalSnippet += name + ' ' + condition + ' ' + endSnippet;
+			updateSnippet += name + ' ' + update;
+
+			const forSnippet = `for ( ${ declarationSnippet }; ${ conditionalSnippet }; ${ updateSnippet } )`;
+
+			builder.addFlowCode( ( i === 0 ? '\n' : '' ) + builder.tab + forSnippet + ' {\n\n' ).addFlowTab();
+
+		}
+
+		const stackSnippet = context( stackNode, contextData ).build( builder, 'void' );
+
+		const returnsSnippet = properties.returnsNode ? properties.returnsNode.build( builder ) : '';
+
+		builder.removeFlowTab().addFlowCode( '\n' + builder.tab + stackSnippet );
+
+		for ( let i = 0, l = this.params.length - 1; i < l; i ++ ) {
+
+			builder.addFlowCode( ( i === 0 ? '' : builder.tab ) + '}\n\n' ).removeFlowTab();
+
+		}
+
+		builder.addFlowTab();
+
+		return returnsSnippet;
+
+	}
+
+}
+
+export default LoopNode;
+
+export const loop = ( ...params ) => nodeObject( new LoopNode( nodeArray( params, 'int' ) ) ).append();
+export const Continue = () => expression( 'continue' ).append();
+export const Break = () => expression( 'break' ).append();
+
+addNodeElement( 'loop', ( returns, ...params ) => bypass( returns, loop( ...params ) ) );
+
+addNodeClass( 'LoopNode', LoopNode );

public/sdk/three/jsm/nodes/utils/MatcapUVNode.js

@@ -0,0 +1,30 @@
+import TempNode from '../core/TempNode.js';
+import { transformedNormalView } from '../accessors/NormalNode.js';
+import { positionViewDirection } from '../accessors/PositionNode.js';
+import { nodeImmutable, vec2, vec3 } from '../shadernode/ShaderNode.js';
+import { addNodeClass } from '../core/Node.js';
+
+class MatcapUVNode extends TempNode {
+
+	constructor() {
+
+		super( 'vec2' );
+
+	}
+
+	setup() {
+
+		const x = vec3( positionViewDirection.z, 0, positionViewDirection.x.negate() ).normalize();
+		const y = positionViewDirection.cross( x );
+
+		return vec2( x.dot( transformedNormalView ), y.dot( transformedNormalView ) ).mul( 0.495 ).add( 0.5 );
+
+	}
+
+}
+
+export default MatcapUVNode;
+
+export const matcapUV = nodeImmutable( MatcapUVNode );
+
+addNodeClass( 'MatcapUVNode', MatcapUVNode );

public/sdk/three/jsm/nodes/utils/MaxMipLevelNode.js

@@ -0,0 +1,46 @@
+import UniformNode from '../core/UniformNode.js';
+import { NodeUpdateType } from '../core/constants.js';
+import { nodeProxy } from '../shadernode/ShaderNode.js';
+import { addNodeClass } from '../core/Node.js';
+
+class MaxMipLevelNode extends UniformNode {
+
+	constructor( textureNode ) {
+
+		super( 0 );
+
+		this.textureNode = textureNode;
+
+		this.updateType = NodeUpdateType.FRAME;
+
+	}
+
+	get texture() {
+
+		return this.textureNode.value;
+
+	}
+
+	update() {
+
+		const texture = this.texture;
+		const images = texture.images;
+		const image = ( images && images.length > 0 ) ? ( ( images[ 0 ] && images[ 0 ].image ) || images[ 0 ] ) : texture.image;
+
+		if ( image && image.width !== undefined ) {
+
+			const { width, height } = image;
+
+			this.value = Math.log2( Math.max( width, height ) );
+
+		}
+
+	}
+
+}
+
+export default MaxMipLevelNode;
+
+export const maxMipLevel = nodeProxy( MaxMipLevelNode );
+
+addNodeClass( 'MaxMipLevelNode', MaxMipLevelNode );

public/sdk/three/jsm/nodes/utils/OscNode.js

@@ -0,0 +1,81 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { timerLocal } from './TimerNode.js';
+import { nodeObject, nodeProxy } from '../shadernode/ShaderNode.js';
+
+class OscNode extends Node {
+
+	constructor( method = OscNode.SINE, timeNode = timerLocal() ) {
+
+		super();
+
+		this.method = method;
+		this.timeNode = timeNode;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.timeNode.getNodeType( builder );
+
+	}
+
+	setup() {
+
+		const method = this.method;
+		const timeNode = nodeObject( this.timeNode );
+
+		let outputNode = null;
+
+		if ( method === OscNode.SINE ) {
+
+			outputNode = timeNode.add( 0.75 ).mul( Math.PI * 2 ).sin().mul( 0.5 ).add( 0.5 );
+
+		} else if ( method === OscNode.SQUARE ) {
+
+			outputNode = timeNode.fract().round();
+
+		} else if ( method === OscNode.TRIANGLE ) {
+
+			outputNode = timeNode.add( 0.5 ).fract().mul( 2 ).sub( 1 ).abs();
+
+		} else if ( method === OscNode.SAWTOOTH ) {
+
+			outputNode = timeNode.fract();
+
+		}
+
+		return outputNode;
+
+	}
+
+	serialize( data ) {
+
+		super.serialize( data );
+
+		data.method = this.method;
+
+	}
+
+	deserialize( data ) {
+
+		super.deserialize( data );
+
+		this.method = data.method;
+
+	}
+
+}
+
+OscNode.SINE = 'sine';
+OscNode.SQUARE = 'square';
+OscNode.TRIANGLE = 'triangle';
+OscNode.SAWTOOTH = 'sawtooth';
+
+export default OscNode;
+
+export const oscSine = nodeProxy( OscNode, OscNode.SINE );
+export const oscSquare = nodeProxy( OscNode, OscNode.SQUARE );
+export const oscTriangle = nodeProxy( OscNode, OscNode.TRIANGLE );
+export const oscSawtooth = nodeProxy( OscNode, OscNode.SAWTOOTH );
+
+addNodeClass( 'OscNode', OscNode );

public/sdk/three/jsm/nodes/utils/PackingNode.js

@@ -0,0 +1,55 @@
+import TempNode from '../core/TempNode.js';
+import { addNodeClass } from '../core/Node.js';
+import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
+
+class PackingNode extends TempNode {
+
+	constructor( scope, node ) {
+
+		super();
+
+		this.scope = scope;
+		this.node = node;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.node.getNodeType( builder );
+
+	}
+
+	setup() {
+
+		const { scope, node } = this;
+
+		let result = null;
+
+		if ( scope === PackingNode.DIRECTION_TO_COLOR ) {
+
+			result = node.mul( 0.5 ).add( 0.5 );
+
+		} else if ( scope === PackingNode.COLOR_TO_DIRECTION ) {
+
+			result = node.mul( 2.0 ).sub( 1 );
+
+		}
+
+		return result;
+
+	}
+
+}
+
+PackingNode.DIRECTION_TO_COLOR = 'directionToColor';
+PackingNode.COLOR_TO_DIRECTION = 'colorToDirection';
+
+export default PackingNode;
+
+export const directionToColor = nodeProxy( PackingNode, PackingNode.DIRECTION_TO_COLOR );
+export const colorToDirection = nodeProxy( PackingNode, PackingNode.COLOR_TO_DIRECTION );
+
+addNodeElement( 'directionToColor', directionToColor );
+addNodeElement( 'colorToDirection', colorToDirection );
+
+addNodeClass( 'PackingNode', PackingNode );

public/sdk/three/jsm/nodes/utils/ReflectorNode.js

@@ -0,0 +1,227 @@
+import TextureNode from '../accessors/TextureNode.js';
+import { nodeObject, vec2 } from '../shadernode/ShaderNode.js';
+import { NodeUpdateType } from '../core/constants.js';
+import { viewportTopLeft } from '../display/ViewportNode.js';
+import { Matrix4, Vector2, Vector3, Vector4, Object3D, Plane, RenderTarget, HalfFloatType, LinearMipMapLinearFilter } from 'three';
+
+const _reflectorPlane = new Plane();
+const _normal = new Vector3();
+const _reflectorWorldPosition = new Vector3();
+const _cameraWorldPosition = new Vector3();
+const _rotationMatrix = new Matrix4();
+const _lookAtPosition = new Vector3( 0, 0, - 1 );
+const clipPlane = new Vector4();
+
+const _view = new Vector3();
+const _target = new Vector3();
+const _q = new Vector4();
+
+const _size = new Vector2();
+
+const _defaultRT = new RenderTarget();
+const _defaultUV = vec2( viewportTopLeft.x.oneMinus(), viewportTopLeft.y );
+
+let _inReflector = false;
+
+class ReflectorNode extends TextureNode {
+
+	constructor( parameters = {} ) {
+
+		super( _defaultRT.texture, _defaultUV );
+
+		const {
+			target = new Object3D(),
+			resolution = 1,
+			generateMipmaps = false,
+			bounces = true
+		} = parameters;
+
+		//
+
+		this.target = target;
+		this.resolution = resolution;
+		this.generateMipmaps = generateMipmaps;
+		this.bounces = bounces;
+
+		this.updateBeforeType = bounces ? NodeUpdateType.RENDER : NodeUpdateType.FRAME;
+
+		this.virtualCameras = new WeakMap();
+		this.renderTargets = new WeakMap();
+
+
+	}
+
+	_updateResolution( renderTarget, renderer ) {
+
+		const resolution = this.resolution;
+
+		renderer.getDrawingBufferSize( _size );
+
+		renderTarget.setSize( Math.round( _size.width * resolution ), Math.round( _size.height * resolution ) );
+
+	}
+
+	setup( builder ) {
+
+		this._updateResolution( _defaultRT, builder.renderer );
+
+		return super.setup( builder );
+
+	}
+
+	getTextureNode() {
+
+		return this.textureNode;
+
+	}
+
+	getVirtualCamera( camera ) {
+
+		let virtualCamera = this.virtualCameras.get( camera );
+
+		if ( virtualCamera === undefined ) {
+
+			virtualCamera = camera.clone();
+
+			this.virtualCameras.set( camera, virtualCamera );
+
+		}
+
+		return virtualCamera;
+
+	}
+
+	getRenderTarget( camera ) {
+
+		let renderTarget = this.renderTargets.get( camera );
+
+		if ( renderTarget === undefined ) {
+
+			renderTarget = new RenderTarget( 0, 0, { type: HalfFloatType } );
+
+			if ( this.generateMipmaps === true ) {
+
+			    renderTarget.texture.minFilter = LinearMipMapLinearFilter;
+			    renderTarget.texture.generateMipmaps = true;
+
+			}
+
+			this.renderTargets.set( camera, renderTarget );
+
+		}
+
+		return renderTarget;
+
+	}
+
+	updateBefore( frame ) {
+
+		if ( this.bounces === false && _inReflector ) return false;
+
+		_inReflector = true;
+
+		const { scene, camera, renderer, material } = frame;
+		const { target } = this;
+
+		const virtualCamera = this.getVirtualCamera( camera );
+		const renderTarget = this.getRenderTarget( virtualCamera );
+
+		renderer.getDrawingBufferSize( _size );
+
+		this._updateResolution( renderTarget, renderer );
+
+		//
+
+		_reflectorWorldPosition.setFromMatrixPosition( target.matrixWorld );
+		_cameraWorldPosition.setFromMatrixPosition( camera.matrixWorld );
+
+		_rotationMatrix.extractRotation( target.matrixWorld );
+
+		_normal.set( 0, 0, 1 );
+		_normal.applyMatrix4( _rotationMatrix );
+
+		_view.subVectors( _reflectorWorldPosition, _cameraWorldPosition );
+
+		// Avoid rendering when reflector is facing away
+
+		if ( _view.dot( _normal ) > 0 ) return;
+
+		_view.reflect( _normal ).negate();
+		_view.add( _reflectorWorldPosition );
+
+		_rotationMatrix.extractRotation( camera.matrixWorld );
+
+		_lookAtPosition.set( 0, 0, - 1 );
+		_lookAtPosition.applyMatrix4( _rotationMatrix );
+		_lookAtPosition.add( _cameraWorldPosition );
+
+		_target.subVectors( _reflectorWorldPosition, _lookAtPosition );
+		_target.reflect( _normal ).negate();
+		_target.add( _reflectorWorldPosition );
+
+		//
+
+		virtualCamera.coordinateSystem = camera.coordinateSystem;
+		virtualCamera.position.copy( _view );
+		virtualCamera.up.set( 0, 1, 0 );
+		virtualCamera.up.applyMatrix4( _rotationMatrix );
+		virtualCamera.up.reflect( _normal );
+		virtualCamera.lookAt( _target );
+
+		virtualCamera.near = camera.near;
+		virtualCamera.far = camera.far;
+
+		virtualCamera.updateMatrixWorld();
+		virtualCamera.projectionMatrix.copy( camera.projectionMatrix );
+
+		// Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
+		// Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
+		_reflectorPlane.setFromNormalAndCoplanarPoint( _normal, _reflectorWorldPosition );
+		_reflectorPlane.applyMatrix4( virtualCamera.matrixWorldInverse );
+
+		clipPlane.set( _reflectorPlane.normal.x, _reflectorPlane.normal.y, _reflectorPlane.normal.z, _reflectorPlane.constant );
+
+		const projectionMatrix = virtualCamera.projectionMatrix;
+
+		_q.x = ( Math.sign( clipPlane.x ) + projectionMatrix.elements[ 8 ] ) / projectionMatrix.elements[ 0 ];
+		_q.y = ( Math.sign( clipPlane.y ) + projectionMatrix.elements[ 9 ] ) / projectionMatrix.elements[ 5 ];
+		_q.z = - 1.0;
+		_q.w = ( 1.0 + projectionMatrix.elements[ 10 ] ) / projectionMatrix.elements[ 14 ];
+
+		// Calculate the scaled plane vector
+		clipPlane.multiplyScalar( 1.0 / clipPlane.dot( _q ) );
+
+		const clipBias = 0;
+
+		// Replacing the third row of the projection matrix
+		projectionMatrix.elements[ 2 ] = clipPlane.x;
+		projectionMatrix.elements[ 6 ] = clipPlane.y;
+		projectionMatrix.elements[ 10 ] = clipPlane.z - clipBias;
+		projectionMatrix.elements[ 14 ] = clipPlane.w;
+
+		//
+
+		this.value = renderTarget.texture;
+
+		material.visible = false;
+
+		const currentRenderTarget = renderer.getRenderTarget();
+
+		renderer.setRenderTarget( renderTarget );
+
+		renderer.render( scene, virtualCamera );
+
+		renderer.setRenderTarget( currentRenderTarget );
+
+		material.visible = true;
+
+		_inReflector = false;
+
+	}
+
+}
+
+export const reflector = ( parameters ) => nodeObject( new ReflectorNode( parameters ) );
+
+export default ReflectorNode;
+

public/sdk/three/jsm/nodes/utils/RemapNode.js

@@ -0,0 +1,42 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { float, addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
+
+class RemapNode extends Node {
+
+	constructor( node, inLowNode, inHighNode, outLowNode = float( 0 ), outHighNode = float( 1 ) ) {
+
+		super();
+
+		this.node = node;
+		this.inLowNode = inLowNode;
+		this.inHighNode = inHighNode;
+		this.outLowNode = outLowNode;
+		this.outHighNode = outHighNode;
+
+		this.doClamp = true;
+
+	}
+
+	setup() {
+
+		const { node, inLowNode, inHighNode, outLowNode, outHighNode, doClamp } = this;
+
+		let t = node.sub( inLowNode ).div( inHighNode.sub( inLowNode ) );
+
+		if ( doClamp === true ) t = t.clamp();
+
+		return t.mul( outHighNode.sub( outLowNode ) ).add( outLowNode );
+
+	}
+
+}
+
+export default RemapNode;
+
+export const remap = nodeProxy( RemapNode, null, null, { doClamp: false } );
+export const remapClamp = nodeProxy( RemapNode );
+
+addNodeElement( 'remap', remap );
+addNodeElement( 'remapClamp', remapClamp );
+
+addNodeClass( 'RemapNode', RemapNode );

public/sdk/three/jsm/nodes/utils/RotateNode.js

@@ -0,0 +1,68 @@
+import TempNode from '../core/TempNode.js';
+import { addNodeClass } from '../core/Node.js';
+import {
+	addNodeElement,
+	nodeProxy,
+	vec4,
+	mat2,
+	mat4,
+} from '../shadernode/ShaderNode.js';
+import { cos, sin } from '../math/MathNode.js';
+
+class RotateNode extends TempNode {
+
+	constructor( positionNode, rotationNode ) {
+
+		super();
+
+		this.positionNode = positionNode;
+		this.rotationNode = rotationNode;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.positionNode.getNodeType( builder );
+
+	}
+
+	setup( builder ) {
+
+		const { rotationNode, positionNode } = this;
+
+		const nodeType = this.getNodeType( builder );
+
+		if ( nodeType === 'vec2' ) {
+
+			const cosAngle = rotationNode.cos();
+			const sinAngle = rotationNode.sin();
+
+			const rotationMatrix = mat2(
+				cosAngle, sinAngle,
+				sinAngle.negate(), cosAngle
+			);
+
+			return rotationMatrix.mul( positionNode );
+
+		} else {
+
+			const rotation = rotationNode;
+			const rotationXMatrix = mat4( vec4( 1.0, 0.0, 0.0, 0.0 ), vec4( 0.0, cos( rotation.x ), sin( rotation.x ).negate(), 0.0 ), vec4( 0.0, sin( rotation.x ), cos( rotation.x ), 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+			const rotationYMatrix = mat4( vec4( cos( rotation.y ), 0.0, sin( rotation.y ), 0.0 ), vec4( 0.0, 1.0, 0.0, 0.0 ), vec4( sin( rotation.y ).negate(), 0.0, cos( rotation.y ), 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+			const rotationZMatrix = mat4( vec4( cos( rotation.z ), sin( rotation.z ).negate(), 0.0, 0.0 ), vec4( sin( rotation.z ), cos( rotation.z ), 0.0, 0.0 ), vec4( 0.0, 0.0, 1.0, 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+
+			return rotationXMatrix.mul( rotationYMatrix ).mul( rotationZMatrix ).mul( vec4( positionNode, 1.0 ) ).xyz;
+
+		}
+
+	}
+
+}
+
+export default RotateNode;
+
+export const rotate = nodeProxy( RotateNode );
+
+addNodeElement( 'rotate', rotate );
+
+addNodeClass( 'RotateNode', RotateNode );

public/sdk/three/jsm/nodes/utils/RotateUVNode.js

@@ -0,0 +1,35 @@
+import TempNode from '../core/TempNode.js';
+import { addNodeClass } from '../core/Node.js';
+import { addNodeElement, nodeProxy, vec2 } from '../shadernode/ShaderNode.js';
+
+class RotateUVNode extends TempNode {
+
+	constructor( uvNode, rotationNode, centerNode = vec2( 0.5 ) ) {
+
+		super( 'vec2' );
+
+		this.uvNode = uvNode;
+		this.rotationNode = rotationNode;
+		this.centerNode = centerNode;
+
+	}
+
+	setup() {
+
+		const { uvNode, rotationNode, centerNode } = this;
+
+		const vector = uvNode.sub( centerNode );
+
+		return vector.rotate( rotationNode ).add( centerNode );
+
+	}
+
+}
+
+export default RotateUVNode;
+
+export const rotateUV = nodeProxy( RotateUVNode );
+
+addNodeElement( 'rotateUV', rotateUV );
+
+addNodeClass( 'RotateUVNode', RotateUVNode );

public/sdk/three/jsm/nodes/utils/SetNode.js

@@ -0,0 +1,62 @@
+import { addNodeClass } from '../core/Node.js';
+import TempNode from '../core/TempNode.js';
+import { vectorComponents } from '../core/constants.js';
+
+class SetNode extends TempNode {
+
+	constructor( sourceNode, components, targetNode ) {
+
+		super();
+
+		this.sourceNode = sourceNode;
+		this.components = components;
+		this.targetNode = targetNode;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.sourceNode.getNodeType( builder );
+
+	}
+
+	generate( builder ) {
+
+		const { sourceNode, components, targetNode } = this;
+
+		const sourceType = this.getNodeType( builder );
+		const targetType = builder.getTypeFromLength( components.length );
+
+		const targetSnippet = targetNode.build( builder, targetType );
+		const sourceSnippet = sourceNode.build( builder, sourceType );
+
+		const length = builder.getTypeLength( sourceType );
+		const snippetValues = [];
+
+		for ( let i = 0; i < length; i ++ ) {
+
+			const component = vectorComponents[ i ];
+
+			if ( component === components[ 0 ] ) {
+
+				snippetValues.push( targetSnippet );
+
+				i += components.length - 1;
+
+			} else {
+
+				snippetValues.push( sourceSnippet + '.' + component );
+
+			}
+
+		}
+
+		return `${ builder.getType( sourceType ) }( ${ snippetValues.join( ', ' ) } )`;
+
+	}
+
+}
+
+export default SetNode;
+
+addNodeClass( 'SetNode', SetNode );

public/sdk/three/jsm/nodes/utils/SplitNode.js

@@ -0,0 +1,112 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { vectorComponents } from '../core/constants.js';
+
+const stringVectorComponents = vectorComponents.join( '' );
+
+class SplitNode extends Node {
+
+	constructor( node, components = 'x' ) {
+
+		super();
+
+		this.node = node;
+		this.components = components;
+
+		this.isSplitNode = true;
+
+	}
+
+	getVectorLength() {
+
+		let vectorLength = this.components.length;
+
+		for ( const c of this.components ) {
+
+			vectorLength = Math.max( vectorComponents.indexOf( c ) + 1, vectorLength );
+
+		}
+
+		return vectorLength;
+
+	}
+
+	getComponentType( builder ) {
+
+		return builder.getComponentType( this.node.getNodeType( builder ) );
+
+	}
+
+	getNodeType( builder ) {
+
+		return builder.getTypeFromLength( this.components.length, this.getComponentType( builder ) );
+
+	}
+
+	generate( builder, output ) {
+
+		const node = this.node;
+		const nodeTypeLength = builder.getTypeLength( node.getNodeType( builder ) );
+
+		let snippet = null;
+
+		if ( nodeTypeLength > 1 ) {
+
+			let type = null;
+
+			const componentsLength = this.getVectorLength();
+
+			if ( componentsLength >= nodeTypeLength ) {
+
+				// needed expand the input node
+
+				type = builder.getTypeFromLength( this.getVectorLength(), this.getComponentType( builder ) );
+
+			}
+
+			const nodeSnippet = node.build( builder, type );
+
+			if ( this.components.length === nodeTypeLength && this.components === stringVectorComponents.slice( 0, this.components.length ) ) {
+
+				// unnecessary swizzle
+
+				snippet = builder.format( nodeSnippet, type, output );
+
+			} else {
+
+				snippet = builder.format( `${nodeSnippet}.${this.components}`, this.getNodeType( builder ), output );
+
+			}
+
+		} else {
+
+			// ignore .components if .node returns float/integer
+
+			snippet = node.build( builder, output );
+
+		}
+
+		return snippet;
+
+	}
+
+	serialize( data ) {
+
+		super.serialize( data );
+
+		data.components = this.components;
+
+	}
+
+	deserialize( data ) {
+
+		super.deserialize( data );
+
+		this.components = data.components;
+
+	}
+
+}
+
+export default SplitNode;
+
+addNodeClass( 'SplitNode', SplitNode );

public/sdk/three/jsm/nodes/utils/SpriteSheetUVNode.js

@@ -0,0 +1,41 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { uv } from '../accessors/UVNode.js';
+import { nodeProxy, float, vec2 } from '../shadernode/ShaderNode.js';
+
+class SpriteSheetUVNode extends Node {
+
+	constructor( countNode, uvNode = uv(), frameNode = float( 0 ) ) {
+
+		super( 'vec2' );
+
+		this.countNode = countNode;
+		this.uvNode = uvNode;
+		this.frameNode = frameNode;
+
+	}
+
+	setup() {
+
+		const { frameNode, uvNode, countNode } = this;
+
+		const { width, height } = countNode;
+
+		const frameNum = frameNode.mod( width.mul( height ) ).floor();
+
+		const column = frameNum.mod( width );
+		const row = height.sub( frameNum.add( 1 ).div( width ).ceil() );
+
+		const scale = countNode.reciprocal();
+		const uvFrameOffset = vec2( column, row );
+
+		return uvNode.add( uvFrameOffset ).mul( scale );
+
+	}
+
+}
+
+export default SpriteSheetUVNode;
+
+export const spritesheetUV = nodeProxy( SpriteSheetUVNode );
+
+addNodeClass( 'SpriteSheetUVNode', SpriteSheetUVNode );

public/sdk/three/jsm/nodes/utils/StorageArrayElementNode.js

@@ -0,0 +1,91 @@
+import { addNodeClass } from '../core/Node.js';
+import { nodeProxy, addNodeElement } from '../shadernode/ShaderNode.js';
+import ArrayElementNode from './ArrayElementNode.js';
+
+class StorageArrayElementNode extends ArrayElementNode {
+
+	constructor( storageBufferNode, indexNode ) {
+
+		super( storageBufferNode, indexNode );
+
+		this.isStorageArrayElementNode = true;
+
+	}
+
+	set storageBufferNode( value ) {
+
+		this.node = value;
+
+	}
+
+	get storageBufferNode() {
+
+		return this.node;
+
+	}
+
+	setup( builder ) {
+
+		if ( builder.isAvailable( 'storageBuffer' ) === false ) {
+
+			if ( ! this.node.instanceIndex && this.node.bufferObject === true ) {
+
+				builder.setupPBO( this.node );
+
+			}
+
+		}
+
+		return super.setup( builder );
+
+	}
+
+	generate( builder, output ) {
+
+		let snippet;
+
+		const isAssignContext = builder.context.assign;
+
+		//
+
+		if ( builder.isAvailable( 'storageBuffer' ) === false ) {
+
+			const { node } = this;
+
+			if ( ! node.instanceIndex && this.node.bufferObject === true && isAssignContext !== true ) {
+
+				snippet = builder.generatePBO( this );
+
+			} else {
+
+				snippet = node.build( builder );
+
+			}
+
+		} else {
+
+			snippet = super.generate( builder );
+
+		}
+
+		if ( isAssignContext !== true ) {
+
+			const type = this.getNodeType( builder );
+
+			snippet = builder.format( snippet, type, output );
+
+		}
+
+		return snippet;
+
+	}
+
+}
+
+export default StorageArrayElementNode;
+
+export const storageElement = nodeProxy( StorageArrayElementNode );
+
+addNodeElement( 'storageElement', storageElement );
+
+addNodeClass( 'StorageArrayElementNode', StorageArrayElementNode );

public/sdk/three/jsm/nodes/utils/TimerNode.js

@@ -0,0 +1,94 @@
+import UniformNode from '../core/UniformNode.js';
+import { NodeUpdateType } from '../core/constants.js';
+import { nodeObject, nodeImmutable } from '../shadernode/ShaderNode.js';
+import { addNodeClass } from '../core/Node.js';
+
+class TimerNode extends UniformNode {
+
+	constructor( scope = TimerNode.LOCAL, scale = 1, value = 0 ) {
+
+		super( value );
+
+		this.scope = scope;
+		this.scale = scale;
+
+		this.updateType = NodeUpdateType.FRAME;
+
+	}
+	/*
+	@TODO:
+	getNodeType( builder ) {
+
+		const scope = this.scope;
+
+		if ( scope === TimerNode.FRAME ) {
+
+			return 'uint';
+
+		}
+
+		return 'float';
+
+	}
+*/
+	update( frame ) {
+
+		const scope = this.scope;
+		const scale = this.scale;
+
+		if ( scope === TimerNode.LOCAL ) {
+
+			this.value += frame.deltaTime * scale;
+
+		} else if ( scope === TimerNode.DELTA ) {
+
+			this.value = frame.deltaTime * scale;
+
+		} else if ( scope === TimerNode.FRAME ) {
+
+			this.value = frame.frameId;
+
+		} else {
+
+			// global
+
+			this.value = frame.time * scale;
+
+		}
+
+	}
+
+	serialize( data ) {
+
+		super.serialize( data );
+
+		data.scope = this.scope;
+		data.scale = this.scale;
+
+	}
+
+	deserialize( data ) {
+
+		super.deserialize( data );
+
+		this.scope = data.scope;
+		this.scale = data.scale;
+
+	}
+
+}
+
+TimerNode.LOCAL = 'local';
+TimerNode.GLOBAL = 'global';
+TimerNode.DELTA = 'delta';
+TimerNode.FRAME = 'frame';
+
+export default TimerNode;
+
+// @TODO: add support to use node in timeScale
+export const timerLocal = ( timeScale, value = 0 ) => nodeObject( new TimerNode( TimerNode.LOCAL, timeScale, value ) );
+export const timerGlobal = ( timeScale, value = 0 ) => nodeObject( new TimerNode( TimerNode.GLOBAL, timeScale, value ) );
+export const timerDelta = ( timeScale, value = 0 ) => nodeObject( new TimerNode( TimerNode.DELTA, timeScale, value ) );
+export const frameId = nodeImmutable( TimerNode, TimerNode.FRAME ).uint();
+
+addNodeClass( 'TimerNode', TimerNode );

public/sdk/three/jsm/nodes/utils/TriplanarTexturesNode.js

@@ -0,0 +1,62 @@
+import Node, { addNodeClass } from '../core/Node.js';
+import { add } from '../math/OperatorNode.js';
+import { normalLocal } from '../accessors/NormalNode.js';
+import { positionLocal } from '../accessors/PositionNode.js';
+import { texture } from '../accessors/TextureNode.js';
+import { addNodeElement, nodeProxy, float, vec3 } from '../shadernode/ShaderNode.js';
+
+class TriplanarTexturesNode extends Node {
+
+	constructor( textureXNode, textureYNode = null, textureZNode = null, scaleNode = float( 1 ), positionNode = positionLocal, normalNode = normalLocal ) {
+
+		super( 'vec4' );
+
+		this.textureXNode = textureXNode;
+		this.textureYNode = textureYNode;
+		this.textureZNode = textureZNode;
+
+		this.scaleNode = scaleNode;
+
+		this.positionNode = positionNode;
+		this.normalNode = normalNode;
+
+	}
+
+	setup() {
+
+		const { textureXNode, textureYNode, textureZNode, scaleNode, positionNode, normalNode } = this;
+
+		// Ref: https://github.com/keijiro/StandardTriplanar
+
+		// Blending factor of triplanar mapping
+		let bf = normalNode.abs().normalize();
+		bf = bf.div( bf.dot( vec3( 1.0 ) ) );
+
+		// Triplanar mapping
+		const tx = positionNode.yz.mul( scaleNode );
+		const ty = positionNode.zx.mul( scaleNode );
+		const tz = positionNode.xy.mul( scaleNode );
+
+		// Base color
+		const textureX = textureXNode.value;
+		const textureY = textureYNode !== null ? textureYNode.value : textureX;
+		const textureZ = textureZNode !== null ? textureZNode.value : textureX;
+
+		const cx = texture( textureX, tx ).mul( bf.x );
+		const cy = texture( textureY, ty ).mul( bf.y );
+		const cz = texture( textureZ, tz ).mul( bf.z );
+
+		return add( cx, cy, cz );
+
+	}
+
+}
+
+export default TriplanarTexturesNode;
+
+export const triplanarTextures = nodeProxy( TriplanarTexturesNode );
+export const triplanarTexture = ( ...params ) => triplanarTextures( ...params );
+
+addNodeElement( 'triplanarTexture', triplanarTexture );
+
+addNodeClass( 'TriplanarTexturesNode', TriplanarTexturesNode );