Editor: Built in geometries parameter editor starting to work.

editor/index.html

@@ -103,6 +103,7 @@
 		<script src="js/ui/Sidebar.Scene.js"></script>
 		<script src="js/ui/Sidebar.Object3D.js"></script>
 		<script src="js/ui/Sidebar.Geometry.js"></script>
+		<script src="js/ui/Sidebar.Geometry.TorusGeometry.js"></script>
 		<script src="js/ui/Sidebar.Material.js"></script>
 		<script src="js/ui/Viewport.js"></script>
 

editor/js/ui/Sidebar.Geometry.TorusGeometry.js

@@ -0,0 +1,36 @@
+Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
+
+	var container = new UI.Panel();
+	container.setBorderTop( '1px solid #ccc' );
+	container.setPaddingTop( '10px' );
+
+	var geometry = object.geometry;
+
+	// radius
+
+	var objectRadiusRow = new UI.Panel();
+	var objectRadius = new UI.Number( geometry.radius ).onChange( update );
+
+	objectRadiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ).setColor( '#666' ) );
+	objectRadiusRow.add( objectRadius );
+
+	container.add( objectRadiusRow );
+
+	// 
+
+	function update() {
+
+		delete object.__webglInit; // TODO: Remove hack (WebGLRenderer refactoring)
+
+		object.geometry.dispose();
+
+		object.geometry = new THREE.TorusGeometry( objectRadius.getValue(), 40, 8, 6, Math.PI * 2 );
+		object.geometry.computeBoundingSphere();
+
+		signals.objectChanged.dispatch( object );
+
+	}
+
+	return container;
+
+}

editor/js/ui/Sidebar.Geometry.js

@@ -29,7 +29,8 @@ Sidebar.Geometry = function ( signals ) {
 	container.setDisplay( 'none' );
 	container.setPadding( '10px' );
 
-	container.add( new UI.Text( 'GEOMETRY' ).setColor( '#666' ) );
+	var objectType = new UI.Text().setColor( '#666' ).setTextTransform( 'uppercase' );
+	container.add( objectType );
 	container.add( new UI.Break(), new UI.Break() );
 
 	// name
@@ -42,16 +43,6 @@ Sidebar.Geometry = function ( signals ) {
 
 	container.add( geometryNameRow );
 
-	// class
-
-	var geometryClassRow = new UI.Panel();
-	var geometryClass = new UI.Text().setColor( '#444' ).setFontSize( '12px' );
-
-	geometryClassRow.add( new UI.Text( 'Class' ).setWidth( '90px' ).setColor( '#666' ) );
-	geometryClassRow.add( geometryClass );
-
-	container.add( geometryClassRow );
-
 	// vertices
 
 	var geometryVerticesRow = new UI.Panel();
@@ -72,6 +63,10 @@ Sidebar.Geometry = function ( signals ) {
 
 	container.add( geometryFacesRow );
 
+	// parameters
+
+	var parameters;
+
 
 	//
 
@@ -95,11 +90,28 @@ Sidebar.Geometry = function ( signals ) {
 
 			container.setDisplay( 'block' );
 
+			objectType.setValue( getGeometryInstanceName( object.geometry ) );
+
 			geometryName.setValue( object.geometry.name );
-			geometryClass.setValue( getGeometryInstanceName( object.geometry ) );
 			geometryVertices.setValue( object.geometry.vertices.length );
 			geometryFaces.setValue( object.geometry.faces.length );
 
+			//
+
+			if ( parameters !== undefined ) {
+
+				container.remove( parameters );
+				parameters = undefined;
+
+			}
+
+			if ( selected instanceof THREE.TorusGeometry ) {
+
+				parameters = new Sidebar.Geometry.TorusGeometry( signals, object );
+				container.add( parameters );
+
+			}
+
 		} else {
 
 			selected = null;

editor/js/ui/Sidebar.Object3D.js

@@ -18,7 +18,7 @@ Sidebar.Object3D = function ( signals ) {
 	container.setDisplay( 'none' );
 	container.setPadding( '10px' );
 
-	var objectType = new UI.Text().setColor( '#666' );
+	var objectType = new UI.Text().setColor( '#666' ).setTextTransform( 'uppercase' );
 	container.add( objectType );
 	container.add( new UI.Break(), new UI.Break() );
 
@@ -384,7 +384,7 @@ Sidebar.Object3D = function ( signals ) {
 
 			container.setDisplay( 'block' );
 
-			objectType.setValue( getObjectInstanceName( object ).toUpperCase() );
+			objectType.setValue( getObjectInstanceName( object ) );
 
 			objectName.setValue( object.name );
 

editor/js/ui/Viewport.js

@@ -324,6 +324,26 @@ var Viewport = function ( signals ) {
 
 	} );
 
+	signals.objectSelected.add( function ( object ) {
+
+		selectionBox.visible = false;
+		selectionAxis.visible = false;
+
+		if ( object !== null ) {
+
+			updateSelectionBox( object );
+
+			selectionAxis.matrixWorld = object.matrixWorld;
+			selectionAxis.visible = true;
+
+			selected = object;
+
+		}
+
+		render();
+
+	} );
+
 	signals.objectChanged.add( function ( object ) {
 
 		if ( object instanceof THREE.Camera ) {
@@ -338,6 +358,8 @@ var Viewport = function ( signals ) {
 
 		}
 
+		updateSelectionBox( object );
+
 		signals.sceneChanged.dispatch( scene );
 
 		render();
@@ -406,76 +428,6 @@ var Viewport = function ( signals ) {
 
 	} );
 
-	signals.objectSelected.add( function ( object ) {
-
-		selectionBox.visible = false;
-		selectionAxis.visible = false;
-
-		if ( object !== null ) {
-
-			if ( object.geometry !== undefined ) {
-
-				var geometry = object.geometry;
-
-				if ( geometry.boundingBox === null ) {
-
-					geometry.computeBoundingBox();
-
-				}
-
-				var vertices = selectionBox.geometry.vertices;
-
-				vertices[ 0 ].x = geometry.boundingBox.max.x;
-				vertices[ 0 ].y = geometry.boundingBox.max.y;
-				vertices[ 0 ].z = geometry.boundingBox.max.z;
-
-				vertices[ 1 ].x = geometry.boundingBox.max.x;
-				vertices[ 1 ].y = geometry.boundingBox.max.y;
-				vertices[ 1 ].z = geometry.boundingBox.min.z;
-
-				vertices[ 2 ].x = geometry.boundingBox.max.x;
-				vertices[ 2 ].y = geometry.boundingBox.min.y;
-				vertices[ 2 ].z = geometry.boundingBox.max.z;
-
-				vertices[ 3 ].x = geometry.boundingBox.max.x;
-				vertices[ 3 ].y = geometry.boundingBox.min.y;
-				vertices[ 3 ].z = geometry.boundingBox.min.z;
-
-				vertices[ 4 ].x = geometry.boundingBox.min.x;
-				vertices[ 4 ].y = geometry.boundingBox.max.y;
-				vertices[ 4 ].z = geometry.boundingBox.min.z;
-
-				vertices[ 5 ].x = geometry.boundingBox.min.x;
-				vertices[ 5 ].y = geometry.boundingBox.max.y;
-				vertices[ 5 ].z = geometry.boundingBox.max.z;
-
-				vertices[ 6 ].x = geometry.boundingBox.min.x;
-				vertices[ 6 ].y = geometry.boundingBox.min.y;
-				vertices[ 6 ].z = geometry.boundingBox.min.z;
-
-				vertices[ 7 ].x = geometry.boundingBox.min.x;
-				vertices[ 7 ].y = geometry.boundingBox.min.y;
-				vertices[ 7 ].z = geometry.boundingBox.max.z;
-
-				selectionBox.geometry.computeBoundingSphere();
-				selectionBox.geometry.verticesNeedUpdate = true;
-
-				selectionBox.matrixWorld = object.matrixWorld;
-				selectionBox.visible = true;
-
-			}
-
-			selectionAxis.matrixWorld = object.matrixWorld;
-			selectionAxis.visible = true;
-
-			selected = object;
-
-		}
-
-		render();
-
-	} );
-
 	signals.materialChanged.add( function ( material ) {
 
 		render();
@@ -610,6 +562,62 @@ var Viewport = function ( signals ) {
 
 	//
 
+	function updateSelectionBox( object ) {
+
+		if ( object.geometry !== undefined ) {
+
+			var geometry = object.geometry;
+
+			if ( geometry.boundingBox === null ) {
+
+				geometry.computeBoundingBox();
+
+			}
+
+			var vertices = selectionBox.geometry.vertices;
+
+			vertices[ 0 ].x = geometry.boundingBox.max.x;
+			vertices[ 0 ].y = geometry.boundingBox.max.y;
+			vertices[ 0 ].z = geometry.boundingBox.max.z;
+
+			vertices[ 1 ].x = geometry.boundingBox.max.x;
+			vertices[ 1 ].y = geometry.boundingBox.max.y;
+			vertices[ 1 ].z = geometry.boundingBox.min.z;
+
+			vertices[ 2 ].x = geometry.boundingBox.max.x;
+			vertices[ 2 ].y = geometry.boundingBox.min.y;
+			vertices[ 2 ].z = geometry.boundingBox.max.z;
+
+			vertices[ 3 ].x = geometry.boundingBox.max.x;
+			vertices[ 3 ].y = geometry.boundingBox.min.y;
+			vertices[ 3 ].z = geometry.boundingBox.min.z;
+
+			vertices[ 4 ].x = geometry.boundingBox.min.x;
+			vertices[ 4 ].y = geometry.boundingBox.max.y;
+			vertices[ 4 ].z = geometry.boundingBox.min.z;
+
+			vertices[ 5 ].x = geometry.boundingBox.min.x;
+			vertices[ 5 ].y = geometry.boundingBox.max.y;
+			vertices[ 5 ].z = geometry.boundingBox.max.z;
+
+			vertices[ 6 ].x = geometry.boundingBox.min.x;
+			vertices[ 6 ].y = geometry.boundingBox.min.y;
+			vertices[ 6 ].z = geometry.boundingBox.min.z;
+
+			vertices[ 7 ].x = geometry.boundingBox.min.x;
+			vertices[ 7 ].y = geometry.boundingBox.min.y;
+			vertices[ 7 ].z = geometry.boundingBox.max.z;
+
+			selectionBox.geometry.computeBoundingSphere();
+			selectionBox.geometry.verticesNeedUpdate = true;
+
+			selectionBox.matrixWorld = object.matrixWorld;
+			selectionBox.visible = true;
+
+		}
+
+	}
+
 	function updateMaterials( root ) {
 
 		root.traverse( function ( node ) {