eod

js/models/extrudeVisualizer.js

+/**
+ * Created by aghassaei on 1/22/15.
+ */
+
+
+function ExtrudeVisualizer(){
+
+    var triRad = 30*Math.sqrt(3)/4;
+    var geometry = new THREE.CylinderGeometry(triRad, triRad, 1, 3);//1 unit tall
+    geometry.applyMatrix(new THREE.Matrix4().makeRotationX(Math.PI/2));
+    var material = new THREE.MeshBasicMaterial({color:0xff0000, transparent:true, opacity:0.2});
+    var meshes = [];
+
+    function makeMeshFromProfile(profiles){//profiles is an array of meshes
+        _.each(profiles, function(profile){
+            var mesh = new THREE.Mesh(geometry, material);
+            var profilePos = profile.geometry.vertices[0];
+            mesh.position.x = profilePos.x;
+            mesh.position.y = profilePos.y;
+            mesh.position.z = profilePos.z;
+            window.three.sceneAdd(mesh, false);
+            meshes.push(mesh);
+        });
+        window.three.render();
+    }
+
+    function makeHandle(){
+
+    }
+
+    function getMeshNum(){
+        return meshes.length;
+    }
+
+    function dragHandle(height){
+        _.each(meshes, function(mesh){
+            mesh.scale.z = height;
+        })
+        window.three.render();
+    }
+
+    function renderIntoCells(){
+
+    }
+
+    return {//return public properties/methods
+        makeMeshFromProfile:makeMeshFromProfile,
+        getMeshNum:getMeshNum,
+        dragHandle:dragHandle
+    }
+}
\ No newline at end of file

js/models/lattice.js

@@ -24,6 +24,11 @@ Lattice = Backbone.Model.extend({
         window.three.render();
     },
 
+    removeCell: function(object){
+        window.three.sceneRemove(object);
+        window.three.render();
+    },
+
     clearCells: function(){
         _.each(this.get("cells"), function(cell){
             cell.remove();

js/models/threeModel.js

@@ -76,7 +76,7 @@ function ThreeModel(){
         render();
     }
 
-    return {//return public properties
+    return {//return public properties/methods
         render:render,
         clearAll: clearAll,
         sceneRemove:sceneRemove,

js/threeViews/threeView.js

@@ -13,6 +13,8 @@ ThreeView = Backbone.View.extend({
     mouseIsDown: false,//store state of mouse click
     shiftIsDown: false,//used to add many voxels at once
     deleteMode: false,//delete cells instead of adding (space bar)
+    extrudeMode: false,//extrude a column of cells
+    extrudeVisualizer: ExtrudeVisualizer(),
     mouseProjection: new THREE.Raycaster(),
     highlighter: null,
     currentHighlightedFace: null,
@@ -75,7 +77,14 @@ ThreeView = Backbone.View.extend({
             case 32://space bar
                 this.deleteMode = state;
                 this.controls.enabled = !state;
+                break;
+            case 69://e
+                this.extrudeMode = state;
+                this.controls.enabled = !state;
+                break;
+
             default:
+                break;
         }
     },
 
@@ -95,11 +104,17 @@ ThreeView = Backbone.View.extend({
             return;
         }
 
+        if (this.extrudeMode && this.mouseIsDown && this.extrudeVisualizer.getMeshNum()>0){
+            this.extrudeVisualizer.dragHandle(1-2*(e.pageY-this.$el.offset().top)/this.$el.height());
+            return;
+        }
+
         //make projection vector
         var vector = new THREE.Vector2(2*(e.pageX-this.$el.offset().left)/this.$el.width()-1, 1-2*(e.pageY-this.$el.offset().top)/this.$el.height());
         var camera = this.model.camera;
         this.mouseProjection.setFromCamera(vector, camera);
 
+
         //check if we're intersecting anything
         var intersections = this.mouseProjection.intersectObjects(this.model.objects, true);
         if (intersections.length == 0) {
@@ -115,6 +130,12 @@ ThreeView = Backbone.View.extend({
             return;
         }
 
+        if (this.extrudeMode && this.mouseIsDown){
+            if (!this.highlighter.visible) return;
+            this.extrudeVisualizer.makeMeshFromProfile([this.highlighter]);
+            return;
+        }
+
         //check if we've moved to a new face
         var intersection = intersections[0].face;
         if (this.highlighter.visible && this.currentHighlightedFace == intersection) return;
@@ -145,8 +166,7 @@ ThreeView = Backbone.View.extend({
 
         if (this.deleteMode){
             if (this.currentIntersectedObject === this.basePlane) return;
-            window.three.sceneRemove(this.currentIntersectedObject);
-            window.three.render();
+            this.lattice.removeCell(this.currentIntersectedObject);
         } else {
             if (!this.highlighter.visible) return;
             this.lattice.addCell(this.highlighter.geometry.vertices[0]);
@@ -234,6 +254,6 @@ ThreeView = Backbone.View.extend({
 
         console.log("scale base plane");
 
-    },
+    }
 
 });
\ No newline at end of file

main.html

@@ -49,6 +49,7 @@
     <script src="js/models/threeModel.js"></script>
     <script src="js/models/fillGeometry.js"></script>
     <script src="js/models/lattice.js"></script>
+    <script src="js/models/extrudeVisualizer.js"></script>
 
     <!--views-->
     <script src="js/threeViews/meshHandle.js"></script>