StandardMaterialEditor: Embed node values (#22954)

* update lib

* StandardMaterialEditor: Embed node values

examples/jsm/node-editor/materials/StandardMaterialEditor.js

@@ -1,10 +1,7 @@
-import { ObjectNode, LabelElement } from '../../libs/flow.module.js';
-import { MeshStandardNodeMaterial, ColorNode, FloatNode } from '../../renderers/nodes/Nodes.js';
+import { ObjectNode, ColorInput, SliderInput, LabelElement } from '../../libs/flow.module.js';
+import { MeshStandardNodeMaterial } from '../../renderers/nodes/Nodes.js';
 import * as THREE from '../../../../build/three.module.js';
 
-const NULL_COLOR = new ColorNode();
-const NULL_FLOAT = new FloatNode();
-
 export class StandardMaterialEditor extends ObjectNode {
 
 	constructor() {
@@ -22,6 +19,32 @@ export class StandardMaterialEditor extends ObjectNode {
 		const metalness = new LabelElement( 'metalness' ).setInput( 1 );
 		const roughness = new LabelElement( 'roughness' ).setInput( 1 );
 
+		color.add( new ColorInput( material.color.getHex() ).onChange( ( input ) => {
+
+			material.color.setHex( input.getValue() );
+
+		} ) );
+
+		opacity.add( new SliderInput( material.opacity, 0, 1 ).onChange( ( input ) => {
+
+			material.opacity = input.getValue();
+
+			this.updateTransparent();
+
+		} ) );
+
+		metalness.add( new SliderInput( material.metalness, 0, 1 ).onChange( ( input ) => {
+
+			material.metalness = input.getValue();
+
+		} ) );
+
+		roughness.add( new SliderInput( material.roughness, 0, 1 ).onChange( ( input ) => {
+
+			material.roughness = input.getValue();
+
+		} ) );
+
 		color.onConnect( () => this.update(), true );
 		opacity.onConnect( () => this.update(), true );
 		metalness.onConnect( () => this.update(), true );
@@ -47,16 +70,22 @@ export class StandardMaterialEditor extends ObjectNode {
 
 		const { material, color, opacity, roughness, metalness } = this;
 
-		material.colorNode = color.linkedExtra || NULL_COLOR;
+		color.setEnabledInputs( ! color.linkedExtra );
+		opacity.setEnabledInputs( ! opacity.linkedExtra );
+		roughness.setEnabledInputs( ! roughness.linkedExtra );
+		metalness.setEnabledInputs( ! metalness.linkedExtra );
+
+		material.colorNode = color.linkedExtra;
 
 		material.opacityNode = opacity.linkedExtra || null;
-		material.transparent = opacity.linkedExtra ? true : false;
 
-		material.metalnessNode = metalness.linkedExtra || NULL_FLOAT;
-		material.roughnessNode = roughness.linkedExtra || NULL_FLOAT;
+		material.metalnessNode = metalness.linkedExtra;
+		material.roughnessNode = roughness.linkedExtra;
 
 		material.dispose();
 
+		this.updateTransparent();
+
 		// TODO: Fix on NodeMaterial System
 		material.customProgramCacheKey = () => {
 
@@ -66,4 +95,14 @@ export class StandardMaterialEditor extends ObjectNode {
 
 	}
 
+	updateTransparent() {
+
+		const { material, opacity } = this;
+
+		material.transparent = opacity.linkedExtra || material.opacity < 1 ? true : false;
+
+		opacity.setIcon( material.transparent ? 'ti ti-layers-intersect' : 'ti ti-layers-subtract' );
+
+	}
+
 }