//---------- VARS ----------//

var imageArray = ["image0", "image1", "image2", "image3"];
var imageNavArray = ["imageNav0","imageNav1","imageNav2","imageNav3"];
var curImage = 0;
var intervalID;


//---------- FUNCTIONS ----------//

//init
function init(){
	for($i = 0; $i < imageArray.length; $i++){
		$("#"+imageArray[$i]).stop(true, true).fadeOut(0,null);
		$("#"+imageNavArray[$i]).addClass("rotatorNavOff");
	}
	$("#"+imageArray[curImage]).fadeIn(1000,null);
	$("#"+imageNavArray[curImage]).removeClass('rotatorNavOff').addClass('rotatorNavOn');
	resetTimer();
}

//carousel
function changeImage(_curImage){
	if(_curImage != curImage){
		$("#"+imageArray[_curImage]).stop(true, true).fadeIn(1000,null);
		$("#"+imageArray[curImage]).stop(true, true).fadeOut(1000,null);
		$("#"+imageNavArray[curImage]).removeClass('rotatorNavOn').addClass('rotatorNavOff');
		$("#"+imageNavArray[_curImage]).removeClass('rotatorNavOff').addClass('rotatorNavOn');
		curImage = _curImage;
	}
	return false;
}

//timer
function handleTimerInterval(){
	var nextImage;
	if(curImage < imageArray.length - 1){
		nextImage = curImage + 1;
	} else {
		nextImage = 0;
	}
	changeImage(nextImage);
}
function resetTimer(){
	window.clearInterval(intervalID);
	intervalID = setInterval(function() { handleTimerInterval(); }, 8000); 
}
//carousel nav
function handleNavClick(_btnNum){
	changeImage(_btnNum);
	window.clearInterval(intervalID);
}