(function($){
	$.fn.scrollable = function(options) {
    var defaults  = {
          speed: 2000,
          slideshow: 0,
          cilcular: false
        },
        $hidden = $('.hidden');
    options = $.extend(defaults, options);

    return this.each(function(){
      $hidden.show();
      
      var $this       = $(this),
          $prev       = $('<a>'),
          $next       = $('<a>'),
          $container  = $this.find('div.scrollable'),
          $wrapper    = $container.find('ul'),
          $items      = $wrapper.find('li'),
          busy        = false,
          len         = $items.length,
          width       = $items.eq(0).outerWidth(),
          offset      = len * width,
          visible     = $container.width(),
          perpage     = Math.ceil(visible / width),
          pos         = 0,
          direction   = 1,
          timer       = false;

      $prev.attr('href', '#previous').addClass('scrollable-previous');
      $next.attr('href', '#next').addClass('scrollable-next');
      $wrapper.css({ width:offset });    
             
      function navigation() {      
        if ($container.scrollLeft() <= 0) {
          if (options.cilcular) {
            scroll_to(Math.ceil(len / perpage));
            return;
          } else {
            $prev.hide();
            direction = 1;
          }
        } else {
          $prev.show();  
        }
        
        if ($container.scrollLeft() >= offset - visible) {
          if (options.cilcular) {
            scroll_to(1);
            return;
          } else {
            $next.hide();
            direction = -1;
          }
        } else {
          $next.show(); 
        }
      }
      
      function scroll_to(val) {
        pos = val;
        $container.scrollLeft(pos * visible);
      }

      function animate(d, stop) {
        busy = true;
        pos = pos + d;

        $container.animate({ scrollLeft: pos * visible }, options.speed, function() {
          busy = false;
          navigation();
          if (!stop) slideshow();
        });
      }
      
      function cilcular() {
          var shortage = len % perpage;
        
          shortage = shortage && perpage - shortage;     
          offset = offset + ((perpage * 2) + shortage) * width;

          if (shortage) $wrapper.append($items.slice(0, shortage).clone());
        
          $wrapper
            .css({ width:offset })
            .prepend($wrapper.find('li').slice(len + shortage - perpage).clone())
            .append($items.slice(0, perpage).clone());
                 
          scroll_to(1);
      }
      
      function slideshow() {       
        if (options.slideshow && offset > visible) {
          if (options.slideshow < 100) {
            timer = setInterval(function(){
              $container.scrollLeft($container.scrollLeft() + 1);
              navigation();
            }, options.slideshow);
          } else {
            timer = setTimeout(function(){
              !busy && animate(direction);
            }, options.slideshow);
          }
        }
      }

      $next
        .prependTo($this)
        .bind('click', function(event) {
          options.slideshow < 100 ? clearInterval(timer) : clearTimeout(timer);
          !busy && animate(1, 'stop');
          event.preventDefault();
        });
      
      $prev
        .prependTo($this)
        .bind('click', function(event) {
          options.slideshow < 100 ? clearInterval(timer) : clearTimeout(timer);
          !busy && animate(-1, 'stop');
          event.preventDefault();
        });
      
      if (options.cilcular && offset > visible) cilcular();
      
      slideshow();
      
      navigation();
      
      $hidden.hide();
    });
  };
})(jQuery);

$(function(){
  $('table.data2 a.show, table.data2 a.hide').click(function(event){
    var url       = this.href.split('#'),
        hash      = url[1],
        $this     = $(this),
        $parent   = $this.parent(),
        $other    = $parent.find('a').not(this),
        $content  = $('#' + hash),
        $container= $('#compensations');
    
    if ($this.hasClass('show')) {
      $container.find('div.hidden[id]:visible').slideUp('fast', function(){
        $('a[href=#' + this.id + ']').hide().filter('a.show').show();
      });
      $other.show().css({ width:$this.width(), height:$parent.height() - 3 });
      $this.hide();  
      $content.slideDown();
    } else {
      $content.slideUp('fast', function(){
        $other.show();
        $this.hide();
      });
    }
        
    event.preventDefault();
  });

  $('div.compensations div.gallery-preview').scrollable();
});
