var containerWidth = 0;
var diff = 0;
var totalItemSize = 0;
var singleItemWidth = 0;
var totalItems = 0;
var totalPanels = 0;
var batchSize = 0;
var panaleSize = 0;
var totalPanelSize = 0;
var speed = 800;
var theDiv;

(function($){


	$(function(){
	
	    theDiv = $('#bottom_box ul');
        theDiv.css('left', '0');


		$('#bottom_box_wrap').parents().filter('table.s4-wpTopTable').wrap('<div id="pwc-scroller-wrapper" />');


		//$('#footer').hide();
		
		containerWidth = $('#bottom_box').outerWidth();
		singleItemWidth = $('#bottom_box_row').find('ul:first li:first').outerWidth(true);

		$('#bottom_box_row').find('ul:first').children('li').each(function(){
			totalItemSize += $(this).outerWidth(true);
			totalItems++;
		});
		batchSize = Math.floor(containerWidth / singleItemWidth);
		diff = containerWidth - (batchSize * singleItemWidth);
		diff += 4;

		totalPanels = Math.ceil(totalItems / batchSize );
		panelSize = batchSize * singleItemWidth;
		totalPanelSize = panelSize * totalPanels;
		
		
		 $('#bottom_box_row').find('ul:first li').each(function(i){
				if(batchSize > 2)
				{
				 	if((i + 1) % batchSize == 0 && i != 0)
				 	{
				 		$(this).attr('style', "margin-right: " + diff + "px !important");
				 	}
			 	}
			 	else
			 	{
			 		if(i != 0 && i % 2 == 1)
			 		{
				 		$(this).attr('style', "margin-right: " + diff + "px !important");
				 	}
			 	}
		 });
		
		var parentUL = $('#pwc-stroller-wrapper').parents('ul:first');
		var LI = $('<li></li>');
		LI.append($('#pwc-stroller-wrapper'));
		parentUL.append(LI);
		
		
		isSetup = true;
  
  		
        var lImg = $('<img />');
       	lImg.attr('src', '/SiteAssets/images/box_goleft.png');
		$("#left_button").css('background-image', '');
       	$("#left_button").append(lImg);
        $("#left_button").click(function(){
        	
        	if(isSetup)
        	{
        		if(!theDiv.is(":animated"))
				{
		            if(parseInt(theDiv.css('left')) < 0){
			        	theDiv.animate({ left: "+=" + (containerWidth)}, speed);  	   	
		   			}
	   			}
   			}
   			
        });
        
       	$("#right_button").css('background-image', '');
       	var rImg = $('<img />');
       	rImg.attr('src', '/SiteAssets/images/box_goright.png');
       	$("#right_button").append(rImg);
		$("#right_button").click(function(){
       		if(isSetup)
			{
				if(!theDiv.is(":animated"))
				{
		        	var length = totalPanelSize - panelSize;
		        	length = -length;
		        	if(parseInt(theDiv.css('left')) > length)
		        	{
						theDiv.animate({ left: "+=-" + (containerWidth) }, speed);			
					}
				}
			}
        });

    });


})(jQuery);