MaterialXLoader: Implement separate(2|3|4) nodes (#29437)

* implememt MaterialX seperate(2|3|4) nodes

* remove testing mods

* avoid cached nodes and handle output elements

---------

Co-authored-by: aardgoose <angus.sawyer@email.com>

examples/jsm/loaders/MaterialXLoader.js

@@ -7,7 +7,7 @@ import {
 	add, sub, mul, div, mod, abs, sign, floor, ceil, round, pow, sin, cos, tan,
 	asin, acos, atan2, sqrt, exp, clamp, min, max, normalize, length, dot, cross, normalMap,
 	remap, smoothstep, luminance, mx_rgbtohsv, mx_hsvtorgb,
-	mix,
+	mix, split,
 	mx_ramplr, mx_ramptb, mx_splitlr, mx_splittb,
 	mx_fractal_noise_float, mx_noise_float, mx_cell_noise_float, mx_worley_noise_float,
 	mx_transform_uv,
@@ -45,6 +45,8 @@ const mx_atan2 = ( in1 = float( 0 ), in2 = float( 1 ) ) => atan2( in1, in2 );
 const mx_timer = () => timerLocal();
 const mx_frame = () => frameId;
 
+const separate = ( in1, channel ) => split( in1, channel.at( - 1 ) );
+
 const MXElements = [
 
 	// << Math >>
@@ -128,9 +130,9 @@ const MXElements = [
 	//new MtlXElement( 'hsvadjust', ... ),
 	new MXElement( 'saturate', saturation, [ 'in', 'amount' ] ),
 	//new MtlXElement( 'extract', ... ),
-	//new MtlXElement( 'separate2', ... ),
-	//new MtlXElement( 'separate3', ... ),
-	//new MtlXElement( 'separate4', ... )
+	new MXElement( 'separate2', separate, [ 'in' ] ),
+	new MXElement( 'separate3', separate, [ 'in' ] ),
+	new MXElement( 'separate4', separate, [ 'in' ] ),
 
 	new MXElement( 'time', mx_timer ),
 	new MXElement( 'frame', mx_frame )
@@ -369,11 +371,11 @@ class MaterialXNode {
 
 	}
 
-	getNode() {
+	getNode( out = null ) {
 
 		let node = this.node;
 
-		if ( node !== null ) {
+		if ( node !== null && out === null ) {
 
 			return node;
 
@@ -391,7 +393,13 @@ class MaterialXNode {
 
 		} else if ( this.hasReference ) {
 
-			node = this.materialX.getMaterialXNode( this.referencePath ).getNode();
+			if ( this.element === 'output' && this.output && out === null  ) {
+
+				out = this.output;
+
+			}
+
+			node = this.materialX.getMaterialXNode( this.referencePath ).getNode( out );
 
 		} else {
 
@@ -474,7 +482,15 @@ class MaterialXNode {
 
 				const nodeElement = MtlXLibrary[ element ];
 
-				node = nodeElement.nodeFunc( ...this.getNodesByNames( ...nodeElement.params ) );
+				if ( out !== null ) {
+
+					node = nodeElement.nodeFunc( ...this.getNodesByNames( ...nodeElement.params ), out );
+
+				} else {
+
+					node = nodeElement.nodeFunc( ...this.getNodesByNames( ...nodeElement.params ) );
+
+				}
 
 			}
 
@@ -542,7 +558,7 @@ class MaterialXNode {
 
 		const child = this.getChildByName( name );
 
-		return child ? child.getNode() : undefined;
+		return child ? child.getNode( child.output ) : undefined;
 
 	}