From dafecd3f479fd8c10d91336bd3082137a61c520f Mon Sep 17 00:00:00 2001
From: Amanda Ghassaei <amandaghassaei@gmail.com>
Date: Thu, 26 Mar 2015 02:56:56 -0400
Subject: [PATCH] cell visibility
---
css/main.css | 14 +++++++++-----
js/menus/Ribbon.js | 10 +++++++++-
js/models/AppState.js | 1 +
js/models/Lattice.js | 6 ++++++
4 files changed, 25 insertions(+), 6 deletions(-)
diff --git a/css/main.css b/css/main.css
index f84278ef..13487c6b 100644
--- a/css/main.css
+++ b/css/main.css
@@ -250,7 +250,7 @@ input.numberInput{
#navRibbon{
height: 49px;
- width: 320px;
+ width: 370px;
z-index: 1;
display: block;
position: absolute;
@@ -272,11 +272,15 @@ input.numberInput{
height: 49px;
}
+.btn-ribbon span{
+ font-size: 28px!important;
+ display: block;
+ margin-top: 4px!important;
+ color: #7C7B7B;
+}
+
.fui-cross{
- font-size: 28px!important;
- display: block;
- margin-top: 4px!important;
- color: #B50303;
+ color: #B50303!important;
}
.ribbon-selected {
diff --git a/js/menus/Ribbon.js b/js/menus/Ribbon.js
index 4c269fa9..e811836d 100644
--- a/js/menus/Ribbon.js
+++ b/js/menus/Ribbon.js
@@ -10,7 +10,8 @@ Ribbon = Backbone.View.extend({
events: {
"click .cellModeBtn": "_updateCellMode",
"click .deleteMode": "_updateDeleteMode",
- "click .highlightMode": "_updateHighlightMode"
+ "click .highlightMode": "_updateHighlightMode",
+ "click .cellsVisible": "_updateVisibility"
},
initialize: function(){
@@ -20,6 +21,7 @@ Ribbon = Backbone.View.extend({
this.listenTo(this.model, "change:cellMode", this.render);
this.listenTo(this.model, "change:deleteMode", this.render);
this.listenTo(this.model, "change:highlightMode", this.render);
+ this.listenTo(this.model, "change:cellsVisible", this.render);
this.listenTo(dmaGlobals.lattice, "change:cellType change:connectionType", this.render);
this.render();
},
@@ -39,6 +41,11 @@ Ribbon = Backbone.View.extend({
dmaGlobals.appState.set("highlightMode", !dmaGlobals.appState.get("highlightMode"));
},
+ _updateVisibility: function(e){
+ e.preventDefault();
+ dmaGlobals.appState.set("cellsVisible", !dmaGlobals.appState.get("cellsVisible"));
+ },
+
render: function(){
this.$el.html(this.template(_.extend(dmaGlobals.lattice.toJSON(), this.model.toJSON())));
},
@@ -50,6 +57,7 @@ Ribbon = Backbone.View.extend({
<% if (allPartTypes[cellType][connectionType]){ %>\
<a data-type="part" class="btn btn-primary btn-ribbon cellModeBtn<% if (cellMode == "part"){ %> ribbon-selected<% } %>" href="#"><img data-type="part" src="assets/imgs/part-sm.png"></a>\
<% } %>\
+ <a class="btn btn-primary btn-ribbon cellsVisible<% if (cellsVisible){ %> ribbon-selected<% } %>" href="#"><span class="fui-eye"></span></a>\
<a class="btn btn-primary btn-ribbon highlightMode<% if (highlightMode){ %> ribbon-selected<% } %>" href="#"><img data-type="part" src="assets/imgs/cursor-light.png"></a>\
<a class="btn btn-primary btn-ribbon deleteMode<% if (deleteMode){ %> ribbon-selected"<% } %>"><span class="fui-cross"></span></a>\
</div>\
diff --git a/js/models/AppState.js b/js/models/AppState.js
index e1b81f50..595c0743 100644
--- a/js/models/AppState.js
+++ b/js/models/AppState.js
@@ -138,6 +138,7 @@ AppState = Backbone.Model.extend({
highlightMode: true,
extrudeMode: false,
cellMode: "cell",//show cells vs part
+ cellsVisible: true,
stockSimulationPlaying: false,
manualSelectOrigin: false//mode that allows user ot select origin from existing cell
diff --git a/js/models/Lattice.js b/js/models/Lattice.js
index a1eb829e..a05b3f3a 100644
--- a/js/models/Lattice.js
+++ b/js/models/Lattice.js
@@ -39,6 +39,7 @@ Lattice = Backbone.Model.extend({
this.listenTo(this, "change:partType", this._updatePartType);
this.listenTo(this, "change:cellType change:connectionType", this._updateLatticeType);
this.listenTo(this, "change:cellSeparation", this._updateCellSeparation);
+ this.listenTo(options.appState, "change:cellsVisible", this._setCellVisibility);
},
delayedInit: function(){
@@ -352,6 +353,11 @@ Lattice = Backbone.Model.extend({
this.get("basePlane").updateScale(scale);
},
+ _setCellVisibility: function(){//todo maybe leave wireframes?
+ if (dmaGlobals.appState.get("cellsVisible")) this.showCells();
+ else this.hideCells();
+ },
+
//hide show cells during stock simulation
hideCells: function(){
this._iterCells(this.get("cells"), function(cell){
--
GitLab