eod

js/menus/PartMenuView.js

@@ -7,6 +7,7 @@ PartMenuView = Backbone.View.extend({
     el: "#menuContent",
 
     events: {
+        "slide #columnSepSlider":                           "_changeColSeparation"
     },
 
     initialize: function(options){
@@ -18,6 +19,10 @@ PartMenuView = Backbone.View.extend({
 
     },
 
+    _changeColSeparation: function(e){
+        this.model.set("columnSeparation", $(e.target).val());
+    },
+
     render: function(){
         if (this.appState.get("currentTab") != "part") return;
         this.$el.html(this.template(this.model.attributes));
@@ -40,7 +45,6 @@ PartMenuView = Backbone.View.extend({
                 </ul>\
             </div><br/><br/>\
         Column Separation:&nbsp;&nbsp;<input id="columnSepSlider" data-slider-id="ex1Slider" type="text" data-slider-min="0" data-slider-max="50" data-slider-step="0.1" data-slider-value="<%= scale %>"/>\
-        <br/><input id="columnSep" value="<%= scale %>" placeholder="enter scale" class="form-control" type="text"><br/>\<br/>\
         ')
 
 });
\ No newline at end of file

js/models/BasePlane.js

@@ -28,6 +28,12 @@ BasePlane = Backbone.Model.extend({
 
     },
 
+    updateColSeparation: function(colSep){
+        var geometry = this.get("mesh").geometry;
+        geometry.vertices = this._calcOctaFaceVertices();
+        geometry.verticesNeedUpdate = true;
+    },
+
     _renderZIndexChange: function(){
         var zIndex = this.get("zIndex");
         var scale = this.get("mesh").scale.z;
@@ -66,24 +72,20 @@ BasePlane = Backbone.Model.extend({
     _createOctaFaceMesh: function(){
 
         var geometry = new THREE.Geometry();
-        var vertices = geometry.vertices;
+        geometry.dynamic = true;
+        geometry.vertices = this._calcOctaFaceVertices();
         var faces = geometry.faces;
 
-        var triangleHeight = 1/2*Math.sqrt(3);
         var dimX = this.get("dimX");
         var dimY = this.get("dimY");
 
+        var currentOffset = 0;
         for (var j=-dimX;j<=dimX;j++){
             for (var i=-dimY;i<=dimY;i++){
 
-                var xOffset = 0;
-                if (Math.abs(j)%2==1) xOffset = 1/2;
-                vertices.push(new THREE.Vector3(i + xOffset, j*triangleHeight, 0));
-
+                currentOffset++;
                 if (j == -dimX || i == -dimY) continue;
 
-                var currentOffset = vertices.length;
-
                 if (Math.abs(j)%2==1){
 //                        faces.push(new THREE.Face3(currentOffset-1, currentOffset-2, currentOffset-2-2*baseDim));
                     faces.push(new THREE.Face3(currentOffset-2, currentOffset-3-2*dimX, currentOffset-2-2*dimY));
@@ -95,10 +97,34 @@ BasePlane = Backbone.Model.extend({
             }
 
         }
+
         geometry.computeFaceNormals();
         return new THREE.Mesh(geometry, this.get("material"));
     },
 
+    _calcOctaFaceVertices: function(colSep){
+
+        var vertices = [];
+        var triangleHeight = 1/2*Math.sqrt(3);
+        var dimX = this.get("dimX");
+        var dimY = this.get("dimY");
+
+//        var pointVertOffset = triangleHeight*colSep;
+//        var baseVertOffset =
+
+        for (var j=-dimX;j<=dimX;j++){
+            for (var i=-dimY;i<=dimY;i++){
+
+                var xOffset = 0;
+                if (Math.abs(j)%2==1) xOffset = 1/2;
+                vertices.push(new THREE.Vector3(i + xOffset, j*triangleHeight, 0));
+
+            }
+
+        }
+        return vertices;
+    },
+
     _createGridMesh: function(){
         return this._createOctaFaceMesh();
     },

js/models/Lattice.js

@@ -47,6 +47,8 @@ Lattice = Backbone.Model.extend({
         this.set("basePlane", new BasePlane({cellType:this.get("cellType"),
             connectionType:this.get("connectionType"),
             scale:this.get("scale")}));
+
+        this._initialize();//call subclass init
     },
 
     ////////////////////////////////////////////////////////////////////////////////////
@@ -251,6 +253,24 @@ Lattice = Backbone.Model.extend({
 
 OctaFaceLattice = Lattice.extend({
 
+//    defaults: {
+//        columnSeparation: 0.2//% column separation
+//    },
+
+    _initialize: function(){
+
+        this.set("columnSeparation", 0.2);
+
+        //bind events
+        this.listenTo(this, "change:columnSeparation", this._changeColSeparation);
+    },
+
+    _changeColSeparation: function(){
+        var colSep = this.get("columnSeparation");
+        console.log(colSep);
+        this.get("basePlane").updateColSeparation(colSep);
+    },
+
     addCellAtPosition: function(absPosition){
 
         //calc indices in cell matrix