<% content_for :javascripts do %>
    <%= javascript_include_tag 'analytics/options.line.js' %>
<% end %>

<% content_for :sublayout_title, 'Days of week' %>

<p>Average usage by days of week in past month.</p>

<% @data.each do |metric, data| %>
    <h3><%= h metric.friendly_name.capitalize %></h3>

    <div class='charts' id="chart-<%= metric.id %>"></div>
<% end %>

<script type="text/javascript" charset="utf-8">
  function sum(el) {
    return _.reduce(el, function(memo, num){ return memo + num; }, 0)
  }

  var rawData = <%= @data.to_json.html_safe %>,
      series = [];

  var options =  lineChartOptions;

  $(document).ready(function() {

    <% @data.each do |metric, data| %>
    var values = <%= data.to_json.html_safe %>;
    metric = {};
    metric.name = '<%= metric.friendly_name.capitalize %>';
    metric.id = '<%= metric.id %>';
    metric.unit = '<%= metric.unit.pluralize %>';
    metric.labels = (function(){
      var labels = [];
      for(day in values){
        labels.push(day);
      };
      return labels;
    })();

    metric.data = (function(){
      var d = [];
      for(day in values){
        d.push(values[day]);
      };
      return d;
    })();

    var options = lineChartOptions;
    var s = {};
    s.data = metric.data;
    s.name = metric.unit;
    options.yAxis.labels.enabled = (sum(metric.data) == 0 ? false : true)

    options.series = [s];
    options.xAxis.categories = metric.labels;
    options.yAxis.min = 0;
    options.chart.renderTo = "chart-" + metric.id;

    new Highcharts.Chart(options);
    <% end %>

  });

</script>
