diff --git a/css/main.css b/css/main.css
index 2b0bad2207583391f983c45ad3b497a5928e043e..d4786992e9da0139689f5878935d606d7701392f 100644
--- a/css/main.css
+++ b/css/main.css
@@ -27,7 +27,8 @@ body {
}
.navbar-header {
- padding-right: 20px;
+ padding-right: 0px;
+ width: 100px;
}
#logo {
@@ -83,7 +84,7 @@ nav .btn {
position: absolute;
display: block;
background-color: rgba(255,255,255,0.7);
- right: 0;
+ right: 0px;
overflow:hidden;
}
diff --git a/js/fea/dmaCell.js b/js/fea/dmaCell.js
index e861ab7514c4a48b5353fd487e01768737a2e941..7c988a2cf6a80cdb94995af8abfd6562e3cb2e20 100644
--- a/js/fea/dmaCell.js
+++ b/js/fea/dmaCell.js
@@ -150,10 +150,15 @@
_.each(this.parts, function(part){
part.remove();
});
+ this.destroy();
};
- DMACell.prototype._destroy = function(){
+ DMACell.prototype.destroy = function(){
if (this.cellMesh) this.cellMesh.myCell = null;
+ _.each(this.parts, function(part){
+ part.destroy();
+ });
+ this.parts = null;
};
self.DMACell = DMACell;
diff --git a/js/fea/dmaPart.js b/js/fea/dmaPart.js
index f6f35c8efefa3a20d00481ec9ce48a1efb0dc56d..865ae6f9fd693878b6a9d59c80ce1327abfad07c 100644
--- a/js/fea/dmaPart.js
+++ b/js/fea/dmaPart.js
@@ -95,7 +95,7 @@
if (this.mesh) window.three.sceneRemove(this.mesh);
};
- DMAPart.prototype._destroy = function(){
+ DMAPart.prototype.destroy = function(){
this.parentCell = null;
};
diff --git a/js/main.js b/js/main.js
index aef39a87b2ee027c013187cba4a5b834aaf05230..678da2b2e216ec31991f764952505726d94ecfce 100644
--- a/js/main.js
+++ b/js/main.js
@@ -16,7 +16,8 @@ $(function(){
//setup ui
- var menu = MenuWrapper({lattice:lattice});
+ var appState = new AppState();
+ var menu = new MenuWrapper({lattice:lattice, model:appState});
NavBar(menu);
lattice.addCell(new THREE.Vector3(0,0,0));
diff --git a/js/menus/MenuWrapperView.js b/js/menus/MenuWrapperView.js
index 203506604d5c2a6ac5efbce60c319e66f3aba634..dc94d2e8a595ee820eac946a364b032e8e857391 100644
--- a/js/menus/MenuWrapperView.js
+++ b/js/menus/MenuWrapperView.js
@@ -3,69 +3,102 @@
*/
-function MenuWrapper(args){
+MenuWrapper = Backbone.View.extend({
- var $el = $("#menuWrapper");
+ el: "#menuHeader",
- //init all tab view controllers
- var latticeMenu = new LatticeMenuView({model:args.lattice});
- var importMenu = new ImportMenuView({lattice:args.lattice});
- var sketchMenu = new SketchMenuView({model:args.lattice});
- var partMenu = new PartMenuView({model:args.lattice});
- var scriptMenu = new ScriptMenuView();
+ events: {
+ "click .nav-tabs>li>a": "_tabWasSelected"
+ },
- init();
+ initialize: function(options){
- var tabItems = $(".nav-tabs>li>a");
- tabItems.click(function(e){
+ _.bindAll(this, "render");
+
+ //init all tab view controllers
+ this.latticeMenu = new LatticeMenuView({model:options.lattice});
+ this.importMenu = new ImportMenuView({lattice:options.lattice});
+ this.sketchMenu = new SketchMenuView({model:options.lattice});
+ this.partMenu = new PartMenuView({model:options.lattice});
+ this.scriptMenu = new ScriptMenuView();
+
+ //data names and titles
+ this.designMenuTabs = {lattice:"Lattice", import:"Import", sketch:"Sketch", part:"Part", script:"Script"};
+ this.simMenuTabs = {physics:"Physics", part:"Part", material:"Material", optimize:"Optimize"};
+ this.assemMenuTabs = {assembler:"Assembler", animate:"Animate"};
+
+ //bind events
+ this.listenTo(this.model, "change:currentTab", this._updateCurrentTab);
+
+ this.render();
+ },
+
+ _tabWasSelected: function(e){
e.preventDefault();
- var $this = $(this);
+ var tabName = $(e.target).parent().data('name');
+ this.model.set("currentTab", tabName);
+ },
- _.each(tabItems, function(tab){
- $(tab).parent().removeClass("active");
+ _updateCurrentTab: function(){
+ var tabName = this.model.get("currentTab");
+ _.each($(".nav-tabs>li>a"), function(tab){
+ var parent = $(tab).parent();
+ if (parent.data('name') == tabName){
+ parent.addClass("active");
+ } else {
+ parent.removeClass("active");
+ }
});
- $this.parent().addClass("active");
- deselectAllMenus();
- var tabName = $this.parent().data('name');
+ this._deselectAllMenus();
+
if (tabName == "lattice"){
- latticeMenu.render();
+ this.latticeMenu.render();
} else if (tabName == "import"){
- importMenu.render();
+ this.importMenu.render();
} else if (tabName == "sketch"){
- sketchMenu.render();
+ this.sketchMenu.render();
} else if (tabName == "part"){
- partMenu.render();
+ this.partMenu.render();
} else if (tabName == "script"){
- scriptMenu.render();
+ this.scriptMenu.render();
} else {
console.warn("no tab initialized!");
$("menuContent").html('');//clear out content from menu
}
- });
-
- function deselectAllMenus(){
- latticeMenu.currentlySelected = false;
- importMenu.currentlySelected = false;
- sketchMenu.currentlySelected = false;
- partMenu.currentlySelected = false;
-// scriptMenu.currentlySelected = false;
- }
-
- function init(){
- latticeMenu.render();//init with lattice menu open
- }
-
- function hide(){
- $el.animate({right: "-400"});
- }
-
- function show(){
- $el.animate({right: "0"});
- }
-
- return {//return public properties and methods
- hide: hide,
- show:show
- };
-}
\ No newline at end of file
+
+ },
+
+ _deselectAllMenus: function(){
+ this.latticeMenu.currentlySelected = false;
+ this.importMenu.currentlySelected = false;
+ this.sketchMenu.currentlySelected = false;
+ this.partMenu.currentlySelected = false;
+// this.scriptMenu.currentlySelected = false;
+ },
+
+ render: function(){
+ this.$el.html(this.template(_.extend(this.model.attributes,
+ {designMenuTabs:this.designMenuTabs,
+ simMenuTabs:this.simMenuTabs,
+ assemMenuTabs:this.assemMenuTabs})));
+ this._updateCurrentTab();
+ this.show();
+ },
+
+ hide: function(){
+ this.$el.parent().animate({right: "-400"});
+ },
+
+ show: function(){
+ this.$el.parent().animate({right: "0"});
+ },
+
+ template: _.template('\
+ <ul class="nav nav-tabs nav-justified">\
+ <% _.each(_.keys(designMenuTabs), function(key){%>\
+ <li role="presentation" data-name="<%= key %>"><a href="#"><%= designMenuTabs[key] %></a></li>\
+ <% }); %>\
+ </ul>\
+ ')
+});
\ No newline at end of file
diff --git a/js/menus/navbar.js b/js/menus/navbar.js
index 1e333dd61cdbe9e7158286add3400fd43c3f16f7..68d3c40703e0f3037e411e376a8e8ec3d9d194f7 100644
--- a/js/menus/navbar.js
+++ b/js/menus/navbar.js
@@ -10,12 +10,12 @@ function NavBar(menu){
var allNavDropdownMenus = $(".navDropdown");
var allNavTitles = $(".navbar-nav li a");
-// allNavMenuLinks.mouseover(function(){
-// hideAllMenus();
-// $(this).parent().addClass("open");//highlight
-// var menuId = "#" + $(this).data("menuId");
+ allNavMenuLinks.mouseover(function(){
+ deselectAllNavItems();
+ $(this).parent().addClass("open");//highlight
+ var menuId = "#" + $(this).data("menuId");
// $(menuId).show();
-// });
+ });
var showHideMenuBtn = $("#showHideMenu");
showHideMenuBtn.mouseout(function(){
@@ -37,21 +37,17 @@ function NavBar(menu){
$this.blur();
});
- function hideAllMenus(){
- allMenus.hide();
+ function deselectAllNavItems(){
allNavMenuLinks.parent().removeClass("open");//no highlight
allNavDropdownMenus.removeClass("open");//no highlight
allNavTitles.blur();
}
- $("#threeContainer").mousedown(function(){
- hideAllMenus();
- });
- $("#mainNavLink").mouseover(function(){
- hideAllMenus();
- });
+// $("#threeContainer").mousedown(function(){
+// hideAllMenus();
+// });
allNavDropdownMenus.mouseover(function(){
- hideAllMenus();
+ deselectAllNavItems();
$(this).addClass("open");
});
diff --git a/js/models/AppState.js b/js/models/AppState.js
new file mode 100644
index 0000000000000000000000000000000000000000..debdc8f25420ff33e54e98e4a736029b81e80097
--- /dev/null
+++ b/js/models/AppState.js
@@ -0,0 +1,18 @@
+/**
+ * Created by aghassaei on 1/29/15.
+ */
+
+//a class to store global app state, model for navbar and menu wrapper
+//maybe other things eventually
+
+AppState = Backbone.Model.extend({
+
+ defaults: {
+ currentNav:"design",//design, sim, assemble
+ currentTab:"lattice"
+ },
+
+ initialize: function(){
+
+ }
+});
\ No newline at end of file
diff --git a/main.html b/main.html
index d5d225bcb6f2c1053ebf780abcccd1ffb439489c..cccacafcb7242232cd71e632e4a52992849ebf28 100644
--- a/main.html
+++ b/main.html
@@ -51,6 +51,7 @@
<script src="js/fea/dmaNode.js"></script>
<!--models-->
+ <script src="js/models/AppState.js"></script>
<script src="js/models/threeModel.js"></script>
<script src="js/models/fillGeometry.js"></script>
<script src="js/models/lattice.js"></script>
@@ -75,11 +76,13 @@
<nav class="navbar navbar-inverse navbar-embossed" role="navigation">
<div class="navbar-header">
- <a id="mainNavLink" class="navbar-brand" href="http://cba.mit.edu"><img id="logo" src="assets/logo.png"></a>
+ <a id="mainNavLink" class="navbar-brand" target="_blank" href="http://cba.mit.edu"><img id="logo" src="assets/logo.png"></a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-01">
<ul class="nav navbar-nav navbar-left">
- <li><a data-menu-id="file" class="menuHoverControls" href="#">File</a></li>
+ <li><a data-menu-id="design" class="menuHoverControls" href="#">Design</a></li>
+ <li><a data-menu-id="sim" class="menuHoverControls" href="#">Simulate</a></li>
+ <li><a data-menu-id="assemble" class="menuHoverControls" href="#">Assemble</a></li>
<li class="dropdown navDropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Export <b class="caret"></b></a>
<span class="dropdown-arrow"></span>
@@ -94,24 +97,14 @@
<li><a data-menu-id="about" class="menuHoverControls" href="#">About</a></li>
</ul>
<ul class="nav navbar-nav pull-right">
- <li><a id="showHideMenu" data-state=true class="menuHoverControls" href="#">Hide Menu >></a></li>
+ <li><a id="showHideMenu" data-state=true href="#">Hide Menu >></a></li>
</ul>
</div><!-- /.navbar-collapse -->
</nav>
-<div id="menuWrapper">
- <ul class="nav nav-tabs nav-justified">
- <li role="presentation" class="active" data-name="lattice"><a href="#">Lattice</a></li>
- <li role="presentation" data-name="import"><a href="#">Import</a></li>
- <li role="presentation" data-name="sketch"><a href="#">Sketch</a></li>
- <li role="presentation" data-name="part"><a href="#">Part</a></li>
- <li role="presentation" data-name="script"><a href="#">Script</a></li>
- </ul>
-
- <div id="menuContent"></div>
-</div>
+<div id="menuWrapper"><div id="menuHeader"></div><div id="menuContent"></div></div>
<div id="importGeometry" class="row navMenu">
</div>