Sidebar.Project.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. Sidebar.Project = function ( editor ) {
  5. var config = editor.config;
  6. var signals = editor.signals;
  7. var rendererTypes = {
  8. 'WebGLRenderer': THREE.WebGLRenderer,
  9. 'CanvasRenderer': THREE.CanvasRenderer,
  10. 'SVGRenderer': THREE.SVGRenderer,
  11. 'SoftwareRenderer': THREE.SoftwareRenderer,
  12. 'RaytracingRenderer': THREE.RaytracingRenderer
  13. };
  14. var container = new UI.CollapsiblePanel();
  15. container.setCollapsed( config.getKey( 'ui/sidebar/project/collapsed' ) );
  16. container.onCollapsedChange( function ( boolean ) {
  17. config.setKey( 'ui/sidebar/project/collapsed', boolean );
  18. } );
  19. container.addStatic( new UI.Text( 'PROJECT' ) );
  20. container.add( new UI.Break() );
  21. // class
  22. var options = {};
  23. for ( var key in rendererTypes ) {
  24. if ( key.indexOf( 'WebGL' ) >= 0 && System.support.webgl === false ) continue;
  25. options[ key ] = key;
  26. }
  27. var rendererTypeRow = new UI.Panel();
  28. var rendererType = new UI.Select().setOptions( options ).setWidth( '150px' ).onChange( function () {
  29. var value = this.getValue();
  30. config.setKey( 'project/renderer', value );
  31. updateRenderer();
  32. } );
  33. rendererTypeRow.add( new UI.Text( 'Renderer' ).setWidth( '90px' ) );
  34. rendererTypeRow.add( rendererType );
  35. container.add( rendererTypeRow );
  36. if ( config.getKey( 'project/renderer' ) !== undefined ) {
  37. rendererType.setValue( config.getKey( 'project/renderer' ) );
  38. }
  39. // antialiasing
  40. var rendererPropertiesRow = new UI.Panel();
  41. rendererPropertiesRow.add( new UI.Text( '' ).setWidth( '90px' ) );
  42. var rendererAntialias = new UI.THREE.Boolean( config.getKey( 'project/renderer/antialias' ), 'antialias' ).onChange( function () {
  43. config.setKey( 'project/renderer/antialias', this.getValue() );
  44. updateRenderer();
  45. } );
  46. rendererPropertiesRow.add( rendererAntialias );
  47. // shadow
  48. var rendererShadows = new UI.THREE.Boolean( config.getKey( 'project/renderer/shadows' ), 'shadows' ).onChange( function () {
  49. config.setKey( 'project/renderer/shadows', this.getValue() );
  50. updateRenderer();
  51. } );
  52. rendererPropertiesRow.add( rendererShadows );
  53. container.add( rendererPropertiesRow );
  54. // VR
  55. var vrRow = new UI.Panel();
  56. var vr = new UI.Checkbox( config.getKey( 'project/vr' ) ).setLeft( '100px' ).onChange( function () {
  57. config.setKey( 'project/vr', this.getValue() );
  58. // updateRenderer();
  59. } );
  60. vrRow.add( new UI.Text( 'VR' ).setWidth( '90px' ) );
  61. vrRow.add( vr );
  62. container.add( vrRow );
  63. //
  64. function updateRenderer() {
  65. createRenderer( rendererType.getValue(), rendererAntialias.getValue(), rendererShadows.getValue() );
  66. }
  67. function createRenderer( type, antialias, shadows ) {
  68. if ( type === 'WebGLRenderer' && System.support.webgl === false ) {
  69. type = 'CanvasRenderer';
  70. }
  71. rendererPropertiesRow.setDisplay( type === 'WebGLRenderer' ? '' : 'none' );
  72. var renderer = new rendererTypes[ type ]( { antialias: antialias } );
  73. if ( shadows && renderer.shadowMap ) renderer.shadowMap.enabled = true;
  74. signals.rendererChanged.dispatch( renderer );
  75. }
  76. createRenderer( config.getKey( 'project/renderer' ), config.getKey( 'project/renderer/antialias' ), config.getKey( 'project/renderer/shadows' ) );
  77. return container;
  78. }