Merge branch 'devel' of https://github.com/triAGENS/ArangoDB into devel

html/admin/css/graphlayout.css

@@ -122,6 +122,13 @@ img.gv-icon-btn.edit.active{
   content:url("../img/gv_edit_reverse.png");
 }
 
+img.gv-icon-btn.view{
+  content:url("../img/gv_view.png");
+}
+img.gv-icon-btn.view.active{
+  content:url("../img/gv_view_reverse.png");
+}
+
 img.gv-icon-btn.add{
   content:url("../img/gv_add.png");
 }
@@ -231,6 +238,12 @@ img.gv-zoom-btn.pan-bottom{
   content:url("../img/gv_arrow_bottom.png");
 }
 
+pre.gv_object_view {
+  text-align: left;
+  white-space: pre;
+}
+
+
 /*Overriding the slider UI*/
 .ui-slider {
   background: #333333;

html/admin/js/graphViewer/ui/eventDispatcherControls.js

@@ -73,7 +73,8 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
       trash: "trash",
       drag: "drag",
       edge: "connect",
-      edit: "edit"
+      edit: "edit",
+      view: "view"
     },
     baseClass = "event",
     dispatcher = new EventDispatcher(nodeShaper, edgeShaper, dispatcherConfig),
@@ -196,6 +197,57 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
     };
   };
   
+  this.viewRebinds = function() {
+    var prefix = "control_event_view",
+      idprefix = prefix + "_",
+      nodeCallback = function(n) {
+        modalDialogHelper.createModalViewDialog(
+          "View Node " + n._id,
+          "control_event_node_view_",
+          n._data,
+          function() {
+            modalDialogHelper.createModalEditDialog(
+              "Edit Node " + n._id,
+              "control_event_node_edit_",
+              n._data,
+              function(newData) {
+                dispatcher.events.PATCHNODE(n, newData, function() {
+                  $("#control_event_node_edit_modal").modal('hide');
+                })();
+              }
+            );
+          }
+        );
+      },
+      edgeCallback = function(e) {
+        modalDialogHelper.createModalViewDialog(
+          "View Edge " + e._id,
+          "control_event_edge_view_",
+          e._data,
+          function() {
+            modalDialogHelper.createModalEditDialog(
+              "Edit Edge " + e._id,
+              "control_event_edge_edit_",
+              e._data,
+              function(newData) {
+                dispatcher.events.PATCHEDGE(e, newData, function() {
+                  $("#control_event_edge_edit_modal").modal('hide');
+                })();
+              }
+            );
+          }
+        );
+      };
+      return {
+        nodes: {
+          click: nodeCallback
+        },
+        edges: {
+          click: edgeCallback
+        }
+      };
+  };
+  
   this.connectNodesRebinds = function() {
     var prefix = "control_event_connect",
       idprefix = prefix + "_",
@@ -243,7 +295,7 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
       },
       edgeCallback = function(e) {
         modalDialogHelper.createModalEditDialog(
-          "Edit Edge " + e._data._from + "->" + e._data._to,
+          "Edit Edge " + e._id,
           "control_event_edge_edit_",
           e._data,
           function(newData) {
@@ -307,6 +359,15 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
     createIcon(icon, "new_node", callback);
   };
   
+  this.addControlView = function() {
+    var icon = icons.view,
+      callback = function() {
+        setCursorIcon(icon);
+        self.rebindAll(self.viewRebinds());
+      };
+    createIcon(icon, "view", callback);
+  };
+  
   this.addControlDrag = function() {
     var prefix = "control_event_drag",
       idprefix = prefix + "_",
@@ -362,6 +423,7 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
   
   this.addAll = function () {
     self.addControlDrag();
+    self.addControlView();
     self.addControlEdit();
     self.addControlExpand();
     self.addControlDelete();

html/admin/js/graphViewer/ui/modalDialogHelper.js

@@ -155,7 +155,134 @@ var modalDialogHelper = modalDialogHelper || {};
     
     _.each(object, insertRow);
     $("#" + idprefix + "modal").modal('show');
-  };
+  },
+  
+  createViewWithObject = function (title, buttonTitle, idprefix, object, callback) {
+    var table = modalDialogHelper.modalDivTemplate(title, buttonTitle, idprefix, callback),
+      firstRow = document.createElement("tr"),
+      firstCell = document.createElement("th"),
+      pre = document.createElement("pre");
+    table.appendChild(firstRow);
+    firstRow.appendChild(firstCell);
+    firstCell.appendChild(pre);
+    pre.className = "gv_object_view";
+    pre.innerHTML = JSON.stringify(object, null, 2);
+      
+    
+    
+    /*
+      var tableToJSON,
+        callbackCapsule = function() {
+          callback(tableToJSON);
+        },
+        table = 
+        firstRow = document.createElement("tr"),
+        firstCell = document.createElement("th"),
+        secondCell = document.createElement("th"),
+        thirdCell = document.createElement("th"),
+        addRow = document.createElement("button"),
+        addImg = document.createElement("img"),
+        newCounter = 1,
+        insertRow;
+
+      tableToJSON = function() {
+        var result = {};
+        _.each($("#" + idprefix + "table tr:not(#first_row)"), function(tr) {
+      
+          var key = $(".keyCell input", tr).val(),
+            value = $(".valueCell input", tr).val();
+          result[key] = value;
+        });
+        return result;
+      };
+  
+      table.appendChild(firstRow);
+      firstRow.id = "first_row";
+      firstRow.appendChild(firstCell);
+      firstCell.className = "keyCell";
+  
+      firstRow.appendChild(secondCell);
+      secondCell.className = "valueCell";
+  
+      firstRow.appendChild(thirdCell);
+  
+      thirdCell.className = "actionCell";
+      thirdCell.appendChild(addRow);
+  
+  
+      addRow.id = idprefix + "new";
+      addRow.className = "graphViewer-icon-button";
+  
+      addRow.appendChild(addImg);
+      addImg.className = "gv-icon-small add";
+  
+      insertRow = function(value, key) {
+        var internalRegex = /^_(id|rev|key|from|to)/,
+          tr = document.createElement("tr"),
+          actTh = document.createElement("th"),
+          keyTh = document.createElement("th"),
+          valueTh = document.createElement("th"),
+          deleteInput,
+          keyInput,
+          valueInput,
+          delImg;
+        if (internalRegex.test(key)) {
+          return;
+        }
+        table.appendChild(tr);
+    
+        tr.appendChild(keyTh);
+        keyTh.className = "keyCell";
+        keyInput = document.createElement("input");
+        keyInput.type = "text";
+        keyInput.id = idprefix + key + "_key";
+        keyInput.value = key;
+        keyTh.appendChild(keyInput);
+    
+    
+        tr.appendChild(valueTh);
+        valueTh.className = "valueCell";
+        valueInput = document.createElement("input");
+        valueInput.type = "text";
+        valueInput.id = idprefix + key + "_value";
+        if ("object" === typeof value) {
+          valueInput.value = JSON.stringify(value);
+        } else {
+          valueInput.value = value;
+        }
+    
+        valueTh.appendChild(valueInput);
+    
+
+        tr.appendChild(actTh);
+        actTh.className = "actionCell";
+        deleteInput = document.createElement("button");
+        deleteInput.id = idprefix + key + "_delete";
+        deleteInput.className = "graphViewer-icon-button";
+    
+        actTh.appendChild(deleteInput);
+    
+        delImg = document.createElement("img");
+        delImg.className = "gv-icon-small delete";
+        deleteInput.appendChild(delImg);
+    
+        deleteInput.onclick = function() {
+          table.removeChild(tr);
+        };
+    
+      };
+  
+      addRow.onclick = function() {
+        insertRow("", "new_" + newCounter);
+        newCounter++;
+      };
+  
+      _.each(object, insertRow);
+      */
+      $("#" + idprefix + "modal").modal('show');
+    };
+  
+  
   
   
   modalDialogHelper.modalDivTemplate = function (title, buttonTitle, idprefix, callback) {
@@ -358,11 +485,16 @@ var modalDialogHelper = modalDialogHelper || {};
   };
   
   modalDialogHelper.createModalEditDialog = function(title, idprefix, object, callback) {
-    createDialogWithObject(title, "Edit", idprefix, object, callback);
+    createDialogWithObject(title, "Save", idprefix, object, callback);
   };
   
   modalDialogHelper.createModalCreateDialog = function(title, idprefix, object, callback) {
     createDialogWithObject(title, "Create", idprefix, object, callback);
   };
   
+  
+  modalDialogHelper.createModalViewDialog = function(title, idprefix, object, callback) {
+    createViewWithObject(title, "Edit", idprefix, object, callback);
+  };
+  
 }());

html/admin/js/templates/graphView.ejs

@@ -44,7 +44,7 @@ console.log(ds, es);
           <input id="undirected" type="checkbox" name="undirected" class="input-xlarge">
         </div>
       </div>
-      
+            
       <div class="accordion" id="advancedGraphOptions">
 
         <div class="accordion-group">