Bubble click area + Linting
authorChloe Laisne <chloe.laisne@gmail.com>
Fri, 10 Jun 2016 16:19:25 +0200
changeset 183 cc8b022088c8
parent 182 1bcc373adabb
child 184 558a3522343c
Bubble click area + Linting
cms/app-client/.jshintrc
cms/app-client/app/components/discourses-component.js
--- a/cms/app-client/.jshintrc	Thu Jun 09 17:11:14 2016 +0200
+++ b/cms/app-client/.jshintrc	Fri Jun 10 16:19:25 2016 +0200
@@ -1,33 +1,33 @@
 {
-  "predef": [
-    "server",
-    "document",
-    "window",
-    "-Promise"
-  ],
-  "browser": true,
-  "boss": true,
-  "curly": true,
-  "debug": false,
-  "devel": true,
-  "eqeqeq": true,
-  "evil": true,
-  "forin": false,
-  "immed": false,
-  "laxbreak": false,
-  "newcap": true,
-  "noarg": true,
-  "noempty": false,
-  "nonew": false,
-  "nomen": false,
-  "onevar": false,
-  "plusplus": false,
-  "regexp": false,
-  "undef": true,
-  "sub": true,
-  "strict": false,
-  "white": false,
-  "eqnull": true,
-  "esnext": true,
-  "unused": true
+    "predef": [
+        "server",
+        "document",
+        "window",
+        "-Promise"
+    ],
+    "browser": true,
+    "boss": true,
+    "curly": true,
+    "debug": false,
+    "devel": true,
+    "eqeqeq": true,
+    "evil": true,
+    "forin": false,
+    "immed": false,
+    "laxbreak": false,
+    "newcap": true,
+    "noarg": true,
+    "noempty": false,
+    "nonew": false,
+    "nomen": false,
+    "onevar": false,
+    "plusplus": false,
+    "regexp": false,
+    "undef": true,
+    "sub": true,
+    "strict": false,
+    "white": false,
+    "eqnull": true,
+    "esnext": true,
+    "unused": true
 }
--- a/cms/app-client/app/components/discourses-component.js	Thu Jun 09 17:11:14 2016 +0200
+++ b/cms/app-client/app/components/discourses-component.js	Fri Jun 10 16:19:25 2016 +0200
@@ -34,32 +34,31 @@
             var caption = element.append("div")
                 .style("position", "absolute")
                 .style("transform-origin", "50% 50% 0px")
-                .style("width", width + "px")
-                .style("height", height + "px")
                 .attr("class", "caption");
 
             var caption_nodes = caption.selectAll(".node")
                 .data(bubbles);
 
             caption_nodes.enter().append("div")
-                .attr("class", function(d) { return 'item' + (d.children ? ' category': ''); })
+                .attr("class", function(d) { return d.children ? " category": " item"; });
+
+            var item = caption.selectAll(".item")
                 .style("width", function(d) { return Math.max(10 + d.r, d.r) * 2 + 'px'; })
                 .style("height", function(d) { return Math.max(10 + d.r, d.r) * 2 + 'px'; })
-                .style("position", function(d) { return 'absolute'; })
+                .style("position", "absolute")
                 .style("left", function(d) { return d.x - Math.max(10 + d.r, d.r) + 'px'; })
-                .style("top", function(d) { return d.y - Math.max(10 + d.r, d.r) + 'px'; });
-
-            var text = caption.selectAll(".item")
-                .append("span")
-
+                .style("top", function(d) { return d.y - Math.max(10 + d.r, d.r) + 'px'; })
+                .on('click', function(d) { document.location = self.setQueryString('discours', d.name); });
+            
+            item.append("span")
                 .text(function(d) { return d.name; })
                 .style("text-align", "center")
                 .style("display", function(d) { return d.children ? 'none' : 'inline-block'; })
-                .style("width", function(d) { return $(this).parent().width() > $(this).width() ? $(this).parent().width() + 'px' : ''; })
+                .style("width", function() { return $(this).parent().width() > $(this).width() ? $(this).parent().width() + 'px' : ''; })
                 .style("text-transform", "capitalize")
                 .style("font-size", "15px")
-                .style("margin-left", function(d) { return ( $(this).width() > $(this).parent().width() ? - ( $(this).width() / 2 ) + ( $(this).parent().width() / 2 ) : 0 ) + 'px'; })
-                .style("margin-top", function(d) { return $(this).parent().height() / 2 - $(this).height() / 2 + 'px'; });
+                .style("margin-left", function() { return ( $(this).width() > $(this).parent().width() ? - ( $(this).width() / 2 ) + ( $(this).parent().width() / 2 ) : 0 ) + 'px'; })
+                .style("margin-top", function() { return $(this).parent().height() / 2 - $(this).height() / 2 + 'px'; });
 
             var svg = element.append("svg")
                 .style("width", width + "px")
@@ -71,7 +70,7 @@
 
             svg_nodes.enter().append("g")
                 .attr("class", function(d) { return "node" + (!d.children ? " leaf" : ""); })
-                .attr("transform", function(d) { console.log(d); return "translate(" + d.x + "," + d.y + ")"; });
+                .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
 
             var leaf = svg.selectAll(".leaf")
                 .on('click', function(d) { document.location = self.setQueryString('discours', d.name); });