(function() {
  function container_show(name) {
    $(name + '_container').setStyle({visibility: 'visible'});
  }

  function container_hide(name) {
    $(name + '_container').setStyle({visibility: 'hidden'});
  }
  
  function pretty_date(days) {
    var date = Interval.toDate(days);
    return (date.getUTCMonth() + 1) + '/' + date.getUTCDate() + '/' + date.getUTCFullYear();
  }

  function pretty_time(val) {
    val = parseFloat(val);
    var mins = val.floor();
    var secs = ((val % 1) * 60).floor();
    secs = (secs < 10 ? "0" + secs : secs);
    return mins + ":" + secs;
  }
  
  function setup_weekly() {
    new Ajax.Request('/graphs/weekly_stats', {
      method: 'get',
      onSuccess: function(res) {
        var data = eval(res.responseText);
        var hover_days;
        container_show('weekly_chart');
        var wgraph = new TimeGraph('weekly_chart', data, {
          fields:  ['scheduled', 'actual'],
          interval: Interval.weekly,
          units: 8,
          on_hover: function(point) {
            hover_days = point.x;
          },
          on_click: function(point) {
            container_hide('daily_chart');
            container_hide('pace_chart');
            if (hover_days) {
              setup_daily(hover_days);
            }
          }
        });
        wgraph.set(data[data.length - 1].day_start - (7 * 7));
        $('main').down('.arrow_left').observe('click', function(ev) {
          wgraph.advance(-4);
        });
        $('main').down('.arrow_right').observe('click', function(ev) {
          wgraph.advance(4);
        });
      }
    });
  }

  function setup_daily(week_start) {
    new Ajax.Request('/graphs/daily_stats?week_start=' + week_start, {
      method: 'get',
      onSuccess: function(res) {
        var data = eval(res.responseText);
        var hover_days;
        container_show('daily_chart');
        container_hide('pace_chart');
        var dgraph = new TimeGraph('daily_chart', data, {
          fields: ['scheduled', 'actual'],
          interval: Interval.daily,
          units: 6,
          on_hover: function(point) {
            hover_days = point.x;
          },
          on_click: function(point) {
            container_hide('pace_chart');
            if (hover_days) {
              setup_pace(hover_days);
            }
          }
        });
        dgraph.set(week_start);
      }
    });
  }

  function setup_pace(day_start) {
    new Ajax.Request('/graphs/pace_stats?day_start=' + day_start, {
      method: 'get',
      onSuccess: function(res) {
        var data = eval(res.responseText);
        if (data.length == 0) return;
        
        var run_html = ['<h3>' + pretty_date(data[0].datetime) + '</h3>'];
        data.each(function(run) {
          run_html.push(
            '<h5>' +
            'Distance: ' + run.distance.toFixed(2) + 'mi<br />' +
            'Time: ' + pretty_time(run.elapsed_time) +
            '</h5>');
          if (run.splits.length > 0) {
            run_html.push('<div id="pace_chart_' + run.run_id + '" class="chart group"></div>');
          }
        });
        
        container_show('pace_chart');
        $('runs_container').update(run_html.join(''));
        data.each(function(run) {
          if (run.splits.length > 0) {
            new PaceGraph('pace_chart_' + run.run_id, run.splits).show();
          }
        });
      }
    });
  }
  
  window.dashboard_start = setup_weekly;
})();