(function($){
  
  var ChannelAnimator = function()
  {
    var scroll_speed;
    var bar_div;
    var $super = this;

    this.init = function()
    {
     this.bar_div = $("#bar-div ul");
     this.scroll_speed = 600;
     this.slideLeftPrepare();
    }

    this.slideRightPrepare = function()
    {
      this.bar_div.find("li").slice(0,3).each(function(i){
        var left = parseInt($(this).css('left')) + 12*240;
		//alert($(this).css('left')+'   '+(12*240)+' '+left);
        $(this).css('left', left + "px").appendTo($super.bar_div);
      });
    }

    this.slideLeftPrepare = function ()
    {
      this.bar_div.find("li").slice(9).each(function(i){
        var left = parseInt($(this).css('left')) - 12*240;
        $(this).css('left', left + "px").prependTo($super.bar_div);
      });
    }

    this.slide = function(sign)
    {
      this.bar_div.find("li").animate({"left": sign+"=720"}, this.scroll_speed, "swing", function(){
           $('.sliderButton').removeAttr('name');
      });
    }    
  }

  $(document).ready(function(){
    var animator = new ChannelAnimator;
    animator.init();
       
     $('.sliderButton').click (function() {
      if ($(this).attr('name')!='clicked')
        {
         $(this).attr('name','clicked');
         
         if (this.id == 'slideRight')
         {
           animator.slideRightPrepare();
           animator.slide("-");
         }
         else
         {
           animator.slideLeftPrepare();
           animator.slide("+");
         }
        }
       });
  });

 })(jQuery);