client/graph_view: console debug log when link is an image according to crude heuristic

What we need to do is two things:
1. when a new link is supplied, go download it and let the browser tell
us if it is an image and if so what are it's dimensions
2. cache that data in the db (on the to-be-added view node).

Actually
3. cache the image itself. This will also allow uploading images with no
link.

Where to cache the images - on disk with a hash, plus breakdown into
multiple directories to avoid filesystem limits.

1 files changed, 18 insertions, 3 deletions

diff --git a/src/client/view/graph_view.js b/src/client/view/graph_view.js
index 42da39aa..591c54b5 100644
--- a/src/client/view/graph_view.js
+++ b/src/client/view/graph_view.js
@@ -246,6 +246,16 @@ function GraphView(spec) {
         }
     }
 
+    var urlValid = function(d) {
+        return d.url !== undefined && d.url !== null && d.url.length > 0;
+    };
+
+    var image_endings = {'jpg':1, 'gif':1, 'png':1, 'bmp':1, 'svg':1};
+
+    var urlImage = function(d) {
+        return urlValid(d) && image_endings[d.url.slice(d.url.lastIndexOf('.') + 1)] !== undefined;
+    };
+
     function update_view(relayout) {
         var node,
             link,
@@ -468,9 +478,14 @@ function GraphView(spec) {
         node.select('g.node text')
             .attr("dx", nodeTextX);
         node.select('g.node a image')
-            .attr("width", "14")
-            .attr("height", "14")
-            .attr("xlink:href", "/static/img/url-icon.png");
+            .each(function (d, i) {
+                if (urlImage(d)) {
+                    console.log('an image!');
+                }
+                this.setAttribute("width", "14");
+                this.setAttribute("height", "14");
+                this.setAttributeNS("http://www.w3.org/1999/xlink", "href", "/static/img/url-icon.png");
+            });
         circle = nodeEnter.insert("circle");
         node.select('g.node circle')
             .attr("class", function(d) {