From 12e9c1c281e2a2782a85fbecfa74f6bd871e2b34 Mon Sep 17 00:00:00 2001
From: Amanda Ghassaei <amandaghassaei@gmail.com>
Date: Tue, 2 Jun 2015 14:18:31 -0700
Subject: [PATCH] navbar through require
---
js/main.js | 15 +-
js/menus/LatticeMenuView.js | 2 +-
js/menus/MenuWrapperView.js | 6 +-
js/menus/NavViewMenu.js | 123 +++++++--------
js/menus/Navbar.js | 298 ++++++++++++++++++------------------
js/menus/PartMenuView.js | 2 +-
js/three/ThreeView.js | 5 +-
7 files changed, 229 insertions(+), 222 deletions(-)
diff --git a/js/main.js b/js/main.js
index be57e720..18550b93 100644
--- a/js/main.js
+++ b/js/main.js
@@ -25,6 +25,8 @@ requirejs.config({
fileSaver: 'models/FileSaver',
//UI
+ navbar: 'menus/Navbar',
+ navViewMenu: 'menus/NavViewMenu',//view dropdown
menuWrapper: 'menus/MenuWrapperView',
menuParent: 'menus/MenuParentView',
latticeMenu: 'menus/LatticeMenuView',
@@ -58,8 +60,17 @@ requirejs.config({
}
});
-requirejs(['menuWrapper', 'analytics', 'flatUI'], function(menuWrapper) {
- console.log(menuWrapper);
+//init stuff
+requirejs(['appState', 'lattice', 'menuWrapper', 'navbar', 'threeModel', 'threeView', 'analytics', 'flatUI'],
+ function(appState, lattice, MenuWrapper, Navbar, three, ThreeView){
+
+ new MenuWrapper({model:appState});
+ new Navbar({model:appState});
+// new Ribbon({model:appState});
+
+ new ThreeView({model:three});
+
+// if (lattice.get("connectionType") != "gik") lattice.addCellAtIndex({x:0,y:0,z:0});//add a cell
});
diff --git a/js/menus/LatticeMenuView.js b/js/menus/LatticeMenuView.js
index 0a639d4f..b9847bd2 100644
--- a/js/menus/LatticeMenuView.js
+++ b/js/menus/LatticeMenuView.js
@@ -2,7 +2,7 @@
* Created by aghassaei on 1/26/15.
*/
-define(['menuParent', 'lattice', 'plist'], function(MenuParentView, lattice, plist){
+define(['jquery', 'underscore', 'menuParent', 'lattice', 'plist'], function($, _, MenuParentView, lattice, plist){
return MenuParentView.extend({
diff --git a/js/menus/MenuWrapperView.js b/js/menus/MenuWrapperView.js
index 54a48c1b..42a1d4b1 100644
--- a/js/menus/MenuWrapperView.js
+++ b/js/menus/MenuWrapperView.js
@@ -3,9 +3,9 @@
*/
-define(['jquery', 'backbone', 'appState', 'lattice', 'plist'], function($, Backbone, appState, lattice, plist){
+define(['jquery', 'underscore', 'backbone', 'lattice', 'plist'], function($, _, Backbone, lattice, plist){
- var MenuWrapper = Backbone.View.extend({
+ return Backbone.View.extend({
el: "#menuWrapper",
@@ -208,6 +208,4 @@ define(['jquery', 'backbone', 'appState', 'lattice', 'plist'], function($, Backb
</ul>\
')
});
-
- return new MenuWrapper({model:appState});
});
\ No newline at end of file
diff --git a/js/menus/NavViewMenu.js b/js/menus/NavViewMenu.js
index 95815554..6130fc16 100644
--- a/js/menus/NavViewMenu.js
+++ b/js/menus/NavViewMenu.js
@@ -3,78 +3,79 @@
*/
-//model is appState
-//not templating this view yet
+define(['jquery', 'underscore', 'backbone'], function($, _, Backbone){
-NavViewMenu = Backbone.View.extend({
+ return Backbone.View.extend({
- el: "#navViewMenu",
+ el: "#navViewMenu",
- events: {
- "click a.boolProperty": "_makeSelection",
- "click #reset3DView": "_reset3DNavigation"
- },
+ events: {
+ "click a.boolProperty": "_makeSelection",
+ "click #reset3DView": "_reset3DNavigation"
+ },
- initialize: function(){
+ initialize: function(){
- _.bindAll(this, "render");
- },
+ _.bindAll(this, "render");
+ },
- _makeSelection: function(e){
- e.preventDefault();
- var $target = $(e.target);
- var property = $target.data("property");
- var owner = this._getPropertyOwner($target);
- if (owner) owner.set(property, !owner.get(property));
- },
+ _makeSelection: function(e){
+ e.preventDefault();
+ var $target = $(e.target);
+ var property = $target.data("property");
+ var owner = this._getPropertyOwner($target);
+ if (owner) owner.set(property, !owner.get(property));
+ },
- _getPropertyOwner: function($target){
- if ($target.hasClass("appState")) return globals.appState;
- console.warn("no owner found for " + $target);
- return null;
- },
+ _getPropertyOwner: function($target){
+ if ($target.hasClass("appState")) return this.model;
+ console.warn("no owner found for " + $target);
+ return null;
+ },
- _reset3DNavigation: function(){
- e.preventDefault();
- },
+ _reset3DNavigation: function(){
+ e.preventDefault();
+ },
- render: function(){
- this.$el.html(this.template(this.model.toJSON()));
+ render: function(){
+ this.$el.html(this.template(this.model.toJSON()));
- _.each($(".boolProperty"), function(item){
- var $item = $(item);
- if (globals.appState.get($item.data("property"))) $item.html('<span class="fui-check"></span>' + $item.html());
- })
- },
+ var self = this;
+ _.each($(".boolProperty"), function(item){
+ var $item = $(item);
+ if (self.model.get($item.data("property"))) $item.html('<span class="fui-check"></span>' + $item.html());
+ })
+ },
- template: _.template('\
- <li class="dropdown-submenu">\
- <a tabindex="-1">UI<span class="pull-right fui-arrow-right"></span></a>\
- <ul class="dropdown-menu">\
- <li><a class="appState boolProperty" data-property="menuIsVisible" href="#">Menu</a></li>\
- <li><a class="appState boolProperty" data-property="scriptIsVisible" href="#">Script</a></li>\
- <li><a class="appState boolProperty" data-property="consoleIsVisible" href="#">Console</a></li>\
- <li><a class="appState boolProperty" data-property="ribbonIsVisible" href="#">Ribbon</a></li>\
- </ul></li>\
- <li class="dropdown-submenu">\
- <a tabindex="-1">3D UI<span class="pull-right fui-arrow-right"></span></a>\
- <ul class="dropdown-menu">\
- <li><a class="appState boolProperty" data-property="basePlaneIsVisible" href="#">Sketch Plane</a></li>\
- <li><a class="appState boolProperty" data-property="highlighterIsVisible" href="#">Hover Tool</a></li>\
- </ul></li>\
- <li class="dropdown-submenu">\
- <a tabindex="-1">Rendering<span class="pull-right fui-arrow-right"></span></a>\
- <ul class="dropdown-menu">\
- <li><a class="appState boolProperty" data-property="renderAmbientOcclusion" href="#">Ambient Occlusion</a></li>\
- <li><a class="appState boolProperty" data-property="realisticColorScheme" href="#">Realistic Color Scheme</a></li>\
- </ul></li>\
- <li class="dropdown-submenu">\
- <a tabindex="-1">3D<span class="pull-right fui-arrow-right"></span></a>\
- <ul class="dropdown-menu">\
- <li><a class="appState boolProperty" data-property="axesAreVisible" href="#">Axes</a></li>\
- <li><a id="reset3DView" href="#">Reset 3D Navigation</a></li>\
- </ul></li>\
- ')
+ template: _.template('\
+ <li class="dropdown-submenu">\
+ <a tabindex="-1">UI<span class="pull-right fui-arrow-right"></span></a>\
+ <ul class="dropdown-menu">\
+ <li><a class="appState boolProperty" data-property="menuIsVisible" href="#">Menu</a></li>\
+ <li><a class="appState boolProperty" data-property="scriptIsVisible" href="#">Script</a></li>\
+ <li><a class="appState boolProperty" data-property="consoleIsVisible" href="#">Console</a></li>\
+ <li><a class="appState boolProperty" data-property="ribbonIsVisible" href="#">Ribbon</a></li>\
+ </ul></li>\
+ <li class="dropdown-submenu">\
+ <a tabindex="-1">3D UI<span class="pull-right fui-arrow-right"></span></a>\
+ <ul class="dropdown-menu">\
+ <li><a class="appState boolProperty" data-property="basePlaneIsVisible" href="#">Sketch Plane</a></li>\
+ <li><a class="appState boolProperty" data-property="highlighterIsVisible" href="#">Hover Tool</a></li>\
+ </ul></li>\
+ <li class="dropdown-submenu">\
+ <a tabindex="-1">Rendering<span class="pull-right fui-arrow-right"></span></a>\
+ <ul class="dropdown-menu">\
+ <li><a class="appState boolProperty" data-property="renderAmbientOcclusion" href="#">Ambient Occlusion</a></li>\
+ <li><a class="appState boolProperty" data-property="realisticColorScheme" href="#">Realistic Color Scheme</a></li>\
+ </ul></li>\
+ <li class="dropdown-submenu">\
+ <a tabindex="-1">3D<span class="pull-right fui-arrow-right"></span></a>\
+ <ul class="dropdown-menu">\
+ <li><a class="appState boolProperty" data-property="axesAreVisible" href="#">Axes</a></li>\
+ <li><a id="reset3DView" href="#">Reset 3D Navigation</a></li>\
+ </ul></li>\
+ ')
+ });
});
\ No newline at end of file
diff --git a/js/menus/Navbar.js b/js/menus/Navbar.js
index 06b66528..9e90c18d 100644
--- a/js/menus/Navbar.js
+++ b/js/menus/Navbar.js
@@ -3,168 +3,168 @@
*/
-//model is appState
-//not templating this view yet
+define(['jquery', 'underscore', 'backbone', 'fileSaver', 'navViewMenu'], function($, _, Backbone, fileSaver, NavViewMenu){
-NavBar = Backbone.View.extend({
+ return Backbone.View.extend({
- el: "body",
+ el: "body",
- events: {
- "click #showHideMenu": "_setMenuVisibility",
- "click .menuHoverControls": "_setNavSelection",
- "shown.bs.modal .modal": "_showModal",
- "hide.bs.modal .modal": "_hideModal",
+ events: {
+ "click #showHideMenu": "_setMenuVisibility",
+ "click .menuHoverControls": "_setNavSelection",
+ "shown.bs.modal .modal": "_showModal",
+ "hide.bs.modal .modal": "_hideModal",
- "click .saveJSON": "_save",
- "click .saveAsJSON": "_saveAs",
- "change #saveAsFileName": "_saveAs",//detect enter key
- "click .saveUser": "_saveUser",
- "change #saveUserFileName": "_saveUser",//detect enter key
+ "click .saveJSON": "_save",
+ "click .saveAsJSON": "_saveAs",
+ "change #saveAsFileName": "_saveAs",//detect enter key
+ "click .saveUser": "_saveUser",
+ "change #saveUserFileName": "_saveUser",//detect enter key
- "click .importJSON": "_importJSON",
- "change #jsonInput": "_selectJSONFiles",
- "click .loadUser": "_loadUser",
- "click .loadDemo": "_loadDemo",
+ "click .importJSON": "_importJSON",
+ "change #jsonInput": "_selectJSONFiles",
+ "click .loadUser": "_loadUser",
+ "click .loadDemo": "_loadDemo",
- "click #viewMenuDropdown": "_renderViewMenu"
- },
+ "click #viewMenuDropdown": "_renderViewMenu"
+ },
- initialize: function(){
+ initialize: function(){
- this.viewMenu = new NavViewMenu({model:globals.appState});
+ this.viewMenu = new NavViewMenu({model:this.model});
- _.bindAll(this, "_setMenuVisibility", "_setNavSelection");
+ _.bindAll(this, "_setMenuVisibility", "_setNavSelection");
- this.listenTo(this.model, "change:currentNav", this._updateNavSelectionUI);
+ this.listenTo(this.model, "change:currentNav", this._updateNavSelectionUI);
- this._logo();
- this._updateNavSelectionUI();
- },
+ this._logo();
+ this._updateNavSelectionUI();
+ },
- _setMenuVisibility: function(e){
- e.preventDefault();
- var state = this.model.get("menuIsVisible");
- this.model.set("menuIsVisible", !state);
- $(e.target).blur();
- },
-
- _setNavSelection: function(e){
- var navSelection = $(e.target).data("menuId");
- if (navSelection == "about") {
+ _setMenuVisibility: function(e){
+ e.preventDefault();
+ var state = this.model.get("menuIsVisible");
+ this.model.set("menuIsVisible", !state);
$(e.target).blur();
- return;
- }
- e.preventDefault();
- if (navSelection) this.model.set("currentNav", navSelection);
- },
-
- _updateNavSelectionUI: function(){
- this._deselectAllNavItems();
- var navSelection = this.model.get("currentNav");
- _.each($(".menuHoverControls"), function(link){
- var $link = $(link);
- if ($link.data("menuId") == navSelection) $link.parent().addClass("open");//highlight
- });
- },
-
- _logo: function(){
- var $logo = $("#logo");
- $logo.mouseover(function(){
- $logo.attr("src","assets/imgs/logo-active.png");
- });
- $logo.mouseout(function(){
- $logo.attr("src","assets/imgs/logo.png");
- });
- },
-
- _deselectAllNavItems: function(){
- $(".open").removeClass("open");//no highlight
- },
-
- _showModal: function(e){
- var input = $(e.target).find("input.filename");
- input.focus();
- input.select();
- },
-
- _hideModal: function(e){
- $(e.target).find("input.filename").blur();
- },
-
-
- _renderViewMenu: function(){
- this.viewMenu.render();
- },
-
-
-
- _save: function(e){
- e.preventDefault();
- globals.fileSaver.save();
- },
-
- _saveAs: function(e){
- e.preventDefault();
- var fileName = $("#saveAsFileName").val();
- globals.fileSaver.save(fileName);
- $('#saveAsModel').modal('hide');
- },
-
- _saveUser: function(e){
- e.preventDefault();
- var fileName = $("#saveUserFileName").val();
- globals.fileSaver.saveUser(fileName);
- $('#saveUserModel').modal('hide');
- },
-
-
-
-
- _importJSON: function(e){
- e.preventDefault();
- $("#jsonInput").click();
- },
-
- _selectJSONFiles: function(e){
- e.preventDefault();
- var input = $(e.target),
- numFiles = input.get(0).files ? input.get(0).files.length : 1,
- label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
- this._readDataURL(numFiles, label, input.get(0).files);
- input.val("");
- },
-
- _readDataURL: function(numFiles, filename, files){
- if (numFiles>1) console.warn("too many files selected");
- var reader = new FileReader();
- reader.readAsText(files[0]);
- reader.onload = (function() {
- return function(e) {
- var extension = filename.substr(filename.length - 5);
- if (extension == ".json"){
- globals.fileSaver.loadFile(JSON.parse(e.target.result));
- } else if (extension == ".user"){
- globals.fileSaver.loadUser(JSON.parse(e.target.result));
- } else console.warn("file type not recognized");
+ },
+
+ _setNavSelection: function(e){
+ var navSelection = $(e.target).data("menuId");
+ if (navSelection == "about") {
+ $(e.target).blur();
+ return;
}
- })();
- },
-
- _loadUser: function(e){
- e.preventDefault();
- var url = "data/users/" + $(e.target).data("file");
- $.getJSON( url, function(data) {
- globals.fileSaver.loadUser(data);
- });
- },
-
- _loadDemo: function(e){
- e.preventDefault();
- var url = "data/demos/" + $(e.target).data("file");
- $.getJSON( url, function(data) {
- globals.fileSaver.loadFile(data);
- });
- }
+ e.preventDefault();
+ if (navSelection) this.model.set("currentNav", navSelection);
+ },
+
+ _updateNavSelectionUI: function(){
+ this._deselectAllNavItems();
+ var navSelection = this.model.get("currentNav");
+ _.each($(".menuHoverControls"), function(link){
+ var $link = $(link);
+ if ($link.data("menuId") == navSelection) $link.parent().addClass("open");//highlight
+ });
+ },
+
+ _logo: function(){
+ var $logo = $("#logo");
+ $logo.mouseover(function(){
+ $logo.attr("src","assets/imgs/logo-active.png");
+ });
+ $logo.mouseout(function(){
+ $logo.attr("src","assets/imgs/logo.png");
+ });
+ },
+
+ _deselectAllNavItems: function(){
+ $(".open").removeClass("open");//no highlight
+ },
+
+ _showModal: function(e){
+ var input = $(e.target).find("input.filename");
+ input.focus();
+ input.select();
+ },
+
+ _hideModal: function(e){
+ $(e.target).find("input.filename").blur();
+ },
+
+
+ _renderViewMenu: function(){
+ this.viewMenu.render();
+ },
+
+
+
+ _save: function(e){
+ e.preventDefault();
+ fileSaver.save();
+ },
+
+ _saveAs: function(e){
+ e.preventDefault();
+ var fileName = $("#saveAsFileName").val();
+ fileSaver.save(fileName);
+ $('#saveAsModel').modal('hide');
+ },
+
+ _saveUser: function(e){
+ e.preventDefault();
+ var fileName = $("#saveUserFileName").val();
+ fileSaver.saveUser(fileName);
+ $('#saveUserModel').modal('hide');
+ },
+
+
+
+
+ _importJSON: function(e){
+ e.preventDefault();
+ $("#jsonInput").click();
+ },
+
+ _selectJSONFiles: function(e){
+ e.preventDefault();
+ var input = $(e.target),
+ numFiles = input.get(0).files ? input.get(0).files.length : 1,
+ label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
+ this._readDataURL(numFiles, label, input.get(0).files);
+ input.val("");
+ },
+
+ _readDataURL: function(numFiles, filename, files){
+ if (numFiles>1) console.warn("too many files selected");
+ var reader = new FileReader();
+ reader.readAsText(files[0]);
+ reader.onload = (function() {
+ return function(e) {
+ var extension = filename.substr(filename.length - 5);
+ if (extension == ".json"){
+ fileSaver.loadFile(JSON.parse(e.target.result));
+ } else if (extension == ".user"){
+ fileSaver.loadUser(JSON.parse(e.target.result));
+ } else console.warn("file type not recognized");
+ }
+ })();
+ },
+
+ _loadUser: function(e){
+ e.preventDefault();
+ var url = "data/users/" + $(e.target).data("file");
+ $.getJSON( url, function(data) {
+ fileSaver.loadUser(data);
+ });
+ },
+
+ _loadDemo: function(e){
+ e.preventDefault();
+ var url = "data/demos/" + $(e.target).data("file");
+ $.getJSON( url, function(data) {
+ fileSaver.loadFile(data);
+ });
+ }
+ });
});
\ No newline at end of file
diff --git a/js/menus/PartMenuView.js b/js/menus/PartMenuView.js
index a060c611..bfe19836 100644
--- a/js/menus/PartMenuView.js
+++ b/js/menus/PartMenuView.js
@@ -2,7 +2,7 @@
* Created by aghassaei on 1/26/15.
*/
-define(['menuParent', 'lattice', 'plist'], function(MenuParentView, lattice, plist){
+define(['jquery', 'underscore', 'menuParent', 'lattice', 'plist'], function($, _, MenuParentView, lattice, plist){
return MenuParentView({
diff --git a/js/three/ThreeView.js b/js/three/ThreeView.js
index 39de47c1..6792ff94 100644
--- a/js/three/ThreeView.js
+++ b/js/three/ThreeView.js
@@ -4,7 +4,7 @@
define(['backbone', 'threeModel', 'orbitControls', 'appState'], function(Backbone, three, THREE, appState){
- var ThreeView = Backbone.View.extend({
+ return Backbone.View.extend({
events: {
"mousemove": "_mouseMoved",
@@ -153,7 +153,4 @@ define(['backbone', 'threeModel', 'orbitControls', 'appState'], function(Backbon
}
});
-
- return new ThreeView({model:three});
-
});
\ No newline at end of file
--
GitLab