Frontend_History = function(items) {
  var self = this;
  self.step = 0;

  self.scroll = function(e, delta) {
    switch (delta) {
      case 1:
        self.runLeft();
        break;
      case -1:
        self.runRight();
        break;
    }
    return false;
  }

  self.runLeft = function() {
    if ($('#history_scroll:animated').length) {
      return false;
    }
    var left = $('#history_scroll').position().left;
    var td_width = self.getTdWidth();
    var new_left = left - td_width;
    if ( -left > $('#history_scroll').width() - $('#history_container').width()) {
      return false;
    }
    self.step++;
    var td_year = $('.history_mon_year:eq('+self.step+')');
    var year = $(td_year).attr('year');
    $('#history_year').html(year);
    $('#history_scroll').animate({
      'left': new_left + 'px'
    }, 'fast', 'linear', self.toggleRunArrows);
  }

  self.runRight = function() {
    if ($('#history_scroll:animated').length) {
      return false;
    }
    var left = $('#history_scroll').position().left;
    var td_width = self.getTdWidth();
    var new_left = left + td_width;
    if (new_left >= 0) {
      $('#history_right').hide();
      new_left = 0;
    }
    self.step--;
    var td_year = $('.history_mon_year:eq('+self.step+')');
    var year = $(td_year).attr('year');
    $('#history_year').html(year);
    $('#history_scroll').animate({
      'left': new_left + 'px'
    }, 'fast', 'linear', self.toggleRunArrows);
  }

  self.getTdWidth = function() {
    var td = $('#history_scroll').find('td');
    var td_fake_width = $(td).outerWidth(true);
    return td_fake_width;
  }

  self.toggleRunArrows = function() {
    $('#history_left').show();
    $('#history_right').show();
    var left = $('#history_scroll').position().left;
    if (left >= 0) {
      $('#history_right').hide();
    }
    if ( -left > $('#history_scroll').width() - $('#history_container').width()) {
      $('#history_left').hide();
    }
  }

  self.__init__ = function() {
    $('#history_left').click(self.runLeft);
    $('#history_right').click(self.runRight);
    $('#history_left').mousehold(self.runLeft);
    $('#history_right').mousehold(self.runRight);
    $('#history_scroll').mousewheel(self.scroll);
    
    $('#history_scroll').css('left', -$('#history_scroll').width() + $('#history_container').width() -1);
//    alert('left: -'+ self.getTdWidth()*items + 'px')
    self.toggleRunArrows();
  }

  self.__init__();
}