Editor: Add capsule geometry. (#23914)

editor/js/Menubar.Add.js

@@ -55,6 +55,23 @@ function MenubarAdd( editor ) {
 	} );
 	options.add( option );
 
+	// Capsule
+
+	option = new UIRow();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/capsule' ) );
+	option.onClick( function () {
+
+		const geometry = new THREE.CapsuleGeometry( 1, 1, 4, 8 );
+		const material = new THREE.MeshStandardMaterial();
+		const mesh = new THREE.Mesh( geometry, material );
+		mesh.name = 'Capsule';
+
+		editor.execute( new AddObjectCommand( editor, mesh ) );
+
+	} );
+	options.add( option );
+
 	// Circle
 
 	option = new UIRow();

editor/js/Sidebar.Geometry.CapsuleGeometry.js

@@ -0,0 +1,73 @@
+import * as THREE from 'three';
+
+import { UIDiv, UIRow, UIText, UINumber, UIInteger } from './libs/ui.js';
+
+import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
+
+function GeometryParametersPanel( editor, object ) {
+
+	const strings = editor.strings;
+
+	const container = new UIDiv();
+
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
+
+	// radius
+
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
+
+	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/capsule_geometry/radius' ) ).setWidth( '90px' ) );
+	radiusRow.add( radius );
+
+	container.add( radiusRow );
+
+	// length
+
+	const lengthRow = new UIRow();
+	const length = new UINumber( parameters.height ).onChange( update );
+
+	lengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/capsule_geometry/length' ) ).setWidth( '90px' ) );
+	lengthRow.add( length );
+
+	container.add( lengthRow );
+
+	// capSegments
+
+	const capSegmentsRow = new UIRow();
+	const capSegments = new UINumber( parameters.capSegments ).onChange( update );
+
+	capSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/capsule_geometry/capseg' ) ).setWidth( '90px' ) );
+	capSegmentsRow.add( capSegments );
+
+	container.add( capSegmentsRow );
+
+	// radialSegments
+
+	const radialSegmentsRow = new UIRow();
+	const radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
+
+	radialSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/capsule_geometry/radialseg' ) ).setWidth( '90px' ) );
+	radialSegmentsRow.add( radialSegments );
+
+	container.add( radialSegmentsRow );
+
+	//
+
+	function update() {
+
+		editor.execute( new SetGeometryCommand( editor, object, new THREE.CapsuleGeometry(
+			radius.getValue(),
+			length.getValue(),
+			capSegments.getValue(),
+			radialSegments.getValue()
+		) ) );
+
+	}
+
+	return container;
+
+}
+
+export { GeometryParametersPanel };

editor/js/Strings.js

@@ -37,6 +37,7 @@ function Strings( config ) {
 			'menubar/add/group': 'Group',
 			'menubar/add/plane': 'Plane',
 			'menubar/add/box': 'Box',
+			'menubar/add/capsule': 'Capsule',
 			'menubar/add/circle': 'Circle',
 			'menubar/add/cylinder': 'Cylinder',
 			'menubar/add/ring': 'Ring',
@@ -144,6 +145,11 @@ function Strings( config ) {
 			'sidebar/geometry/buffer_geometry/attributes': 'Attributes',
 			'sidebar/geometry/buffer_geometry/index': 'index',
 
+			'sidebar/geometry/capsule_geometry/radius': 'Radius',
+			'sidebar/geometry/capsule_geometry/length': 'Length',
+			'sidebar/geometry/capsule_geometry/capseg': 'Cap Seg',
+			'sidebar/geometry/capsule_geometry/radialseg': 'Radial Seg',
+
 			'sidebar/geometry/circle_geometry/radius': 'Radius',
 			'sidebar/geometry/circle_geometry/segments': 'Segments',
 			'sidebar/geometry/circle_geometry/thetastart': 'Theta start',
@@ -365,6 +371,7 @@ function Strings( config ) {
 			'menubar/add/group': 'Groupe',
 			'menubar/add/plane': 'Plan',
 			'menubar/add/box': 'Cube',
+			'menubar/add/capsule': 'Capsule',
 			'menubar/add/circle': 'Cercle',
 			'menubar/add/cylinder': 'Cylindre',
 			'menubar/add/ring': 'Bague',
@@ -472,6 +479,11 @@ function Strings( config ) {
 			'sidebar/geometry/buffer_geometry/attributes': 'Attributs',
 			'sidebar/geometry/buffer_geometry/index': 'index',
 
+			'sidebar/geometry/capsule_geometry/radius': 'Radius',
+			'sidebar/geometry/capsule_geometry/length': 'Length',
+			'sidebar/geometry/capsule_geometry/capseg': 'Cap Seg',
+			'sidebar/geometry/capsule_geometry/radialseg': 'Radial Seg',
+
 			'sidebar/geometry/circle_geometry/radius': 'Rayon',
 			'sidebar/geometry/circle_geometry/segments': 'Segments',
 			'sidebar/geometry/circle_geometry/thetastart': 'Début Thêta (°)',
@@ -693,6 +705,7 @@ function Strings( config ) {
 			'menubar/add/group': '组',
 			'menubar/add/plane': '平面',
 			'menubar/add/box': '正方体',
+			'menubar/add/capsule': '胶囊',
 			'menubar/add/circle': '圆',
 			'menubar/add/cylinder': '圆柱体',
 			'menubar/add/ring': '环',
@@ -800,6 +813,11 @@ function Strings( config ) {
 			'sidebar/geometry/buffer_geometry/attributes': '属性',
 			'sidebar/geometry/buffer_geometry/index': '索引',
 
+			'sidebar/geometry/capsule_geometry/radius': '半径',
+			'sidebar/geometry/capsule_geometry/length': '长度',
+			'sidebar/geometry/capsule_geometry/capseg': '胶囊分段',
+			'sidebar/geometry/capsule_geometry/radialseg': '半径分段',
+
 			'sidebar/geometry/circle_geometry/radius': '半径',
 			'sidebar/geometry/circle_geometry/segments': '分段',
 			'sidebar/geometry/circle_geometry/thetastart': '弧度起点',

editor/sw.js

@@ -158,6 +158,7 @@ const assets = [
 	'./js/Sidebar.Geometry.BufferGeometry.js',
 	'./js/Sidebar.Geometry.Modifiers.js',
 	'./js/Sidebar.Geometry.BoxGeometry.js',
+	'./js/Sidebar.Geometry.CapsuleGeometry.js',
 	'./js/Sidebar.Geometry.CircleGeometry.js',
 	'./js/Sidebar.Geometry.CylinderGeometry.js',
 	'./js/Sidebar.Geometry.DodecahedronGeometry.js',