(function($){
  scroller=function(){
    $('#scroller').append('<span id="shadowLeft"><!-- cosmetic --></span>').append('<span id="shadowRight"><!-- cosmetic --></span>');
    var totalPanels=$('.scrollPane').children().size();
    var regWidth=$('.scroll-panel').css('width');
    var regImgWidth=$('.scroll-panel img').css('width');
    var regParSize=$('.scroll-panel p').css('font-size');
    var movingDistance=329;
    var curWidth=360;
    var curImgWidth=360;
    var padding=40;
    var curParSize='12px';
    var someMagicNumber = 1080;
    var $panels=$('#scroller .scrollPane > div');
    var $wrapper=$('#scroller .scrollPane');
    $panels.css({
      'float':'left',
      'position':'relative'
    });
    $('#scroller').data('currentlyMoving',false);
    var left=(totalPanels%2)?padding-((Math.ceil(totalPanels/2)-1)*movingDistance):padding-(Math.ceil(totalPanels/2)*movingDistance);
    
    $wrapper.css('width',($panels[0].offsetWidth*$panels.length)+someMagicNumber).css('left',left+'px');
    
    var scroll=$('#scroller .scroll').css('overflow','hidden');
    $('span#totalItems').html(totalPanels);
    if(totalPanels>1){
      $('#panels').before('<a id="scrollLeft" title="Scroll Left">Scroll Left</a>');
      
      $('#panels').before('<a id="scrollRight" title="Scroll Right">Scroll Right</a>')
      }
    
    for(i=0;i<totalPanels;i++){
      $('#scroller .scrollPane > div:eq('+i+')').attr('id','panel_'+(i+1))
      }
    
    function returnToNormal(element){
      $(element).animate({
        width:regWidth
      }).find('img').animate({
        width:regImgWidth
      }).end().find('p').animate({
        fontSize:regParSize
      })
      };
    function growBigger(element){
      $(element).animate({
        width:curWidth
      }).find('img').animate({
        width:curImgWidth
      }).end().find('p').animate({
        fontSize:curParSize
      })
      }
      function change(direction){
      if(($('#scroller').data('currentlyMoving')==false)){
        $('#scroller').data('currentlyMoving',true);
        if(direction&&curPanel==totalPanels){
          var next=1;
          var leftValue=padding+movingDistance
          }else if(!direction&&curPanel==1){
          var next=totalPanels;
          var leftValue=padding-(totalPanels*movingDistance)
          }else{
          var next=direction?curPanel+1:curPanel-1;
          var leftValue=$('.scrollPane').css('left')
          }
          var movement=direction?parseFloat(leftValue,10)-movingDistance:parseFloat(leftValue,10)+movingDistance;
        $('.scrollPane').stop().animate({
          'left':movement
        },function(){
          $('#scroller').data('currentlyMoving',false)
          });
        returnToNormal('#panel_'+curPanel);
        growBigger('#panel_'+next);
        curPanel=next;
        $('span#currentItem').html(curPanel);
        $('#panel_'+(curPanel+1)).unbind();
        $('#panel_'+(curPanel+1)).click(function(){
          change(true)
          });
        $('#panel_'+(curPanel-1)).unbind();
        $('#panel_'+(curPanel-1)).click(function(){
          change(false)
          });
        $('#panel_'+curPanel).unbind()
        }
      }
    var curPanel=(totalPanels%2)?Math.ceil(totalPanels/2):Math.ceil(totalPanels/2)+1;
  growBigger('#panel_'+curPanel);
  $('span#currentItem').html(curPanel);
  $('#panel_'+(curPanel+1)).click(function(){
    change(true)
    });
  $('#panel_'+(curPanel-1)).click(function(){
    change(false)
    });
  $('a#scrollRight').click(function(){
    change(true)
    });
  $('a#scrollLeft').click(function(){
    change(false)
    })
  }
})(jQuery);