From 4a256b1dc46073fd404d9d5fc93369975b51a135 Mon Sep 17 00:00:00 2001
From: Adrian Kuhn <adrian.kuhn@airbnb.com>
Date: Thu, 1 Oct 2015 17:58:47 -0700
Subject: [PATCH] Reformat javascript code.

---
 panoramix/static/widgets/viz_bignumber.css |  14 +-
 panoramix/static/widgets/viz_bignumber.js  | 174 +++++++------
 panoramix/static/widgets/viz_nvd3.js       | 278 ++++++++++-----------
 3 files changed, 228 insertions(+), 238 deletions(-)

diff --git a/panoramix/static/widgets/viz_bignumber.css b/panoramix/static/widgets/viz_bignumber.css
index 56ea4659d..83c6c467e 100644
--- a/panoramix/static/widgets/viz_bignumber.css
+++ b/panoramix/static/widgets/viz_bignumber.css
@@ -1,16 +1,16 @@
-.viz_bignumber g.axis text{
-  font-size:10px;
-  font-weight:normal;
+.viz_bignumber g.axis text {
+  font-size: 10px;
+  font-weight: normal;
   color: gray;
   fill: gray;
-  text-anchor:middle;
+  text-anchor: middle;
   alignment-baseline: middle;
   font-weight: none;
 }
 
-.viz_bignumber text.big{
+.viz_bignumber text.big {
   stroke: black;
-  text-anchor:middle;
+  text-anchor: middle;
   fill: black;
 }
 
@@ -22,5 +22,5 @@
 .viz_bignumber .domain {
   fill: none;
   stroke: black;
-  stroke-width; 1;
+  stroke-width: 1;
 }
diff --git a/panoramix/static/widgets/viz_bignumber.js b/panoramix/static/widgets/viz_bignumber.js
index 5de399505..f405ca9f7 100644
--- a/panoramix/static/widgets/viz_bignumber.js
+++ b/panoramix/static/widgets/viz_bignumber.js
@@ -1,75 +1,75 @@
 function viz_bignumber(token, json_callback) {
-
-var div = d3.select('#' + token);
-var render = function(){
-  d3.json(json_callback, function(error, payload){
-    json = payload.data;
-    div.html("");
-    //Define the percentage bounds that define color from red to green
-    if(error != null){
-      var err = '<div class="alert alert-danger">' + error.responseText  + '</div>';
-      div.html(err);
-      return '';
-    }
-    var color_range = [-1,1];
-    var compare_pos = -23
-    var target_url = 'd3js.org';
-
-    var f = d3.format('.3s');
-    var fp = d3.format('+.1%');
-    var xy = div.node().getBoundingClientRect();
-    var width = xy.width;
-    var height = xy.height-30;
-    var svg = div.append('svg');
-    svg.attr("width", width);
-    svg.attr("height", height);
-    data = json.data;
-    var compare_suffix = ' ' + json.compare_suffix;
-    var v_compare = null;
-    var v = data[data.length -1][1];
-    if (json.compare_lag >0){
-      pos = data.length - (json.compare_lag+1);
-      if(pos >=0){
-        v_compare = (v / data[pos][1])-1;
+  var div = d3.select('#' + token);
+  var render = function() {
+    d3.json(json_callback, function(error, payload){
+      json = payload.data;
+      div.html("");
+      //Define the percentage bounds that define color from red to green
+      if (error != null){
+        var err = '<div class="alert alert-danger">' + error.responseText  + '</div>';
+        div.html(err);
+        return '';
       }
-    }
-    var date_ext = d3.extent(data, function(d){return d[0]});
-    var value_ext = d3.extent(data, function(d){return d[1]});
+      var color_range = [-1, 1];
+      var compare_pos = -23
+      var target_url = 'd3js.org';
 
-    var margin=20;
-    var scale_x = d3.time.scale.utc().domain(date_ext).range([margin, width-margin]);
-    var scale_y = d3.scale.linear().domain(value_ext).range([height-(margin),margin]);
-    var colorRange = [d3.hsl(0,1,0.3), d3.hsl(120, 1, 0.3)];
-    var scale_color = d3.scale
-        .linear().domain(color_range)
-        .interpolate(d3.interpolateHsl)
-        .range(colorRange).clamp(true);
-    var line = d3.svg.line()
-        .x(function(d) { return scale_x(d[0])})
-        .y(function(d) { return scale_y(d[1])})
-        .interpolate("basis");
+      var f = d3.format('.3s');
+      var fp = d3.format('+.1%');
+      var xy = div.node().getBoundingClientRect();
+      var width = xy.width;
+      var height = xy.height - 30;
+      var svg = div.append('svg');
+      svg.attr("width", width);
+      svg.attr("height", height);
+      data = json.data;
+      var compare_suffix = ' ' + json.compare_suffix;
+      var v_compare = null;
+      var v = data[data.length - 1][1];
+      if (json.compare_lag > 0){
+        pos = data.length - (json.compare_lag + 1);
+        if (pos >= 0){
+          v_compare = (v / data[pos][1]) - 1;
+        }
+      }
+      var date_ext = d3.extent(data, function(d) { return d[0]; });
+      var value_ext = d3.extent(data, function(d) { return d[1]; });
 
-    //Drawing trend line
-    var g = svg.append('g');
-    var path = g.append('path')
-        .attr('d', function(d){return line(data);})
-        .attr('stroke-width', 5)
-        .attr('opacity', 0.5)
-        .attr('fill', "none")
-        .attr('stroke-linecap',"round")
-        .attr('stroke', "grey");
+      var margin = 20;
+      var scale_x = d3.time.scale.utc().domain(date_ext).range([margin, width - margin]);
+      var scale_y = d3.scale.linear().domain(value_ext).range([height - (margin), margin]);
+      var colorRange = [d3.hsl(0, 1, 0.3), d3.hsl(120, 1, 0.3)];
+      var scale_color = d3.scale
+          .linear().domain(color_range)
+          .interpolate(d3.interpolateHsl)
+          .range(colorRange).clamp(true);
+      var line = d3.svg.line()
+          .x(function(d) { return scale_x(d[0]); })
+          .y(function(d) { return scale_y(d[1]); })
+          .interpolate("basis");
 
-    var g = svg.append('g')
-      .attr('class', 'digits')
-      .attr('opacity', 1);
+      //Drawing trend line
+      var g = svg.append('g');
+      var path = g.append('path')
+          .attr('d', function(d) { return line(data); })
+          .attr('stroke-width', 5)
+          .attr('opacity', 0.5)
+          .attr('fill', "none")
+          .attr('stroke-linecap',"round")
+          .attr('stroke', "grey");
 
-    var y = height/2;
-    if(v_compare != null)
-      y = (height/8) * 3;
+      var g = svg.append('g')
+         .attr('class', 'digits')
+         .attr('opacity', 1);
 
-    //Printing big number
+      var y = height / 2;
+      if (v_compare != null) {
+        y = (height / 8) * 3;
+      }
+
+      //Printing big number
       g.append('text')
-        .attr('x', width/2)
+        .attr('x', width / 2)
         .attr('y', y)
         .attr('class', 'big')
         .attr('alignment-baseline', 'middle')
@@ -77,34 +77,33 @@ var render = function(){
         .style('font-weight', 'bold')
         .style('cursor', 'pointer')
         .text(f(v))
-        .style('font-size', d3.min([height, width])/3.5)
+        .style('font-size', d3.min([height, width]) / 3.5)
         .attr('fill','white');
 
-    var c = scale_color(v_compare);
+      var c = scale_color(v_compare);
 
-    //Printing compare %
-    if(v_compare != null){
-      g.append('text')
-        .attr('x', width/2)
-        .attr('y', (height/16) *12)
-        .text(fp(v_compare) + compare_suffix)
-        .style('font-size', d3.min([height, width])/8)
-        .style('text-anchor', 'middle')
-        .attr('fill', c)
-        .attr('stroke', c);
-    }
+      //Printing compare %
+      if (v_compare != null) {
+        g.append('text')
+          .attr('x', width / 2)
+          .attr('y', (height / 16) *12)
+          .text(fp(v_compare) + compare_suffix)
+          .style('font-size', d3.min([height, width]) / 8)
+          .style('text-anchor', 'middle')
+          .attr('fill', c)
+          .attr('stroke', c);
+      }
 
-      var g_axis = svg.append('g').attr('class', 'axis').attr('opacity',0);
+      var g_axis = svg.append('g').attr('class', 'axis').attr('opacity', 0);
       var g = g_axis.append('g');
       var x_axis = d3.svg.axis()
         .scale(scale_x)
         .orient('bottom')
-        //.tickFormat(d3.time.format('%I%p'))
         .ticks(4);
       g.call(x_axis);
-      g.attr('transform', 'translate(0,'+ (height-margin) +')');
+      g.attr('transform', 'translate(0,' + (height - margin) + ')');
 
-      var g = g_axis.append('g').attr('transform', 'translate('+(width-margin)+',0)');
+      var g = g_axis.append('g').attr('transform', 'translate(' + (width - margin) + ',0)');
       var y_axis = d3.svg.axis()
         .scale(scale_y)
         .orient('left')
@@ -112,26 +111,21 @@ var render = function(){
         .tickValues(value_ext);
       g.call(y_axis);
       g.selectAll('text')
-        .style('text-anchor','end')
+        .style('text-anchor', 'end')
         .attr('y','-5')
         .attr('x','1');
 
       g.selectAll("text")
-        .style('font-size','10px');
+        .style('font-size', '10px');
 
-      /*
-      g_axis.selectAll('path.domain')
-        .attr('stroke-width:1px;');
-      */
-
-      div.on('mouseover', function(d){
+      div.on('mouseover', function(d) {
         var div = d3.select(this);
         div.select('path').transition().duration(500).attr('opacity', 1)
           .style('stroke-width', '2px');
         div.select('g.digits').transition().duration(500).attr('opacity', 0.1);
         div.select('g.axis').transition().duration(500).attr('opacity', 1);
       })
-      .on('mouseout', function(d){
+      .on('mouseout', function(d) {
         var div = d3.select(this);
         div.select('path').transition().duration(500).attr('opacity', 0.5)
           .style('stroke-width', '5px');
diff --git a/panoramix/static/widgets/viz_nvd3.js b/panoramix/static/widgets/viz_nvd3.js
index 7f4b90b42..01cac9ec7 100644
--- a/panoramix/static/widgets/viz_nvd3.js
+++ b/panoramix/static/widgets/viz_nvd3.js
@@ -1,143 +1,139 @@
-
 function viz_nvd3(token_name, json_callback) {
-    function UTC(dttm){
-      return v = new Date(dttm.getUTCFullYear(), dttm.getUTCMonth(), dttm.getUTCDate(),  dttm.getUTCHours(), dttm.getUTCMinutes(), dttm.getUTCSeconds());
-    }
-    var tickMultiFormat = d3.time.format.multi([
-      [".%L", function(d) { return d.getMilliseconds(); }],
-      [":%S", function(d) { return d.getSeconds(); }],
-      ["%I:%M", function(d) { return d.getMinutes(); }],
-      ["%I %p", function(d) { return d.getHours(); }],
-      ["%a %d", function(d) { return d.getDay() && d.getDate() != 1; }],
-      ["%b %d", function(d) { return d.getDate() != 1; }],
-      ["%B", function(d) { return d.getMonth(); }],
-      ["%Y", function() { return true; }]
-    ]);
-    colors = [
-      "#FF5A5F", "#007A87", "#7B0051", "#00D1C1", "#8CE071", "#FFB400",
-      "#FFAA91", "#B4A76C", "#9CA299", "#565A5C"
-    ];
-    var token = d3.select('#' + token_name);
-    var jtoken = $('#' + token_name);
-    var loading = $('#' + token_name).find("img.loading");
-    var chart = $('#' + token_name).find("div.chart");
-    var refresh = function(){
-      chart.hide();
-      loading.show();
-      $.getJSON(json_callback, function(payload){
-        var data = payload.data;
-        var viz = payload;
-        var viz_type = viz.form_data.viz_type;
-        $("#query_container").html(data.query);
-        nv.addGraph(function() {
-          if (viz_type === 'line') {
-            if (viz.form_data.show_brush) {
-              var chart = nv.models.lineWithFocusChart()
-              var xext = chart.xAxis.scale().domain();
-              chart
-                .x2Axis
-                .tickFormat(function (d) {return tickMultiFormat(UTC(new Date(d))); })
-                .tickValues([]);
-              chart.y2Axis.tickFormat(d3.format('.3s'));
-            } else {
-              var chart = nv.models.lineChart()
-            }
-            chart.xScale(d3.time.scale());
-            chart.xAxis
-              .showMaxMin(false)
-              .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
-            chart.showLegend(viz.form_data.show_legend);
-            chart.yAxis.tickFormat(d3.format('.3s'));
-
-            if (viz.form_data.contribution || viz.form_data.num_period_compare) {
-              chart.yAxis.tickFormat(d3.format('.3p'));
-              chart.y2Axis.tickFormat(d3.format('.3p'));
-            }
-
-          } else if (viz_type === 'dist_bar') {
-            var chart = nv.models.multiBarChart()
-              .showControls(true)   //Allow user to switch between 'Grouped' and 'Stacked' mode.
-              .groupSpacing(0.1);   //Distance between each group of bars.
-            chart.xAxis
-              .showMaxMin(false)
-              .tickFormat(function (d) {return tickMultiFormat(UTC(new Date(d))); });
-            chart.yAxis.tickFormat(d3.format('.3s'));
-
-          } else if (viz_type === 'pie') {
-            var chart = nv.models.pieChart()
-            chart.showLegend(viz.form_data.show_legend);
-            if (viz.form_data.donut) {
-              chart.donut(true);
-              chart.donutLabelsOutside(true);
-            }
-            chart.labelsOutside(true);
-            chart.cornerRadius(true);
-
-          } else if (viz_type === 'column') {
-            var chart = nv.models.multiBarChart()
-              .reduceXTicks(false)
-              .rotateLabels(45) ;
-            chart.yAxis.tickFormat(d3.format('.3s'));
-
-          } else if (viz_type === 'compare') {
-            var chart = nv.models.cumulativeLineChart();
-            chart.xScale(d3.time.scale());
-            chart.xAxis
-              .showMaxMin(false)
-              .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
-            chart.showLegend(viz.form_data.show_legend);
-            chart.yAxis.tickFormat(d3.format('.3p'));
-
-          } else if (viz_type === 'bubble') {
-            var chart = nv.models.scatterChart();
-            chart.xAxis.tickFormat(d3.format('.3s'));
-            chart.yAxis.tickFormat(d3.format('.3s'));
-            chart.showLegend(viz.form_data.show_legend);
-            chart.pointRange([5, 5000]);
-
-          } else if (viz_type === 'area') {
-            var chart = nv.models.stackedAreaChart();
-            chart.xScale(d3.time.scale());
-            chart.xAxis
-              .showMaxMin(false)
-              .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
-            chart.showLegend(viz.form_data.show_legend);
-            chart.yAxis.tickFormat(d3.format('.3s'));
-
-          }
-
-          if ((viz_type === "line" || viz_type === "stacked") && viz.form_data.rich_tooltip) {
-            chart.useInteractiveGuideline(true);
-          }
-          if (viz.form_data.y_axis_zero) {
-            chart.forceY([0, 1]);
-          }
-          else if (viz.form_data.y_log_scale) {
-            chart.yScale(d3.scale.log());
-          }
-
-          if (viz.form_data.x_log_scale) {
-            chart.xScale(d3.scale.log());
-          }
-
-          chart.duration(0);
-
-          token.select('.chart').append("svg")
-            .datum(data.chart_data)
-            .transition().duration(500)
-            .call(chart);
-
-          return chart;
-        });
-        chart.show();
-        loading.hide();
-    }).fail(function(xhr) {
-        var err = '<div class="alert alert-danger">' + xhr.responseText  + '</div>';
-        loading.hide();
-        chart.show();
-        chart.html(err);
-      });
-    };
-    refresh();
-    jtoken.parent().find("a.refresh").click(refresh);
+  function UTC(dttm){
+    return v = new Date(dttm.getUTCFullYear(), dttm.getUTCMonth(), dttm.getUTCDate(),  dttm.getUTCHours(), dttm.getUTCMinutes(), dttm.getUTCSeconds());
   }
+  var tickMultiFormat = d3.time.format.multi([
+    [".%L", function(d) { return d.getMilliseconds(); }],
+    [":%S", function(d) { return d.getSeconds(); }],
+    ["%I:%M", function(d) { return d.getMinutes(); }],
+    ["%I %p", function(d) { return d.getHours(); }],
+    ["%a %d", function(d) { return d.getDay() && d.getDate() != 1; }],
+    ["%b %d", function(d) { return d.getDate() != 1; }],
+    ["%B", function(d) { return d.getMonth(); }],
+    ["%Y", function() { return true; }]
+  ]);
+  colors = [
+    "#FF5A5F", "#007A87", "#7B0051", "#00D1C1", "#8CE071", "#FFB400",
+    "#FFAA91", "#B4A76C", "#9CA299", "#565A5C"
+  ];
+  var token = d3.select('#' + token_name);
+  var jtoken = $('#' + token_name);
+  var loading = $('#' + token_name).find("img.loading");
+  var chart = $('#' + token_name).find("div.chart");
+  var refresh = function() {
+    chart.hide();
+    loading.show();
+    $.getJSON(json_callback, function(payload) {
+      var data = payload.data;
+      var viz = payload;
+      var viz_type = viz.form_data.viz_type;
+      $("#query_container").html(data.query);
+      nv.addGraph(function() {
+        if (viz_type === 'line') {
+          if (viz.form_data.show_brush) {
+            var chart = nv.models.lineWithFocusChart()
+            var xext = chart.xAxis.scale().domain();
+            chart
+              .x2Axis
+              .tickFormat(function (d) {return tickMultiFormat(UTC(new Date(d))); })
+              .tickValues([]);
+            chart.y2Axis.tickFormat(d3.format('.3s'));
+          } else {
+            var chart = nv.models.lineChart()
+          }
+          chart.xScale(d3.time.scale());
+          chart.xAxis
+            .showMaxMin(false)
+            .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
+          chart.showLegend(viz.form_data.show_legend);
+          chart.yAxis.tickFormat(d3.format('.3s'));
+          if (viz.form_data.contribution || viz.form_data.num_period_compare) {
+            chart.yAxis.tickFormat(d3.format('.3p'));
+            chart.y2Axis.tickFormat(d3.format('.3p'));
+          }
+
+        } else if (viz_type === 'dist_bar') {
+          var chart = nv.models.multiBarChart()
+            .showControls(true)   //Allow user to switch between 'Grouped' and 'Stacked' mode.
+            .groupSpacing(0.1);   //Distance between each group of bars.
+          chart.xAxis
+            .showMaxMin(false)
+            .tickFormat(function (d) {return tickMultiFormat(UTC(new Date(d))); });
+          chart.yAxis.tickFormat(d3.format('.3s'));
+
+        } else if (viz_type === 'pie') {
+          var chart = nv.models.pieChart()
+          chart.showLegend(viz.form_data.show_legend);
+          if (viz.form_data.donut) {
+            chart.donut(true);
+            chart.donutLabelsOutside(true);
+          }
+          chart.labelsOutside(true);
+          chart.cornerRadius(true);
+
+        } else if (viz_type === 'column') {
+          var chart = nv.models.multiBarChart()
+            .reduceXTicks(false)
+            .rotateLabels(45) ;
+          chart.yAxis.tickFormat(d3.format('.3s'));
+
+        } else if (viz_type === 'compare') {
+          var chart = nv.models.cumulativeLineChart();
+          chart.xScale(d3.time.scale());
+          chart.xAxis
+            .showMaxMin(false)
+            .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
+          chart.showLegend(viz.form_data.show_legend);
+          chart.yAxis.tickFormat(d3.format('.3p'));
+
+        } else if (viz_type === 'bubble') {
+          var chart = nv.models.scatterChart();
+          chart.xAxis.tickFormat(d3.format('.3s'));
+          chart.yAxis.tickFormat(d3.format('.3s'));
+          chart.showLegend(viz.form_data.show_legend);
+          chart.pointRange([5, 5000]);
+
+        } else if (viz_type === 'area') {
+          var chart = nv.models.stackedAreaChart();
+          chart.xScale(d3.time.scale());
+          chart.xAxis
+            .showMaxMin(false)
+            .tickFormat(function (d) {return tickMultiFormat(new Date(d)); });
+          chart.showLegend(viz.form_data.show_legend);
+          chart.yAxis.tickFormat(d3.format('.3s'));
+        }
+
+        if ((viz_type === "line" || viz_type === "area") && viz.form_data.rich_tooltip) {
+          chart.useInteractiveGuideline(true);
+        }
+        if (viz.form_data.y_axis_zero) {
+          chart.forceY([0, 1]);
+        }
+        else if (viz.form_data.y_log_scale) {
+          chart.yScale(d3.scale.log());
+        }
+        if (viz.form_data.x_log_scale) {
+          chart.xScale(d3.scale.log());
+        }
+
+        chart.duration(0);
+
+        token.select('.chart').append("svg")
+          .datum(data.chart_data)
+          .transition().duration(500)
+          .call(chart);
+
+        return chart;
+      });
+      chart.show();
+      loading.hide();
+  }).fail(function(xhr) {
+      var err = '<div class="alert alert-danger">' + xhr.responseText  + '</div>';
+      loading.hide();
+      chart.show();
+      chart.html(err);
+    });
+  };
+  refresh();
+  jtoken.parent().find("a.refresh").click(refresh);
+}