three.js/editor/js/Sidebar.Outliner.Materials.js

Sidebar.Outliner.Materials = function ( signals ) {

	var container = new UI.Panel();
	container.name = "MAT";
	container.setPadding( '10px' );

	var outliner = new UI.FancySelect().setWidth( '100%' ).setHeight('170px').setColor( '#444' ).setFontSize( '12px' ).onChange( selectFromOutliner );
	container.add( outliner );

	var materials = null;

  function getMaterials() {

		var options = {};

		for ( var i in editor.materials ) {

			var material = editor.materials[ i ];

			if ( material.name == '') material.name = 'Material' + material.id;

			options[ i ] = material.name;

		}

		outliner.setOptions( options );
    getSelected();

  }

  function getSelected() {

    var selectedIds = [];

    for ( var id in editor.selected ) {

      if ( editor.materials[ id ] ) selectedIds.push( id );

    }

    // TODO: implement multiple selection
    outliner.setValue( selectedIds.length ? selectedIds[0] : null );

  }

	function selectFromOutliner() {

		var id = outliner.getValue();

		editor.select( editor.materials[ id ] );

	}

	// events

  var timeout;

	signals.sceneChanged.add( function () {

    clearTimeout( timeout );

    timeout = setTimeout( function () {

      getMaterials();

    }, 100 );

	} );

  signals.selected.add( getSelected );

	return container;

}