var itemsContainerClass;
var leftButtonClass;
var rightButtonClass;
var itemsWidth=[];
var currentItem=0;
var animationOn=false;
var sliderInterval;



function calcWidths()
{
    if(itemsContainerClass == null)
        return; 
    var items = $('.'+itemsContainerClass).children();
    
    if(items.length==0 )
    return;
    
    items.each(function(index){
    
        itemsWidth[index] = $(this).width();
    
    });
}

function setContainerWidth()
{
    if (itemsWidth.length==0)
    return;
    var width=0;
    for (var l in itemsWidth)
        width+=itemsWidth[l];
        
    $('.'+itemsContainerClass).width(width).css({'position':'absolute', 'top': '0px', 'left':'0px','border':'0px','margin':'0px','padding':'0px'});;


    
    
    
}

function setSliderButtons(left, right)
{
    leftButtonClass=left;
    rightButtonClass=right;
    
    $('.' + leftButtonClass).click(function(){ slideRight();});
    $('.' + rightButtonClass).click(function(){ slideLeft();});
    
}

function slideLeft()
{
  if (itemsWidth.length==0)
    return;
    
    var slideSize='-=' + itemsWidth[currentItem];
    
   slide(slideSize, endSlideLeft);
   
  
   

   
    
}

function endSlideLeft()
{
   var fWidth = itemsWidth[0];
   var lWidth = itemsWidth[itemsWidth.length-1];
   var currLeft=  $('.'+itemsContainerClass).position().left;
   var currTop=  $('.'+itemsContainerClass).position().top;
   var newLeft = currLeft+fWidth;
   
   
   
    var firsItem  = $('.'+itemsContainerClass + " :first");
    var lastItem  = $('.'+itemsContainerClass + " >:last");
    firsItem.insertAfter(lastItem);
    $('.'+itemsContainerClass).css('left', newLeft +'px');
    
    itemsWidth.shift();
    itemsWidth.push(fWidth);
}

function slideRight()
{
  if (itemsWidth.length==0)
    return;
    
    var slideSize='+=' + itemsWidth[currentItem];
    
   slide(slideSize, endSlideRight);
    
}

function endSlideRight()
{
    var fWidth = itemsWidth[0];
   var lWidth = itemsWidth[itemsWidth.length-1];
   var currLeft=  $('.'+itemsContainerClass).position().left;
   
   var newLeft = currLeft-lWidth;
    var firsItem  = $('.'+itemsContainerClass + " :first");
    var lastItem  = $('.'+itemsContainerClass + " >:last");
    lastItem.insertBefore(firsItem);
     $('.'+itemsContainerClass).css('left', newLeft +'px');
     
      itemsWidth.pop();
    itemsWidth.unshift(lWidth);
     
   
}


function slide(slideSize, callback)
{
    if(animationOn)
        return;
 
 animationOn=true;
 
  $('.'+itemsContainerClass).animate({left:slideSize},200, function(){ animationOn=false; callback(); });
}

function initInterval(){
    sliderInterval= setInterval(slideLeft,3000);

}

function stopInterval(){

   clearInterval(sliderInterval);
}


$(function(){
    itemsContainerClass='listSliderUL';
    setTimeout(function(){
    calcWidths();
     setContainerWidth();
     setSliderButtons('listSliderLeft','listSliderRight');
     },1000);
     
    initInterval();
    $('.listSliderUL > LI').add('.listSliderLeft').add('.listSliderRight').mouseenter(stopInterval).mouseleave(initInterval);
    

});