ui: better smart graph support

js/apps/system/_admin/aardvark/APP/aardvark.js

@@ -379,6 +379,12 @@ authRouter.get('/graph/:name', function (req, res) {
         vertexCollections: vertexCollections
       }
     };
+    if (isEnterprise) {
+      if (graph.__isSmart) {
+        toReturn.settings.isSmart = graph.__isSmart;
+        toReturn.settings.smartGraphAttribute = graph.__smartGraphAttribute;
+      }
+    }
   } else {
     var aqlQuery;
     if (config.query) {
@@ -607,6 +613,12 @@ authRouter.get('/graph/:name', function (req, res) {
         startVertex: startVertex
       }
     };
+    if (isEnterprise) {
+      if (graph.__isSmart) {
+        toReturn.settings.isSmart = graph.__isSmart;
+        toReturn.settings.smartGraphAttribute = graph.__smartGraphAttribute;
+      }
+    }
   }
 
   res.json(toReturn);

js/apps/system/_admin/aardvark/APP/frontend/js/collections/graphCollection.js

@@ -29,6 +29,39 @@
       });
     },
 
+    createNode: function (gName, gCollection, data, callback) {
+      $.ajax({
+        type: 'POST',
+        url: arangoHelper.databaseUrl('/_api/gharial/') + encodeURIComponent(gName) + '/vertex/' + encodeURIComponent(gCollection),
+        contentType: 'application/json',
+        data: JSON.stringify(data),
+        processData: true,
+        success: function (response) {
+          callback(false, response.vertex._id);
+        },
+        error: function (response) {
+          callback(true, null, response.responseJSON.errorMessage);
+        }
+      });
+    },
+
+    createEdge: function (gName, gCollection, data, callback) {
+      $.ajax({
+        cache: false,
+        type: 'POST',
+        url: arangoHelper.databaseUrl('/_api/gharial/') + encodeURIComponent(gName) + '/edge/' + encodeURIComponent(gCollection),
+        data: JSON.stringify(data),
+        contentType: 'application/json',
+        processData: false,
+        success: function (response) {
+          callback(false, response.edge._id);
+        },
+        error: function (response) {
+          callback(true, null, response.responseJSON.errorMessage);
+        }
+      });
+    },
+
     comparator: function (item, item2) {
       var a = item.get('_key') || '';
       var b = item2.get('_key') || '';

js/apps/system/_admin/aardvark/APP/frontend/js/views/graphViewer.js

@@ -824,12 +824,12 @@
     addNode: function () {
       var self = this;
 
-      var collectionId = $('.modal-body #new-node-collection-attr').val();
+      var collection = $('.modal-body #new-node-collection-attr').val();
       var key = $('.modal-body #new-node-key-attr').last().val();
 
       var callback = function (error, id, msg) {
         if (error) {
-          arangoHelper.arangoError('Could not create node', msg.errorMessage);
+          arangoHelper.arangoError('Could not create node', msg);
         } else {
           $('#emptyGraph').remove();
           self.currentGraph.graph.addNode({
@@ -850,12 +850,20 @@
           self.cameraToNode(self.currentGraph.graph.nodes(id));
         }
       };
-
+      var data = {};
-      if (key !== '' || key !== undefined) {
+      if (key !== '' && key !== undefined) {
-        this.documentStore.createTypeDocument(collectionId, key, callback);
+        data._key = key;
-      } else {
-        this.documentStore.createTypeDocument(collectionId, null, callback);
       }
+      if (this.graphSettings.isSmart) {
+        var smartAttribute = $('#new-smart-key-attr').val();
+        if (smartAttribute !== '' && smartAttribute !== undefined) {
+          data[this.graphSettings.smartGraphAttribute] = smartAttribute;
+        } else {
+          data[this.graphSettings.smartGraphAttribute] = null;
+        }
+      }
+
+      this.collection.createNode(self.name, collection, data, callback);
     },
 
     deleteEdgeModal: function (edgeId) {
@@ -905,7 +913,7 @@
         _.each(this.graphSettings.vertexCollections, function (val) {
           collections.push({
             label: val.name,
-            value: val.id
+            value: val.name
           });
         });
 
@@ -926,6 +934,27 @@
           )
         );
 
+        if (this.graphSettings.isSmart) {
+          tableContent.push(
+            window.modalView.createTextEntry(
+              'new-smart-key-attr',
+              this.graphSettings.smartGraphAttribute + '*',
+              undefined,
+              'The attribute value that is used to smartly shard the vertices of a graph. \n' +
+              'Every vertex in this Graph has to have this attribute. \n' +
+              'Cannot be modified later.',
+              'Cannot be modified later.',
+              false,
+              [
+                {
+                  rule: Joi.string().allow('').optional(),
+                  msg: ''
+                }
+              ]
+            )
+          );
+        }
+
         tableContent.push(
           window.modalView.createSelectEntry(
             'new-node-collection-attr',
@@ -956,33 +985,27 @@
       var from = self.contextState._from;
       var to = self.contextState._to;
 
-      var collectionName;
+      var collection;
       if ($('.modal-body #new-edge-collection-attr').val() === '') {
-        collectionName = $('.modal-body #new-edge-collection-attr').text();
+        collection = $('.modal-body #new-edge-collection-attr').text();
       } else {
-        collectionName = $('.modal-body #new-edge-collection-attr').val();
+        collection = $('.modal-body #new-edge-collection-attr').val();
       }
       var key = $('.modal-body #new-edge-key-attr').last().val();
 
-      var callback = function (error, data, msg) {
+      var callback = function (error, id, msg) {
         if (!error) {
-          // success
+          var edge = {
+            source: from,
+            target: to,
+            id: id,
+            color: self.graphConfig.edgeColor || self.ecolor
+          };
+
           if (self.graphConfig.edgeEditable === 'true') {
-            self.currentGraph.graph.addEdge({
+            edge.size = 1;
-              source: from,
-              size: 1,
-              target: to,
-              id: data._id,
-              color: self.graphConfig.edgeColor || self.ecolor
-            });
-          } else {
-            self.currentGraph.graph.addEdge({
-              source: from,
-              target: to,
-              id: data._id,
-              color: self.graphConfig.edgeColor || self.ecolor
-            });
           }
+          self.currentGraph.graph.addEdge(edge);
 
           // rerender graph
           if (self.graphConfig) {
@@ -992,7 +1015,7 @@
           }
           self.currentGraph.refresh();
         } else {
-          arangoHelper.arangoError('Could not create edge', msg.errorMessage);
+          arangoHelper.arangoError('Could not create edge', msg);
         }
 
         // then clear states
@@ -1000,11 +1023,14 @@
         window.modalView.hide();
       };
 
-      if (key !== '' || key !== undefined) {
+      var data = {
-        this.documentStore.createTypeEdge(collectionName, from, to, key, callback);
+        _from: from,
-      } else {
+        _to: to
-        this.documentStore.createTypeEdge(collectionName, from, to, null, callback);
+      };
+      if (key !== '' && key !== undefined) {
+        data._key = key;
       }
+      this.collection.createEdge(self.name, collection, data, callback);
     },
 
     addEdgeModal: function (edgeDefinitions) {
@@ -1053,7 +1079,7 @@
               'new-edge-collection-attr',
               'Edge collection',
               edgeDefinitions[0],
-              'The edges collection to be used.'
+              'The edge collection to be used.'
             )
           );
         }
@@ -1980,8 +2006,12 @@
 
             // validate edgeDefinitions
             var foundEdgeDefinitions = self.getEdgeDefinitionCollections(fromCollection, toCollection);
+            if (foundEdgeDefinitions.length === 0) {
+              arangoHelper.arangoNotification('Graph', 'No valid edge definition found.');
+            } else {
               self.addEdgeModal(foundEdgeDefinitions, self.contextState._from, self.contextState._to);
               self.clearOldContextMenu(false);
+            }
           } else {
             if (!self.dragging) {
               if (self.contextState.createEdge === true) {