var currentSecondPanelIndex = 1;
var secondPanelMovingDistance = 275;
var currentSecondPanelX=0;
var numberOfSecondFeaturePanel = 0;

var currentPanelIndex = 1;
var panelMovingDistance = 576;
var currentPanelX=0;
var numberOfFeaturePanel = 0;

function initScrollers(){
	
	
	dataArray = [];
	
	dataArray["#top"] = [];
	dataArray["#bot"] = [];
	
	$("#top .leftButton").bind("click",{type:"top"}, leftClickHandler);
	$("#top .rightButton").bind("click",{type:"top"}, rightClickHandler);
	
	$("#bot .leftButton").bind("click",{type:"bot"}, leftClickHandler);
	$("#bot .rightButton").bind("click",{type:"bot"}, rightClickHandler);
	
	dataArray["#top"]["numItems"] = $("#top .items").children().length;
	dataArray["#bot"]["numItems"] = $("#bot .items").children().length;
	
	dataArray["#top"]["currentItem"] = 0;
	dataArray["#bot"]["currentItem"] = 0;
	
	dataArray["#top"]["itemWidth"] = $("#top .items div").width();
	dataArray["#bot"]["itemWidth"] = $("#bot .items div").width();
	
	left = $("#top .items").css("left");
	dataArray["#top"]["startPos"] = parseFloat((left.substring(0, left.indexOf('px'))));
	
	left = $("#bot .items").css("left");
	dataArray["#bot"]["startPos"] = parseFloat((left.substring(0, left.indexOf('px'))));
	
	$("#panelPrev").click(movingSecondFeaturePanel);
	$("#panelNext").click(movingSecondFeaturePanel);
	$("#featurePanelPrev").click(movingFeaturePanel);
	$("#featurePanelNext").click(movingFeaturePanel);
	numberOfSecondFeaturePanel = $("#itemsContainer>div").length-1;
	numberOfFeaturePanel = $("#homePanelsContainer>div").length;
	setUpProductPopup();
}

function setUpProductPopup(){
	$("#homePanelsContainer div div[class='product']").find("a").click(function(){
							  showProduct($(this).attr("pName"));
							  return false;
							   });
										
		
	}
	
var autoMoveInterVal = setInterval(autoMovingFeaturePanel,10000);
var autoDirection=1;
function autoMovingFeaturePanel(){	
	if(currentPanelIndex>0 && currentPanelIndex<numberOfFeaturePanel && autoDirection==1){
		$("#homePanelsContainer").animate({left:currentPanelX-panelMovingDistance},"normal");
		currentPanelX -= panelMovingDistance;
		currentPanelIndex++;
	}	
	else{
		 autoDirection=0;
		 $("#homePanelsContainer").animate({left:currentPanelX+panelMovingDistance},"normal");
		 currentPanelIndex--;
		 currentPanelX += panelMovingDistance;
		 if(currentPanelIndex==1)autoDirection=1;
	}
	
}
function resetInterval(){
	autoMoveInterVal = setInterval(autoMovingFeaturePanel,10000);
	}
function movingFeaturePanel(){	
	clearInterval(autoMoveInterVal);
	switch($(this).attr("id")){
						case "featurePanelNext":
							if(currentPanelIndex>0 && currentPanelIndex<numberOfFeaturePanel){
								$("#homePanelsContainer").animate({left:currentPanelX-panelMovingDistance},"normal","linear",resetInterval);
								currentPanelX -= panelMovingDistance;
								currentPanelIndex++;
							}		
								
							return false;							
						break;
						case "featurePanelPrev":
							if(currentPanelIndex>1){
								$("#homePanelsContainer").animate({left:currentPanelX+panelMovingDistance},"normal","linear",resetInterval);
								currentPanelX += panelMovingDistance;
								currentPanelIndex--;
							}	
							return false;
						break;
						
						}
	
	
	}
function movingSecondFeaturePanel(){	
	switch($(this).attr("id")){
						case "panelNext":
							if(currentSecondPanelIndex>0 && currentSecondPanelIndex<numberOfSecondFeaturePanel){
								$("#itemsContainer").animate({left:currentSecondPanelX-secondPanelMovingDistance},300);
								currentSecondPanelX -= secondPanelMovingDistance;
								currentSecondPanelIndex++;
							}	
							return false;							
						break;
						case "panelPrev":
							if(currentSecondPanelIndex>1){
								$("#itemsContainer").animate({left:currentSecondPanelX+secondPanelMovingDistance},300);
								currentSecondPanelX += secondPanelMovingDistance;
								currentSecondPanelIndex--;
							}	
							return false;
						break;
						
						}
	
	}
function leftClickHandler(e){
	
	i = "#"+e.data.type;
	d = dataArray[i];
	
	if(d["currentItem"] <= 0) return;
	
	d["currentItem"] --;
	animateItems(i, 0);
	
}

function rightClickHandler(e){
	
	i = "#"+e.data.type;
	d = dataArray[i];
	
	if(d["currentItem"] >= (d["numItems"]-4)) return;
	
	d["currentItem"] ++;
	animateItems(i, -1);
	
}

function animateItems(item, way){
	
	d = dataArray[item];
	items = $(item+" .items");
	
	i=0;
	$(item+" .items div").each(
		function(){
			if(i < d["currentItem"]  || i > (d["currentItem"]+3)){
				$(this).fadeOut("1000");
			}else{
				$(this).fadeIn("1000");
			}
			if (i == d["currentItem"]) {
				left = ($(this).css("left"));
				left = parseFloat((left.substring(0, left.indexOf('px'))));
			}
			i++;
		}
	);
	
	items.animate({left: (d["startPos"]-left) + "px"}, "normal");
	
}