ChartControls = Behavior.create({
  initialize: function() {
    this.element.down(".previous").observe("click", this.updateCharts.bind(this, null, -1));
    this.element.down(".next").observe("click", this.updateCharts.bind(this, null, 1));
    
		this.element.down("select[name=period]").observe("change", function(event) {
      this.updateCharts(event.element().getValue(), 0);
	  }.bind(this));

    // this.toggleButtons(this.getPeriod(0));
  },

  updateCharts: function(period, change) {
    var newParams = this.computeParams(period, change);

    $$(".chart.controllable object").each(function(chart) {
      new Ajax.Request(this.constructUrl(chart, newParams), {
        method: 'get',
        onComplete: function(transport) {
          chart.load(transport.responseText);
          // this.toggleButtons(period);
        }.bind(this)
      });
    }.bind(this));

    window.location.hash = Object.toQueryString(newParams);
    return false;
  },


  computeParams: function(period, change) {
    var params = this.getParams();

    if (!period) {
      if (params.day) {
        period = "day";
      } else if (params.week) {
        period = "week";
      } else {
        period = "month";
      }
    }

    var now = new Date;

    switch (period) {
    case "month":
      delete params.week;
      delete params.day;

      params.month = params.month || (now.getMonth() + 1);
      params.month += change;
      params = this.sanitizeParams(params, "month", 12);
      break;
    case "week":
      delete params.month;
      delete params.day;

      params.week = params.week || this.getWeek(now);
      params.week += change;
      params = this.sanitizeParams(params, "week", 52);
      break;
    case "day":
      delete params.week;
      
      params.year = params.year || now.getFullYear();
      params.month = params.month || (now.getMonth() + 1);
      params.day = params.day || now.getDate();

      var temp = new Date(params.year, params.month - 1, params.day);
      temp = new Date(temp.getTime() + (change * 1000 * 60 * 60 * 24));

      params.year = temp.getFullYear();
      params.month = temp.getMonth() + 1;
      params.day = temp.getDate();
      break;
    };

    if (params.year == (new Date).getFullYear()) {
      delete params.year;
    };

    return params;
  },

  getParams: function() {
    var params = window.location.hash.substring(1).toQueryParams();
    for (var key in params) {
      params[key] = parseInt(params[key]);
    }

    return params;
  },

  getWeek: function(date) {
    var beginningOfYear = new Date(date.getFullYear(), 0, 1);
    var delta = date - beginningOfYear;

    return Math.round(delta / (1000 * 60 * 60 * 24 * 7)) + 1;
  },

  sanitizeParams: function(params, component, max) {
    params.year = params.year || (new Date).getFullYear();

    if (params[component] > max) {
      params[component] = 1;
      params.year += 1;
    } else if (params[component] < 1) {
      params[component] = max;
      params.year -= 1;
    }

    return params;
  },

  constructUrl: function(chart, params) {
    var url = chart.getElementsByTagName("param")[1].value;
    url = url.replace(/^data\-file=/, '');
    url = decodeURIComponent(url);
    url = url.split('?');

    var path = url[0];
    var urlParams = url[1] ? url[1].toQueryParams() : {};

    urlParams = Object.extend(urlParams, params);
    return path + '?' + Object.toQueryString(urlParams);
  }
// 
//   toggleButtons: function(period) {
//     var nextButton = this.element.down(".next");
// 
//     if (period.time >= new Date) {
//       nextButton.hide();
//     } else {
//       nextButton.show();
//     }
//   },
});