populating lattice view stats

css/main.css

@@ -68,6 +68,8 @@ nav .btn {
     position: absolute;
 }
 
+/*menus*/
+
 #menuWrapper {
     width: 400px;
     height: 100%;
@@ -79,8 +81,6 @@ nav .btn {
     overflow:hidden;
 }
 
-/*menus*/
-
 .slider-selection {
 	background: #BABABA;
 }
@@ -123,6 +123,8 @@ nav .btn {
 
 #menuContent{
     padding: 30px;
+    /*min-height:100%;*/
+    overflow-y: auto;
 }
 
 

js/main.js

@@ -9,20 +9,13 @@ $(function(){
 
 
     //init threeJS
-    var threeModel = new ThreeModel();
-    window.three = threeModel;
-
-    //backbone models and views
-//    var fillGeometry = new FillGeometry();//singleton, mesh to fill with lattice
-//    new ImportView({model: fillGeometry});
-//    var fillGeometryView = new FillGeometryView({model: fillGeometry, three:threeModel});
-
+    window.three = new ThreeModel();
 
     var lattice = new Lattice();
-    var threeView = new ThreeView({model:threeModel, lattice:lattice});
+    new ThreeView({model:window.three, lattice:lattice});
 
 
     //setup ui
-    var menu = MenuWrapper();
+    var menu = MenuWrapper({lattice:lattice});
     NavBar(menu);
 });

js/menus/LatticeMenuView.js

@@ -13,17 +13,26 @@ LatticeMenuView = Backbone.View.extend({
     initialize: function(){
 
         _.bindAll(this, "render");
+        this.listenTo(this.model, "change", this.render);
+    },
+
+    _formatData: function(){
+        var formattedCellType = "Octagon";
+        var formattedConnectionType = "Face-Connected";
+        return {formattedCellType:formattedCellType, formattedConnectionType:formattedConnectionType};
     },
 
     render: function(){
-        this.$el.html(this.template());
+        console.log("latticerender");
+        this.$el.html(this.template(_.extend(this.model.attributes, this._formatData())));
     },
 
     template: _.template('\
         Cell Type: <br/>\
         Cell Connection:<br/>\
-        Scale:<br/>\
+        Scale:&nbsp;&nbsp;<%= scale %><br/>\
         Column Separation:<br/><br/>\
+        NumCells:&nbsp;&nbsp;<%= numCells %><br/>\
         <a href="#" class=" btn btn-block btn-lg btn-default">Clear All Cells</a><br/>\
         ')
 

js/menus/MenuWrapper.js

@@ -3,12 +3,12 @@
  */
 
 
-function MenuWrapper(){
+function MenuWrapper(args){
 
     var $el = $("#menuWrapper");
 
     //init all tab view controllers
-    var latticeMenu = new LatticeMenuView();
+    var latticeMenu = new LatticeMenuView({model:args.lattice});
     var importMenu = new ImportMenuView();
     var sketchMenu = new SketchMenuView();
     var partMenu = new PartMenuView();

js/models/lattice.js

@@ -7,9 +7,11 @@ Lattice = Backbone.Model.extend({
 
     defaults: {
         scale: 30.0,
-        type: "octagonFace",
+        cellType: "octa",
+        connectionType: "face",
         nodes: [],
-        cells: []
+        cells: [],
+        numCells: 0
     },
 
     //pass in fillGeometry
@@ -21,11 +23,13 @@ Lattice = Backbone.Model.extend({
 
     addCell: function(position){
         new Cell(position);
+        this.set("numCells", this.get("numCells")+1);
         window.three.render();
     },
 
     removeCell: function(object){
         window.three.sceneRemove(object);
+        this.set("numCells", this.get("numCells")-1);
         window.three.render();
     },
 
@@ -34,6 +38,7 @@ Lattice = Backbone.Model.extend({
             cell.remove();
         });
         this.set("cells", []);
+        this.set("numCells, 0");
     }
 
 });
\ No newline at end of file

js/threeViews/threeView.js

@@ -185,7 +185,8 @@ ThreeView = Backbone.View.extend({
 
         this.lattice.clearCells();
 
-        var type = this.lattice.get("type");
+        var type = this.lattice.get("cellType");
+        var connectionType = this.lattice.get("connectionType");
 
         var baseDim = 100;
         var gridSize = this.lattice.get("scale");
@@ -195,7 +196,7 @@ ThreeView = Backbone.View.extend({
         var vertices = geometry.vertices;
         var faces = geometry.faces;
 
-        if (type == "octagonFace" || type == "octagonEdge"){
+        if (type == "octa" && (connectionType == "face" || connectionType == "edge")){
 
             this.lattice.addCell(new THREE.Vector3(0,0,0));
             var triangleHeight = gridSize/2*Math.sqrt(3);
@@ -224,7 +225,7 @@ ThreeView = Backbone.View.extend({
             }
 
 
-        } else if (type == "octagonVertex"){
+        } else if (type == "octa" && connectionType == "vertex"){
 
 //            geometry.vertices.push(new THREE.Vector3(-baseSize, 0, 0));
 //            geometry.vertices.push(new THREE.Vector3(baseSize, 0, 0));