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

html/admin/css/graphlayout.css

@@ -238,6 +238,11 @@ img.gv-zoom-btn.pan-bottom{
   content:url("../img/gv_arrow_bottom.png");
 }
 
+
+img.gv-throbber {
+  content:url("../img/swagger/throbber.gif");
+}
+
 pre.gv_object_view {
   text-align: left;
   white-space: pre;
@@ -265,4 +270,13 @@ pre.gv_object_view {
   outline-color: #333333;
   border-color: #686766;
   background: white;
+}
+
+.gv_example_toggle {
+  background-color:white;
+  height: 30px;
+}
+
+.gv_example_toggle:hover {
+  background-color:white;
 }

html/admin/js/graphViewer/graph/arangoAdapter.js

@@ -40,12 +40,15 @@ function ArangoAdapter(nodes, edges, config) {
   if (config === undefined) {
     throw "A configuration with node- and edgeCollection has to be given.";
   }
-  if (config.nodeCollection === undefined) {
+  if (config.graph === undefined) {
-    throw "The nodeCollection has to be given.";
+    if (config.nodeCollection === undefined) {
-  }
+      throw "The nodeCollection or a graphname has to be given.";
-  if (config.edgeCollection === undefined) {
+    }
-    throw "The edgeCollection has to be given.";
+    if (config.edgeCollection === undefined) {
+      throw "The edgeCollection or a graphname has to be given.";
+    }
   }
+
   
   var self = this,
     absAdapter,
@@ -57,9 +60,31 @@ function ArangoAdapter(nodes, edges, config) {
     arangodb,
     direction,
 
+    setNodeCollection = function(name) {
+      nodeCollection = name;
+      api.node = api.base + "document?collection=" + nodeCollection;
+    },
+
+    setEdgeCollection = function(name) {
+      edgeCollection = name;
+      api.edge = api.base + "edge?collection=" + edgeCollection;
+    },
+
+    getCollectionsFromGraph = function(name) {
+      $.ajax({
+        cache: false,
+        type: 'GET',
+        async: false,
+        url: api.graph + "/" + name,
+        contentType: "application/json",
+        success: function(data) {
+          setNodeCollection(data.graph.vertices);
+          setEdgeCollection(data.graph.edges);
+        }
+      });
+    },
+
     parseConfig = function(config) {
-      nodeCollection = config.nodeCollection;
-      edgeCollection = config.edgeCollection;
       if (config.host === undefined) {
         arangodb = "http://" + document.location.host;
       } else {
@@ -80,16 +105,33 @@ function ArangoAdapter(nodes, edges, config) {
       } else {
         direction = "outbound";
       }
+      api.base = arangodb.lastIndexOf("http://", 0) === 0
+        ? arangodb + "/_api/"
+        : "http://" + arangodb + "/_api/";
+      api.cursor = api.base + "cursor";
+      api.graph = api.base + "graph";
+      api.collection = api.base + "collection/";
+      api.document = api.base + "document/";
+      api.any = api.base + "simple/any";      
+      if (config.graph) {
+        getCollectionsFromGraph(config.graph);
+      } else {
+        setNodeCollection(config.nodeCollection);
+        setEdgeCollection(config.edgeCollection);
+      }
     },
   
     sendQuery = function(query, bindVars, onSuccess) {
       if (query !== queries.connectedEdges) {
         bindVars["@nodes"] = nodeCollection;
       }
-      if (query !== queries.childrenCentrality) {
+      if (query !== queries.childrenCentrality
+      && query !== queries.randomDocuments) {
         bindVars.dir = direction;
       }
-      bindVars["@edges"] = edgeCollection;
+      if (query !== queries.randomDocuments) {
+        bindVars["@edges"] = edgeCollection;
+      }
       var data = {
         query: query,
         bindVars: bindVars
@@ -117,6 +159,28 @@ function ArangoAdapter(nodes, edges, config) {
       });
     },
   
+    getNRandom = function(n, callback) {
+      var list = [],
+        i = 0;
+      for (i = 0; i < n; i++) {
+        $.ajax({
+          cache: false,
+          type: 'PUT',
+          url: api.any,
+          data: JSON.stringify({
+            collection: nodeCollection
+          }),
+          contentType: "application/json",
+          success: function(data) {
+            list.push(data.document);
+            if (list.length === n) {
+              callback(list);
+            }
+          }
+        });
+      }
+    },
+    
     parseResultOfTraversal = function (result, callback) {
       if (result.length === 0) {
         if (callback) {
@@ -206,18 +270,13 @@ function ArangoAdapter(nodes, edges, config) {
     absConfig.prioList = config.prioList;
   }
   absAdapter = new AbstractAdapter(nodes, edges, this, absConfig);
-     
+  
   parseConfig(config);
   
-  api.base = arangodb.lastIndexOf("http://", 0) === 0
+  queries.randomDocuments = "FOR u IN @@nodes"
-    ? arangodb + "/_api/"
+    + " sort rand()"
-    : "http://" + arangodb + "/_api/";
+    + " limit 10"
-  api.cursor = api.base + "cursor";
+    + " return u";
-  api.collection = api.base + "collection/";
-  api.document = api.base + "document/";
-  api.node = api.base + "document?collection=" + nodeCollection; 
-  api.edge = api.base + "edge?collection=" + edgeCollection; 
-  
   queries.nodeById = "FOR n IN @@nodes"
     + " FILTER n._id == @id"
     + " LET links = ("
@@ -442,8 +501,8 @@ function ArangoAdapter(nodes, edges, config) {
   
   self.changeToCollections = function (nodesCol, edgesCol, dir) {
     absAdapter.cleanUp();
-    nodeCollection = nodesCol;
+    setNodeCollection(nodesCol);
-    edgeCollection = edgesCol;
+    setEdgeCollection(edgesCol);
     if (dir !== undefined) {
       if (dir === true) {
         direction = "any";
@@ -451,8 +510,6 @@ function ArangoAdapter(nodes, edges, config) {
         direction = "outbound";
       }
     }
-    api.node = api.base + "document?collection=" + nodeCollection; 
-    api.edge = api.base + "edge?collection=" + edgeCollection;
   };
   
   self.setNodeLimit = function (pLimit, callback) {
@@ -501,6 +558,21 @@ function ArangoAdapter(nodes, edges, config) {
     }
   };
   
+  self.getAttributeExamples = function(callback) {
+    if (callback && callback.length >= 1) {
+      getNRandom(10, function(l) {
+        var ret = _.uniq(
+          _.flatten(
+            _.map(l, function(o) {
+              return _.keys(o);
+            })
+          )
+        );
+        callback(ret);
+      });
+    }
+  };
+  
   self.changeTo = absAdapter.changeTo;
   self.getPrioList = absAdapter.getPrioList;
 }

html/admin/js/graphViewer/ui/arangoAdapterControls.js

@@ -40,7 +40,7 @@ function ArangoAdapterControls(list, adapter) {
   var self = this,
     baseClass = "adapter";
   
-  this.addControlChangeCollections = function() {
+  this.addControlChangeCollections = function(callback) {
     var prefix = "control_adapter_collections",
       idprefix = prefix + "_";
     adapter.getCollections(function(nodeCols, edgeCols) {
@@ -62,6 +62,9 @@ function ArangoAdapterControls(list, adapter) {
               edges = $("#" + idprefix + "edgecollection").attr("value"),
               undirected = !!$("#" + idprefix + "undirected").attr("checked");
             adapter.changeToCollections(nodes, edges, undirected);
+            if (_.isFunction(callback)) {
+              callback();
+            }
           }
         );
       });

html/admin/js/graphViewer/ui/graphViewerUI.js

@@ -52,6 +52,8 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
     nodeShaperUI,
     adapterUI,
     slider,
+    searchAttrField,
+    searchAttrExampleList,
     //mousePointerBox = document.createElement("div"),
     svg,
     
@@ -170,10 +172,37 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
       */
       dispatcherUI.addAll();
     },
+    
+    updateAttributeExamples = function() {
+      searchAttrExampleList.innerHTML = "";
+      var throbber = document.createElement("li"),
+        throbberImg = document.createElement("img");
+      throbber.appendChild(throbberImg);
+      throbberImg.className = "gv-throbber";
+      searchAttrExampleList.appendChild(throbber);
+      graphViewer.adapter.getAttributeExamples(function(res) {
+        searchAttrExampleList.innerHTML = "";
+        _.each(res, function(r) {
+          var entry = document.createElement("li"),
+            link = document.createElement("a"),
+            lbl = document.createElement("label");
+          entry.appendChild(link);
+          link.appendChild(lbl);
+          lbl.appendChild(document.createTextNode(r));
+          searchAttrExampleList.appendChild(entry);
+          entry.onclick = function() {
+            searchAttrField.value = r;
+          }
+        });
+      });
+    },
+    
     createMenu = function() {
       var transparentHeader = document.createElement("div"),
         searchDiv = document.createElement("div"),
-        searchAttrField = document.createElement("input"),
+        searchAttrDiv = document.createElement("div"),
+        searchAttrExampleToggle = document.createElement("button"),
+        searchAttrExampleCaret = document.createElement("span"),
         searchValueField = document.createElement("input"),
         searchStart = document.createElement("img"),
         buttons = document.createElement("div"),
@@ -274,7 +303,10 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
         configureList,
         graphViewer.adapter
       );
-
+      
+      searchAttrField = document.createElement("input");
+      searchAttrExampleList = document.createElement("ul");
+      
       menubar.id = "menubar";
       menubar.className = "thumbnails2";
       
@@ -286,10 +318,16 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
       searchDiv.id = "transparentPlaceholder";
       searchDiv.className = "pull-left";
       
+      searchAttrDiv.className = "pull-left input-append searchByAttribute";
       searchAttrField.id = "attribute";
-      searchAttrField.className = "input searchByAttribute";
+      searchAttrField.className = "input";
       searchAttrField.type = "text";
       searchAttrField.placeholder = "Attribute";
+      searchAttrExampleToggle.id = "attribute_example_toggle";
+      searchAttrExampleToggle.className = "btn gv_example_toggle";
+      searchAttrExampleToggle.setAttribute("data-toggle", "dropdown");
+      searchAttrExampleCaret.className = "caret";
+      searchAttrExampleList.className = "dropdown-menu";
       searchValueField.id = "value";
       searchValueField.className = "input-xlarge searchInput";
       searchValueField.type = "text";
@@ -319,7 +357,11 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
       
       menubar.appendChild(transparentHeader);
       transparentHeader.appendChild(searchDiv);
-      searchDiv.appendChild(searchAttrField);
+      searchDiv.appendChild(searchAttrDiv);
+      searchAttrDiv.appendChild(searchAttrField);
+      searchAttrDiv.appendChild(searchAttrExampleToggle);
+      searchAttrDiv.appendChild(searchAttrExampleList);
+      searchAttrExampleToggle.appendChild(searchAttrExampleCaret);
       searchDiv.appendChild(equalsField);
       searchDiv.appendChild(searchValueField);
       searchDiv.appendChild(searchStart);
@@ -327,7 +369,7 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
       
       buttons.appendChild(configureDropDown);
       
-      adapterUI.addControlChangeCollections();
+      adapterUI.addControlChangeCollections(updateAttributeExamples);
       adapterUI.addControlChangePriority();
       nodeShaperUI.addControlOpticLabelAndColour();
       
@@ -342,7 +384,7 @@ function GraphViewerUI(container, adapterConfig, optWidth, optHeight, viewerConf
       layouterUI.addAll();
       adapterUI.addAll();
       */
-      
+      updateAttributeExamples();
     },
     
     createColourList = function() {