mirror of
https://github.com/Doodle3D/Doodle3D-Slicer.git
synced 2024-12-24 12:03:48 +01:00
228 lines
5.0 KiB
JavaScript
Executable File
228 lines
5.0 KiB
JavaScript
Executable File
/**
|
|
* @author mrdoob / http://mrdoob.com/
|
|
*/
|
|
|
|
Sidebar.Scene = function ( editor ) {
|
|
|
|
var signals = editor.signals;
|
|
|
|
var container = new UI.CollapsiblePanel();
|
|
container.setCollapsed( editor.config.getKey( 'ui/sidebar/scene/collapsed' ) );
|
|
container.onCollapsedChange( function ( boolean ) {
|
|
|
|
editor.config.setKey( 'ui/sidebar/scene/collapsed', boolean );
|
|
|
|
} );
|
|
|
|
container.addStatic( new UI.Text( 'SCENE' ) );
|
|
container.add( new UI.Break() );
|
|
|
|
var ignoreObjectSelectedSignal = false;
|
|
|
|
var outliner = new UI.Outliner( editor );
|
|
outliner.onChange( function () {
|
|
|
|
ignoreObjectSelectedSignal = true;
|
|
|
|
editor.selectById( parseInt( outliner.getValue() ) );
|
|
|
|
ignoreObjectSelectedSignal = false;
|
|
|
|
} );
|
|
outliner.onDblClick( function () {
|
|
|
|
editor.focusById( parseInt( outliner.getValue() ) );
|
|
|
|
} );
|
|
container.add( outliner );
|
|
container.add( new UI.Break() );
|
|
|
|
// fog
|
|
|
|
var updateFogParameters = function () {
|
|
|
|
var near = fogNear.getValue();
|
|
var far = fogFar.getValue();
|
|
var density = fogDensity.getValue();
|
|
|
|
signals.fogParametersChanged.dispatch( near, far, density );
|
|
|
|
};
|
|
|
|
var fogTypeRow = new UI.Panel();
|
|
var fogType = new UI.Select().setOptions( {
|
|
|
|
'None': 'None',
|
|
'Fog': 'Linear',
|
|
'FogExp2': 'Exponential'
|
|
|
|
} ).setWidth( '150px' );
|
|
fogType.onChange( function () {
|
|
|
|
var type = fogType.getValue();
|
|
signals.fogTypeChanged.dispatch( type );
|
|
|
|
refreshFogUI();
|
|
|
|
} );
|
|
|
|
fogTypeRow.add( new UI.Text( 'Fog' ).setWidth( '90px' ) );
|
|
fogTypeRow.add( fogType );
|
|
|
|
container.add( fogTypeRow );
|
|
|
|
// fog color
|
|
|
|
var fogColorRow = new UI.Panel();
|
|
fogColorRow.setDisplay( 'none' );
|
|
|
|
var fogColor = new UI.Color().setValue( '#aaaaaa' )
|
|
fogColor.onChange( function () {
|
|
|
|
signals.fogColorChanged.dispatch( fogColor.getHexValue() );
|
|
|
|
} );
|
|
|
|
fogColorRow.add( new UI.Text( 'Fog color' ).setWidth( '90px' ) );
|
|
fogColorRow.add( fogColor );
|
|
|
|
container.add( fogColorRow );
|
|
|
|
// fog near
|
|
|
|
var fogNearRow = new UI.Panel();
|
|
fogNearRow.setDisplay( 'none' );
|
|
|
|
var fogNear = new UI.Number( 1 ).setWidth( '60px' ).setRange( 0, Infinity ).onChange( updateFogParameters );
|
|
|
|
fogNearRow.add( new UI.Text( 'Fog near' ).setWidth( '90px' ) );
|
|
fogNearRow.add( fogNear );
|
|
|
|
container.add( fogNearRow );
|
|
|
|
var fogFarRow = new UI.Panel();
|
|
fogFarRow.setDisplay( 'none' );
|
|
|
|
// fog far
|
|
|
|
var fogFar = new UI.Number( 5000 ).setWidth( '60px' ).setRange( 0, Infinity ).onChange( updateFogParameters );
|
|
|
|
fogFarRow.add( new UI.Text( 'Fog far' ).setWidth( '90px' ) );
|
|
fogFarRow.add( fogFar );
|
|
|
|
container.add( fogFarRow );
|
|
|
|
// fog density
|
|
|
|
var fogDensityRow = new UI.Panel();
|
|
fogDensityRow.setDisplay( 'none' );
|
|
|
|
var fogDensity = new UI.Number( 0.00025 ).setWidth( '60px' ).setRange( 0, 0.1 ).setPrecision( 5 ).onChange( updateFogParameters );
|
|
|
|
fogDensityRow.add( new UI.Text( 'Fog density' ).setWidth( '90px' ) );
|
|
fogDensityRow.add( fogDensity );
|
|
|
|
container.add( fogDensityRow );
|
|
|
|
//
|
|
|
|
var refreshUI = function () {
|
|
|
|
var camera = editor.camera;
|
|
var scene = editor.scene;
|
|
|
|
var options = [];
|
|
|
|
// options.push( { value: camera.id, html: '<span class="type ' + camera.type + '"></span> ' + camera.name } );
|
|
options.push( { static: true, value: scene.id, html: '<span class="type ' + scene.type + '"></span> ' + scene.name } );
|
|
|
|
( function addObjects( objects, pad ) {
|
|
|
|
for ( var i = 0, l = objects.length; i < l; i ++ ) {
|
|
|
|
var object = objects[ i ];
|
|
|
|
var html = pad + '<span class="type ' + object.type + '"></span> ' + object.name;
|
|
|
|
if ( object instanceof THREE.Mesh ) {
|
|
|
|
var geometry = object.geometry;
|
|
var material = object.material;
|
|
|
|
html += ' <span class="type ' + geometry.type + '"></span> ' + geometry.name;
|
|
html += ' <span class="type ' + material.type + '"></span> ' + material.name;
|
|
|
|
}
|
|
|
|
options.push( { value: object.id, html: html } );
|
|
|
|
addObjects( object.children, pad + ' ' );
|
|
|
|
}
|
|
|
|
} )( scene.children, ' ' );
|
|
|
|
outliner.setOptions( options );
|
|
|
|
if ( editor.selected !== null ) {
|
|
|
|
outliner.setValue( editor.selected.id );
|
|
|
|
}
|
|
|
|
if ( scene.fog ) {
|
|
|
|
fogColor.setHexValue( scene.fog.color.getHex() );
|
|
|
|
if ( scene.fog instanceof THREE.Fog ) {
|
|
|
|
fogType.setValue( "Fog" );
|
|
fogNear.setValue( scene.fog.near );
|
|
fogFar.setValue( scene.fog.far );
|
|
|
|
} else if ( scene.fog instanceof THREE.FogExp2 ) {
|
|
|
|
fogType.setValue( "FogExp2" );
|
|
fogDensity.setValue( scene.fog.density );
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
fogType.setValue( "None" );
|
|
|
|
}
|
|
|
|
refreshFogUI();
|
|
|
|
};
|
|
|
|
var refreshFogUI = function () {
|
|
|
|
var type = fogType.getValue();
|
|
|
|
fogColorRow.setDisplay( type === 'None' ? 'none' : '' );
|
|
fogNearRow.setDisplay( type === 'Fog' ? '' : 'none' );
|
|
fogFarRow.setDisplay( type === 'Fog' ? '' : 'none' );
|
|
fogDensityRow.setDisplay( type === 'FogExp2' ? '' : 'none' );
|
|
|
|
};
|
|
|
|
refreshUI();
|
|
|
|
// events
|
|
|
|
signals.sceneGraphChanged.add( refreshUI );
|
|
|
|
signals.objectSelected.add( function ( object ) {
|
|
|
|
if ( ignoreObjectSelectedSignal === true ) return;
|
|
|
|
outliner.setValue( object !== null ? object.id : null );
|
|
|
|
} );
|
|
|
|
return container;
|
|
|
|
}
|