$(window).load(function(){

   var $active = 1;

   var $imgWidth = $('#slider_images img').first().outerWidth();
   var $imgCount = $('#slider_images img').length;
   $('#slider_images').width($imgWidth*($imgCount+2));
   $('#slider_images img').first().addClass('endless_slider_first');
   $('#slider_images img').last().addClass('endless_slider_last');
   $('.endless_slider_first').clone().appendTo('#slider_images');
   $('.endless_slider_last').clone().prependTo('#slider_images');
   $('#slider_images').css({'left':-1*$imgWidth+'px'});
   $('#btn-next').click(function(){
        nextImage();
   });
   $('#btn-prev').click(function(){
          prevImage();
   });

   function nextImage(){
      $('#slider_images').stop('true','true');
      var $newLeft = $('#slider_images').position().left-(1*$imgWidth);
      $('#slider_images').animate({'left':$newLeft+'px'},function(){
         $active++;
         countImages();
         if (Math.abs($newLeft) == (($imgCount+1)*$imgWidth))
            {
            $('#slider_images').css({'left':-1*$imgWidth+'px'});
            $active = 1;
            countImages();
            }
         });
      return false;
   };
   function countImages(){
       if($active < 10){
           $displayActive = '0' + $active;
       }
	   if($imgCount < 10){
            $displayAll = '0' + $imgCount;
       }
	   if($imgCount > 10){
            $displayAll = $imgCount;
       }
	   if($active > 10){
           $displayActive = $active;
       }
      
       $('#output').text($displayActive + ' / ' + $displayAll);
       
   };
   countImages();

   function prevImage(){
    $('#slider_images').stop('true','true');
    var $newLeft = $('#slider_images').position().left+(1*$imgWidth);
    $('#slider_images').animate({'left':$newLeft+'px'},function(){
         $active--;
         countImages();
         if (Math.abs($newLeft) == (0))
            {
            $('#slider_images').css({'left':-($imgCount)*$imgWidth+'px'});
            $active = $imgCount;
            countImages();
            }
	});
   return false;
   };
   $(document).keyup(function (event) {
        if (event.keyCode == 37) {
            prevImage()
            return false;
      } else if (event.keyCode == 39) {
            nextImage()
            return false;
      }
    });
})
