Improve the node editing dialog to the point where it can be used.

A few tweaks here and there.
cdaniel · Jun 23, 2015 · c733c6d · c733c6d
1 parent ee9d35d
commit c733c6d
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 29 deletions.
diff --git a/client/mapeditor.js b/client/mapeditor.js
@@ -80,13 +80,21 @@ function updateSelectionMenus(){
 	}
 	if(selectedNode){
 
-		$('#node_name').text(selectedNode.getText());
-
+	    $('#node_title').editable('destroy');
+	    $('#node_title').text(selectedNode.getText());
+        $('#node_title').editable({
+            value : selectedNode.getText(),
+            success : function(response, newValue) {
+                selectedNode.setText(newValue); //update backbone model
+                fireDirty();
+            },
+        });
+        $('#node_title').editable('setValue',selectedNode.getText());
 
 		$('#node_userneed').editable('destroy');
 		$('#node_userneed').editable({
-		    source: {'1': 'This is a user need'},
-		    emptytext: 'This is not a user need.',
+		    source: { '0' : 'No', '1': 'Yes'},
+		    emptytext: 'Not set!',
 		    success : function(data, value) {
 		    	selectedNode.setUserNeed(value == 1);
 				fireDirty();
@@ -95,13 +103,13 @@ function updateSelectionMenus(){
 		if(selectedNode.isUserNeed()){
 			$('#node_userneed').editable('setValue',1);
 		} else {
-			$('#node_userneed').editable('setValue',-1);
+			$('#node_userneed').editable('setValue',0);
 		}
 
 		$('#node_external').editable('destroy');
 		$('#node_external').editable({
-		    source: {'0': 'internal', '1' : 'external'},
-		    emptytext: 'This is not a user need.',
+		    source: {'0': 'inhouse', '1' : 'outsourced'},
+		    emptytext: 'Not set!',
 		    success : function(data, value) {
 		    	selectedNode.setExternal(value == 1);
 				fireDirty();
@@ -363,22 +371,10 @@ function HTMLMapNode(parentNode, nodeData) {
 	parentNode.append(self.internalNode);
 
 	//a placeholder for the text
-	self.caption = $('<a>').addClass("itemCaption").attr('id',
-			self.nodeData.componentId + 'itemCaption').attr('href', '#');
+	self.caption = $('<div>').addClass("itemCaption").attr('id',
+			self.nodeData.componentId + 'itemCaption');
 	self.internalNode.append(self.caption);
-	self.caption.attr('data-type', 'text');
-	self.caption.attr('data-title', 'Component Name');
 	self.caption.text(self.nodeData.name);
-	self.caption.editable({
-		value : self.nodeData.name,
-		success : function(response, newValue) {
-			self.nodeData.name = newValue; //update backbone model
-			fireDirty();
-			updateSelectionMenus(); // update selection if necessary
-		},
-		unsavedclass : null,
-		mode : 'popup'
-	});
 
 	jsPlumb.draggable(self.internalNode, {
 		containment : 'parent',

diff --git a/client/mapeditor_includes/nodedialog.jade b/client/mapeditor_includes/nodedialog.jade
@@ -5,12 +5,18 @@
                 button.close(type="button" data-dismiss="modal" aria-hidden="true") &times;
                 h4.modal-title Component data
             .modal-body
-                #nodeMenu(style="display:none")
-                    p#node_name
-                    p
-                        a#node_userneed(href="#" data-type="checklist")
-                    p This component is 
-                        a#node_external(href="#" data-type="select")
-                        | .
+                #nodeMenu(style="display:none").form-horizontal
+                    .form-group
+                        label.col-sm-4.control-label(for="node_title") Component name
+                        .col-sm-8
+                            a#node_title(data-type='text' href="#" data-title='Component Name')
+                    .form-group
+                        label.col-sm-4.control-label(for="node_userneed") User need
+                        .col-sm-8
+                            a#node_userneed(data-type='select' href="#" data-title='User need')
+                    .form-group
+                        label.col-sm-4.control-label(for="node_external") Control
+                        .col-sm-8
+                            a#node_external(data-type='select' href="#" data-title='Outsourcing')
             .modal-footer
-                button.btn.btn-primary.btn-default(type="button" data-dismiss="modal") Save
+                button.btn.btn-primary.btn-default(type="button" data-dismiss="modal") Close