better variable names!

erabug · Jan 21, 2015 · 08fd74e · 08fd74e
1 parent 9762084
commit 08fd74e
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 22 deletions.
diff --git a/static/js/graph.js b/static/js/graph.js
@@ -3,8 +3,8 @@ function drawGraph(json) {
     var pathLength = Object.keys(queryInfo).length;
 
     // establish width and height of the svg
-    var width = 600,
-        height = pathLength * 110;
+    var width = 600;
+    var height = pathLength * 110;
 
     // color established as a scale
     var color = d3.scale.category20();
@@ -89,7 +89,9 @@ function drawGraph(json) {
     Object.keys(queryInfo).forEach(function(key) {
         // identify the start node
         var img = queryInfo[key];
-        if (img.code === 0) start = key;
+        if (img.code === 0) {
+            start = key;
+        }
         // define clip paths for each path node
         defs.append('clipPath')
             .attr('id', 'img' + key.toString())
@@ -117,13 +119,11 @@ function drawGraph(json) {
                 // assign radius to node attribute for arrowhead placement
                 d.radius = 18;
             } else {
-                // scales linear with degrees
-                d.radius = d.degrees * 0.02 + 7;
+                d.radius = d.degrees * 0.02 + 7; // scales linearly with degrees
             }
             return d.radius;
         })
         .style('fill', function(d) {
-            // colors based on degrees
             return color(d.degrees);
         });
 
@@ -141,17 +141,20 @@ function drawGraph(json) {
         .attr('x', function(d) { return -queryInfo[d.code].width / 2;})
         // this seems to help for portraits, where height > width
         .attr('y', function(d) {
-            var h = queryInfo[d.code].height;
-            var x;
-            if (h > queryInfo[d.code].width) x = 12; else x = 0;
-            return -(h / 2) + x;
+            var imgHeight = queryInfo[d.code].height;
+            var offset;
+            if (h > queryInfo[d.code].width) {
+                offset = 12;
+            } else {
+                offset = 0;
+            }
+            return -(imgHeight / 2) + offset;
         })
         .attr('height', function(d) { return queryInfo[d.code].height;})
         .attr('width', function(d) { return queryInfo[d.code].width;})
         .attr('clip-path', function(d) {
-            var x = 'img' + d.code;
-            // unique clip path for this node
-            return 'url(#' + x + ')';
+            var clipPathID = 'img' + d.code;
+            return 'url(#' + clipPathID + ')'; // unique clip path for this node
         });
 
     // append empty circle to each path node as an outline
@@ -174,7 +177,7 @@ function drawGraph(json) {
         .links(json.links)
         .start();
 
-    // this occurs each time 'tick' is called by d3
+    // this block occurs each time 'tick' is called by d3
     force.on('tick', function() {
         node.attr('cx', function(d) {
                 d.x = Math.max(15, Math.min(width - 15, d.x));

diff --git a/static/js/summary.js b/static/js/summary.js
@@ -1,5 +1,5 @@
 function getSummaryImages(numPages, pageParams) {
-    queryURL = makeQueryURL(size=60, numPages, pageParams);
+    queryURL = makeQueryURL(60, numPages, pageParams);
     $.getJSON(
         queryURL,
         function(data) {
@@ -52,16 +52,20 @@ function displaySummary(path) {
         })
         .attr("x", function(d) { return -queryInfo[d.code].tinyWidth / 2;})
         .attr("y", function(d) {
-            var h = queryInfo[d.code].tinyHeight;
-            var x;
-            if (h > queryInfo[d.code].tinyWidth) x = 6; else x = 0;
-            return -(h / 2) + x;
+            var imgHeight = queryInfo[d.code].tinyHeight;
+            var offset;
+            if (h > queryInfo[d.code].tinyWidth) {
+                offset = 6;
+            } else {
+                offset = 0;
+            }
+            return -(imgHeight / 2) + offset;
         })
         .attr("height", function(d) { return queryInfo[d.code].tinyHeight;})
         .attr("width", function(d) { return queryInfo[d.code].tinyWidth;})
         .attr("clip-path", function(d) {
-            var x = 'timg' + d.code;
-            return "url(#" + x + ")"; // unique clip path for this node
+            var clipPathID = 'timg' + d.code;
+            return "url(#" + clipPathID + ")"; // unique clip path for this node
         });
 
     // append empty circle to nodes as an outline
@@ -71,7 +75,7 @@ function displaySummary(path) {
         .style("stroke-width", "2px")
         .style("fill", "none");
 
-    tinyNode.append("foreignObject") // this is necessary to have wrapped titles
+    tinyNode.append("foreignObject") // necessary for wrapped title strings
         .attr({width: 145, height: 45})
         .attr({x: 30, y: function(d) {
             var len = d.title.length;