Editor: Fix multi-material support. (#27265)

editor/js/Script.js

@@ -223,7 +223,7 @@ function Script( editor ) {
 
 					currentObject.material[ currentScript ] = string;
 					currentObject.material.needsUpdate = true;
-					signals.materialChanged.dispatch( currentObject.material );
+					signals.materialChanged.dispatch( currentObject, 0 ); // TODO: Add multi-material support
 
 					const programs = renderer.info.programs;
 

editor/js/Sidebar.Material.BooleanProperty.js

@@ -12,24 +12,28 @@ function SidebarMaterialBooleanProperty( editor, property, name ) {
 	container.add( boolean );
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
 
 		if ( material[ property ] !== boolean.getValue() ) {
 
-			editor.execute( new SetMaterialValueCommand( editor, object, property, boolean.getValue(), 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialValueCommand( editor, object, property, boolean.getValue(), materialSlot ) );
 
 		}
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -46,14 +50,7 @@ function SidebarMaterialBooleanProperty( editor, property, name ) {
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.ColorProperty.js

@@ -22,13 +22,14 @@ function SidebarMaterialColorProperty( editor, property, name ) {
 	}
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
 
 		if ( material[ property ].getHex() !== color.getHexValue() ) {
 
-			editor.execute( new SetMaterialColorCommand( editor, object, property, color.getHexValue(), 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialColorCommand( editor, object, property, color.getHexValue(), materialSlot ) );
 
 		}
 
@@ -36,7 +37,7 @@ function SidebarMaterialColorProperty( editor, property, name ) {
 
 			if ( material[ `${ property }Intensity` ] !== intensity.getValue() ) {
 
-				editor.execute( new SetMaterialValueCommand( editor, object, `${ property }Intensity`, intensity.getValue(), /* TODO: currentMaterialSlot*/ 0 ) );
+				editor.execute( new SetMaterialValueCommand( editor, object, `${ property }Intensity`, intensity.getValue(), materialSlot ) );
 
 			}
 
@@ -44,12 +45,15 @@ function SidebarMaterialColorProperty( editor, property, name ) {
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -73,14 +77,7 @@ function SidebarMaterialColorProperty( editor, property, name ) {
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.ConstantProperty.js

@@ -12,6 +12,7 @@ function SidebarMaterialConstantProperty( editor, property, name, options ) {
 	container.add( constant );
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
@@ -20,18 +21,21 @@ function SidebarMaterialConstantProperty( editor, property, name, options ) {
 
 		if ( material[ property ] !== value ) {
 
-			editor.execute( new SetMaterialValueCommand( editor, object, property, value, 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialValueCommand( editor, object, property, value, materialSlot ) );
 
 		}
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -48,14 +52,7 @@ function SidebarMaterialConstantProperty( editor, property, name, options ) {
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.MapProperty.js

@@ -85,6 +85,7 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 	}
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
@@ -103,7 +104,7 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 			}
 
-			editor.execute( new SetMaterialMapCommand( editor, object, property, newMap, 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialMapCommand( editor, object, property, newMap, materialSlot ) );
 
 		}
 
@@ -132,7 +133,7 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 		if ( material[ `${ property }Intensity` ] !== intensity.getValue() ) {
 
-			editor.execute( new SetMaterialValueCommand( editor, object, `${ property }Intensity`, intensity.getValue(), 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialValueCommand( editor, object, `${ property }Intensity`, intensity.getValue(), materialSlot ) );
 
 		}
 
@@ -142,7 +143,7 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 		if ( material[ `${ mapType }Scale` ] !== scale.getValue() ) {
 
-			editor.execute( new SetMaterialValueCommand( editor, object, `${ mapType }Scale`, scale.getValue(), 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialValueCommand( editor, object, `${ mapType }Scale`, scale.getValue(), materialSlot ) );
 
 		}
 
@@ -154,7 +155,7 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 		if ( material[ `${ mapType }Scale` ].x !== value[ 0 ] || material[ `${ mapType }Scale` ].y !== value[ 1 ] ) {
 
-			editor.execute( new SetMaterialVectorCommand( editor, object, `${ mapType }Scale`, value, 0 /* TODOL currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialVectorCommand( editor, object, `${ mapType }Scale`, value, materialSlot ) );
 
 		}
 
@@ -166,18 +167,21 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 		if ( material[ `${ mapType }Range` ][ 0 ] !== value[ 0 ] || material[ `${ mapType }Range` ][ 1 ] !== value[ 1 ] ) {
 
-			editor.execute( new SetMaterialRangeCommand( editor, object, `${ mapType }Range`, value[ 0 ], value[ 1 ], 0 /* TODOL currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialRangeCommand( editor, object, `${ mapType }Range`, value[ 0 ], value[ 1 ], materialSlot ) );
 
 		}
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -230,11 +234,9 @@ function SidebarMaterialMapProperty( editor, property, name ) {
 
 	signals.objectSelected.add( function ( selected ) {
 
-		object = selected;
-
 		map.setValue( null );
 
-		update();
+		update( selected );
 
 	} );
 

editor/js/Sidebar.Material.NumberProperty.js

@@ -12,24 +12,28 @@ function SidebarMaterialNumberProperty( editor, property, name, range = [ - Infi
 	container.add( number );
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
 
 		if ( material[ property ] !== number.getValue() ) {
 
-			editor.execute( new SetMaterialValueCommand( editor, object, property, number.getValue(), 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialValueCommand( editor, object, property, number.getValue(), materialSlot ) );
 
 		}
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -46,14 +50,7 @@ function SidebarMaterialNumberProperty( editor, property, name, range = [ - Infi
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.Program.js

@@ -6,6 +6,7 @@ function SidebarMaterialProgram( editor, property ) {
 	const strings = editor.strings;
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	const container = new UIRow();
@@ -38,12 +39,15 @@ function SidebarMaterialProgram( editor, property ) {
 	} );
 	container.add( programFragment );
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -59,14 +63,7 @@ function SidebarMaterialProgram( editor, property ) {
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.RangeValueProperty.js

@@ -12,6 +12,7 @@ function SidebarMaterialRangeValueProperty( editor, property, name, isMin, range
 	container.add( number );
 
 	let object = null;
+	let materialSlot = null;
 	let material = null;
 
 	function onChange() {
@@ -21,18 +22,21 @@ function SidebarMaterialRangeValueProperty( editor, property, name, isMin, range
 			const minValue = isMin ? number.getValue() : material[ property ][ 0 ];
 			const maxValue = isMin ? material[ property ][ 1 ] : number.getValue();
 
-			editor.execute( new SetMaterialRangeCommand( editor, object, property, minValue, maxValue, 0 /* TODO: currentMaterialSlot */ ) );
+			editor.execute( new SetMaterialRangeCommand( editor, object, property, minValue, maxValue, materialSlot ) );
 
 		}
 
 	}
 
-	function update() {
+	function update( currentObject, currentMaterialSlot = 0 ) {
+
+		object = currentObject;
+		materialSlot = currentMaterialSlot;
 
 		if ( object === null ) return;
 		if ( object.material === undefined ) return;
 
-		material = object.material;
+		material = editor.getObjectMaterial( object, materialSlot );
 
 		if ( property in material ) {
 
@@ -49,14 +53,7 @@ function SidebarMaterialRangeValueProperty( editor, property, name, isMin, range
 
 	//
 
-	signals.objectSelected.add( function ( selected ) {
-
-		object = selected;
-
-		update();
-
-	} );
-
+	signals.objectSelected.add( update );
 	signals.materialChanged.add( update );
 
 	return container;

editor/js/Sidebar.Material.js

@@ -421,7 +421,11 @@ function SidebarMaterial( editor ) {
 
 		currentMaterialSlot = parseInt( materialSlotSelect.getValue() );
 
-		if ( currentMaterialSlot !== previousSelectedSlot ) refreshUI();
+		if ( currentMaterialSlot !== previousSelectedSlot ) {
+
+			editor.signals.materialChanged.dispatch( currentObject, currentMaterialSlot );
+
+		}
 
 		let material = editor.getObjectMaterial( currentObject, currentMaterialSlot );
 

editor/js/commands/SetMaterialColorCommand.js

@@ -18,6 +18,8 @@ class SetMaterialColorCommand extends Command {
 		this.updatable = true;
 
 		this.object = object;
+		this.materialSlot = materialSlot;
+
 		this.material = ( this.object !== undefined ) ? this.editor.getObjectMaterial( object, materialSlot ) : undefined;
 
 		this.oldValue = ( this.material !== undefined ) ? this.material[ attributeName ].getHex() : undefined;
@@ -31,7 +33,7 @@ class SetMaterialColorCommand extends Command {
 
 		this.material[ this.attributeName ].setHex( this.newValue );
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
@@ -39,7 +41,7 @@ class SetMaterialColorCommand extends Command {
 
 		this.material[ this.attributeName ].setHex( this.oldValue );
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 

editor/js/commands/SetMaterialCommand.js

@@ -27,14 +27,16 @@ class SetMaterialCommand extends Command {
 	execute() {
 
 		this.editor.setObjectMaterial( this.object, this.materialSlot, this.newMaterial );
-		this.editor.signals.materialChanged.dispatch( this.newMaterial );
+
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
 	undo() {
 
 		this.editor.setObjectMaterial( this.object, this.materialSlot, this.oldMaterial );
-		this.editor.signals.materialChanged.dispatch( this.oldMaterial );
+
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 

editor/js/commands/SetMaterialMapCommand.js

@@ -18,6 +18,8 @@ class SetMaterialMapCommand extends Command {
 		this.name = `Set Material.${mapName}`;
 
 		this.object = object;
+		this.materialSlot = materialSlot;
+
 		this.material = this.editor.getObjectMaterial( object, materialSlot );
 
 		this.oldMap = ( object !== undefined ) ? this.material[ mapName ] : undefined;
@@ -34,7 +36,7 @@ class SetMaterialMapCommand extends Command {
 		this.material[ this.mapName ] = this.newMap;
 		this.material.needsUpdate = true;
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
@@ -43,7 +45,7 @@ class SetMaterialMapCommand extends Command {
 		this.material[ this.mapName ] = this.oldMap;
 		this.material.needsUpdate = true;
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 

editor/js/commands/SetMaterialRangeCommand.js

@@ -19,6 +19,8 @@ class SetMaterialRangeCommand extends Command {
 		this.updatable = true;
 
 		this.object = object;
+		this.materialSlot = materialSlot;
+
 		this.material = this.editor.getObjectMaterial( object, materialSlot );
 
 		this.oldRange = ( this.material !== undefined && this.material[ attributeName ] !== undefined ) ? [ ...this.material[ attributeName ] ] : undefined;
@@ -34,7 +36,7 @@ class SetMaterialRangeCommand extends Command {
 		this.material.needsUpdate = true;
 
 		this.editor.signals.objectChanged.dispatch( this.object );
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
@@ -44,7 +46,7 @@ class SetMaterialRangeCommand extends Command {
 		this.material.needsUpdate = true;
 
 		this.editor.signals.objectChanged.dispatch( this.object );
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 

editor/js/commands/SetMaterialValueCommand.js

@@ -18,6 +18,8 @@ class SetMaterialValueCommand extends Command {
 		this.updatable = true;
 
 		this.object = object;
+		this.materialSlot = materialSlot;
+
 		this.material = this.editor.getObjectMaterial( object, materialSlot );
 
 		this.oldValue = ( this.material !== undefined ) ? this.material[ attributeName ] : undefined;
@@ -33,7 +35,7 @@ class SetMaterialValueCommand extends Command {
 		this.material.needsUpdate = true;
 
 		this.editor.signals.objectChanged.dispatch( this.object );
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
@@ -43,7 +45,7 @@ class SetMaterialValueCommand extends Command {
 		this.material.needsUpdate = true;
 
 		this.editor.signals.objectChanged.dispatch( this.object );
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 

editor/js/commands/SetMaterialVectorCommand.js

@@ -11,6 +11,8 @@ class SetMaterialVectorCommand extends Command {
 		this.updatable = true;
 
 		this.object = object;
+		this.materialSlot = materialSlot;
+
 		this.material = this.editor.getObjectMaterial( object, materialSlot );
 
 		this.oldValue = ( this.material !== undefined ) ? this.material[ attributeName ].toArray() : undefined;
@@ -24,7 +26,7 @@ class SetMaterialVectorCommand extends Command {
 
 		this.material[ this.attributeName ].fromArray( this.newValue );
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}
 
@@ -32,7 +34,7 @@ class SetMaterialVectorCommand extends Command {
 
 		this.material[ this.attributeName ].fromArray( this.oldValue );
 
-		this.editor.signals.materialChanged.dispatch( this.material );
+		this.editor.signals.materialChanged.dispatch( this.object, this.materialSlot );
 
 	}