var ExercisesForm = Class.create({
  initialize: function() {
    this.commandButtons = $w('previousDateButton nextDateButton calendarButton');
    this.weekDays = ['pühapäev',  'esmaspäev', 'teisipäev', 'kolmapäev', 'neljapäev', 'reede', 'laupäev'];
    this.selectedDate = new Date();

    this.updateSelectedDate();

    $('nextDateButton').observe('click', this.incrementDate.bind(this));
    $('previousDateButton').observe('click', this.decrementDate.bind(this));

    this.clearPreviousItems();
    this.showIndicator();
    this.findExercises();
  },
  incrementDate: function(event) {
    event.stop();
    this.changeDate(1);
  },
  decrementDate: function(event) {
    event.stop();
    this.changeDate(-1);
  },
  changeDate: function(direction) {
    this.selectedDate.setDate(this.selectedDate.getDate() + direction);
    this.updateSelectedDate();
    this.showIndicator();
    this.disableButtons();
    this.clearPreviousItems();
    this.findExercises();
  },
  getFormattedDate: function() {
    var day = this.selectedDate.getDate();
    var month = this.selectedDate.getMonth() + 1;
    var year = this.selectedDate.getFullYear();

    return (day < 10 ? "0" + day : day) + "." + (month < 10 ? "0" + month : month) + "." + year;
  },
  updateSelectedDate: function() {
    $('selected-day').update(" " + this.getFormattedDate() + " ");
    $('selected-weekday').update(this.weekDays[this.selectedDate.getDay()]);
  },
  findExercises: function() {
    var opts = {command: 'findExercises', date: this.selectedDate.getTime()};
    new Ajax.Request('/', {parameters: opts, onSuccess: this.fetchExercises.bind(this)});
  },
  fetchExercises: function(transport, response) {
    $('log').insert(transport.responseText);

    this.hideIndicator();

    if (response && response.success) {
      if (response.exercises.pool) {
        response.exercises.pool.each(this.addPoolItem.bind(this));
      }
      if (response.exercises.gym) {
        response.exercises.gym.each(this.addGymItem.bind(this));
      }
      if (response.exercises.spa) {
        response.exercises.spa.each(this.addSpaItem.bind(this));
      }
      if (response.exercises.cafe) {
        response.exercises.cafe.each(this.addCafeItem.bind(this));
      }
    }
  },
  addPoolItem: function(item) {
    $('blue').insert(this.createRow(item));
  },
  addGymItem: function(item) {
    $('red').insert(this.createRow(item));
  },
  addSpaItem: function(item) {
    $('orange').insert(this.createRow(item));
  },
  addCafeItem: function(item) {
    $('green').insert(this.createRow(item));
  },
  createRow: function(item) {
    var button = new Element('a', {href: 'http://www.keilasport.ee/reservations', target: 'blank'});
    //button.observe('click', this.makeReservation.bind(this));

    var time = new Element('em');
    time.update(item.time);

    var title = new Element('span');
    title.update(item.title);

    var row = new Element('div');
    row.insert(button);
    row.insert(time);
    row.insert(title);
    row.addClassName('item');

    return row;
  },
  clearPreviousItems: function() {
    $w('blue red orange green').each(function(containerId) {
      $(containerId).update();
    });
  },
  makeReservation: function(event) {
    event.stop();
    // TODO: open reservation application window
  },
  disableButtons: function() {
    this.commandButtons.each(function(buttonId) {
      //$(buttonId).disable();
    });
  },
  enableButtons: function() {
    this.commandButtons.each(function(buttonId) {
      //$(buttonId).enable();
    });
  },
  showIndicator: function() {
    $('exercisesIndocatorRow').show();
  },
  hideIndicator: function() {
    $('exercisesIndocatorRow').hide();
  }
});

Event.observe(window, 'load', function() {
  if ($('calendar')) {
    new ExercisesForm();
  }
});