Sidebar.Geometry.ShapeGeometry.js 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. import * as THREE from 'three';
  2. import { UIDiv, UIRow, UIText, UIInteger, UIButton } from './libs/ui.js';
  3. import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
  4. function GeometryParametersPanel( editor, object ) {
  5. const strings = editor.strings;
  6. const signals = editor.signals;
  7. const container = new UIDiv();
  8. const geometry = object.geometry;
  9. const parameters = geometry.parameters;
  10. // curveSegments
  11. const curveSegmentsRow = new UIRow();
  12. const curveSegments = new UIInteger( parameters.curveSegments || 12 ).onChange( changeShape ).setRange( 1, Infinity );
  13. curveSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/shape_geometry/curveSegments' ) ).setClass( 'Label' ) );
  14. curveSegmentsRow.add( curveSegments );
  15. container.add( curveSegmentsRow );
  16. // to extrude
  17. const button = new UIButton( strings.getKey( 'sidebar/geometry/shape_geometry/extrude' ) ).onClick( toExtrude ).setClass( 'Label' ).setMarginLeft( '120px' );
  18. container.add( button );
  19. //
  20. function refreshUI() {
  21. const parameters = object.geometry.parameters;
  22. curveSegments.setValue( parameters.curveSegments );
  23. }
  24. signals.geometryChanged.add( function ( mesh ) {
  25. if ( mesh === object ) {
  26. refreshUI();
  27. }
  28. } );
  29. //
  30. function changeShape() {
  31. editor.execute( new SetGeometryCommand( editor, object, new THREE.ShapeGeometry(
  32. parameters.shapes,
  33. curveSegments.getValue()
  34. ) ) );
  35. }
  36. function toExtrude() {
  37. editor.execute( new SetGeometryCommand( editor, object, new THREE.ExtrudeGeometry(
  38. parameters.shapes, {
  39. curveSegments: curveSegments.getValue()
  40. }
  41. ) ) );
  42. }
  43. return container;
  44. }
  45. export { GeometryParametersPanel };