var currentImage;
var mouseOverPanel = false;
var panelActiveButton;
var fadeSpeed= 500;
var showSpeed = 4000; //used by both 



var mouseOver = false;

var myOffset = 0;
var sliderTimer;
var panelSliderHeight ;

$(document).ready(function() {	
	  panelSliderHeight = 500;
	initHero();
	  initLineUp();
});

function initLineUp(){
	
	 setupBehaviors();
	  startSliderTimer();
	  	panelActiveButton = $("#sliderNavButtonTray").children().first();
	//console.log("start "+panelActiveButton.attr("id"));
	panelActiveButton.removeClass("imageButtonOff");
	panelActiveButton.addClass("imageButtonOn");
}
	 
	 

function startSliderTimer(){
	window.clearInterval(sliderTimer);
	sliderTimer = window.setInterval("sliderAutomator();", showSpeed * 3);
}
function stopSliderTimer(){
	window.clearInterval(sliderTimer);
}
function setupBehaviors(){
	
	$.each($("#sliderNavButtonTray").children(), function (i,item){
		
		$(item).mouseover(function(e){
			moveSlider($(this));
			stopSliderTimer();
			mouseOverPanel = true;
		});
		$(item).mouseout(function(e){
			startSliderTimer();
			mouseOverPanel = false;
		});
		
	});

	$("#panelSlideWrap").mouseover(function(e){
			stopSliderTimer();
			mouseOverPanel = true;
	});
	$("#panelSlideWrap").mouseout(function(e){
			startSliderTimer();
			mouseOverPanel = false;
	});

}


function moveSlider(nextButton){
		//panelActiveButton.css("opacity", ".2");

	$('#panelSlideWrap').children(0).stop(true,false);
	if(panelActiveButton.hasClass("imageButtonOn")){
		panelActiveButton.removeClass("imageButtonOn").addClass("imageButtonOff");
	}
	if(nextButton.hasClass("imageButtonOff")){
		nextButton.removeClass("imageButtonOff").addClass("imageButtonOn");
	}

	
	//nextButton.removeClass("imageButtonOff").addClass("imageButtonOn");
	//console.log(panelActiveButton.attr("id")   + ":::" + (nextButton.attr("id")));
    
	 panelActiveButton = nextButton;
	
	$('#panelSlideWrap').children().first().animate({
		top: nextButton.index() * -panelSliderHeight 
	  }, 2000, function() {
		// Animation complete.
	  })
	/* $('#panelSlideWrap').children().first().animate({
		top: nextButton.index() * -panelSliderHeight 
	  }, 2000, function() {
		// Animation complete.
	  });*/
	  	
}

function moveSliderBeginning(nextButton){
		//panelActiveButton.css("opacity", ".2");

	$('#panelSlideWrap').children(0).stop(true,false);
	if(panelActiveButton.hasClass("imageButtonOn")){
		panelActiveButton.removeClass("imageButtonOn").addClass("imageButtonOff");
	}
	if(nextButton.hasClass("imageButtonOff")){
		nextButton.removeClass("imageButtonOff").addClass("imageButtonOn");
	}

	
	//nextButton.removeClass("imageButtonOff").addClass("imageButtonOn");
	//console.log(panelActiveButton.attr("id")   + ":::" + (nextButton.attr("id")));
    
	 panelActiveButton = nextButton;

	 $('#panelSlideWrap').children().first().animate({
		top: nextButton.index() * -panelSliderHeight 
	  }, 6000, function() {
		// Animation complete.
	  });	
}


function sliderAutomator(){
	if(mouseOverPanel==false){
		
		if(panelActiveButton.next().length != 0){
			moveSlider(panelActiveButton.next());
		}else{
			moveSliderBeginning(panelActiveButton.parent().children().first());
		}
	}
}


function initHero(){
	var heroTimer = window.setInterval("doIt();", showSpeed);
	var tempHolder;
	currentImage = $("#imageWrapper").children()[0];
	
	$.each($("#imageWrapper").children(), function (i,item){
		$("#"+item.id).fadeTo(0, 0); // turn off all items
		$("#"+item.id).css("visibility","visible");
		$("#"+item.id).css("top","-500px");
		tempHolder = $("#buttonWrapper").append("<div class=\"imageButtonOff\"  >&bull;</div>");
	});

	$.each($("#buttonWrapper").children(), function (g,gitem){
		$(gitem).attr("id","button"+g);
		$(gitem).mouseover(function(){
			nextImage =	$("#imageWrapper").children()[$(this).index()];
			swapImage(nextImage);
		});
	});
	$($("#buttonWrapper").children()[0]).removeClass("imageButtonOff").addClass("imageButtonOn");
	$("#imageWrapper").children().first().fadeTo(0, 1);
	$("#imageWrapper").children().first().css("top","0px");

	$("#imageWrapper").mouseover(function(e){
		mouseOver = true;
		
	});
	$("#imageWrapper").mouseout(function(e){
		mouseOver = false;
	});
	$("#buttonWrapper").mouseover(function(e){
		mouseOver = true;
	});
	$("#buttonWrapper").mouseout(function(e){
		mouseOver = false;
	});
}


function swapImage(nextImage){

	if($(currentImage).attr("id") != $(nextImage).attr("id")){
		
		$($("#buttonWrapper").children()[$(currentImage).index()]).removeClass("imageButtonOn").addClass("imageButtonOff");
		$($("#buttonWrapper").children()[$(nextImage).index()]).removeClass("imageButtonOff").addClass("imageButtonOn");
		$(currentImage).stop(true,true);
		$(currentImage).fadeTo(fadeSpeed,0, function(e){
			$(this).css("top","-500px");
		});

		currentImage = nextImage;
		$(currentImage).stop(true,true);
		$(currentImage).css("top","0px");
		$(currentImage).fadeTo(fadeSpeed,1, function(e){
		});	
	}
}

function doIt(){
	if(mouseOver==false){
		if($(currentImage).next().length != 0){
			swapImage($(currentImage).next());
		}else{
			swapImage($(currentImage).parent().children().first());
		}
	}
}