var photosNum;
var nowPhotoNum = 0;
var nextPhotoNum = 1;
var navOffColor = "#999";
var navOnColor = "#93c";


var slideTimer = setInterval("slideInOut()", 5000);
function slideInOut() {
	$("#photoList li:eq(" + nowPhotoNum + ")").animate({opacity: "0"}, 1000, function() {
		$(".photosNav li:eq(" + nowPhotoNum + ")").css({backgroundColor: navOffColor});
		$(".photosNav li:eq(" + nextPhotoNum + ")").css({backgroundColor: navOnColor});
		nowPhotoNum = nextPhotoNum;
		nextPhotoNum ++;
		if(nextPhotoNum >= photosNum) { nextPhotoNum = 0; }
	});
	$("#photoList li:eq(" + nextPhotoNum + ")").delay(400).animate({opacity: "1"}, 2400);
}

function onceSlide() {
	setTimeout("slideInOut()", 1);
	slideTimer = setInterval("slideInOut()", 5000);
}

$(function() {
	//home main visual
	$("#topVisual img:eq(1)").delay(2500).animate({opacity: "0"}, 2500, function() {
		$(this).remove();
	});
	
	//photos number
	photosNum = $("#slidePhotos li").length;

	//photos navigation background
	var photosNavAreaX = 889;
	var photosNavAreaY = 458;
	var photosNavAreaWidth = photosNum * 30 + 6;
	var photosNavAreaHeight = 14;
	photosNavAreaX = photosNavAreaX - photosNavAreaWidth;
	$("#slidePhotos").append($("<div>").addClass("photosNavArea").css({
		width: photosNavAreaWidth + "px",
		height: photosNavAreaHeight + "px",
		backgroundColor: "#fff",
		position: "absolute",
		left: photosNavAreaX + "px",
		top: photosNavAreaY + "px",
		overflow: "hidden",
		opacity: "0.75",
		zIndex: "100"
	}));
	
	//photos navigation
	$("#slidePhotos").append($("<ul>").addClass("photosNav"));
	for(i=0; i<photosNum; i++) {
		$(".photosNav").append($("<li>").css({
			width: "24px",
			height: "6px",
			backgroundColor: navOffColor,
			position: "absolute",
			left: (photosNavAreaX + i * 30 + 6) + "px",
			top: (photosNavAreaY + 4) + "px",
			overflow: "hidden",
			zIndex: "101",
			cursor: "pointer"
		}));
	}
	$(".photosNav li").each(function() {
		$(this).click(function() {
			$("#photoList li").each(function() {
				$(this).stop(true, true);
			});
			clearInterval(slideTimer);
			nextPhotoNum = $(this).index();
			$(".photosNav li:eq(" + nowPhotoNum + ")").css({backgroundColor: navOffColor});
			$(".photosNav li:eq(" + nextPhotoNum + ")").css({backgroundColor: navOnColor});
			onceSlide();
		});
	});
	
	//photos slideshow
	
	function initSlide() {
		$(".photosNav li:eq(0)").css({backgroundColor: navOnColor});
		$("#photoList li:eq(0)").stop(true, true).animate({opacity: "1"}, 2000);
	}
	
	initSlide();
});