var hallImgs = "#slideDetailImg li";
var thumbImgs = "#slideThumb li";
var thumbActiveClass = "active";

var totalNum = 0;
var cnt = 0;
var prv = 0;
var timer;
var duration = 4000;
var retryDur = 2000;
var appT = 700;
var vanT = 400;

$(function(){
	totalNum = $(thumbImgs).length;
	
	$(hallImgs).fadeTo(0,0).hide();
	$(hallImgs).eq(0).fadeTo(0,0);
	
	$(hallImgs).hover(brightBack__,function(){});	
	$(thumbImgs).hover(thumbOver__,function(){});	
	
});

$(window).load(function() {
	$("#slideDetailImg li img").show();
	$(hallImgs).eq(0).fadeTo(appT,1.0);
	timer = setInterval(changeImg__, duration);
});

function changeImg__(){
	cnt = cnt+1;
	if (cnt == totalNum+1) cnt = 0;

	$(hallImgs).stop(true,false).fadeTo(vanT,0,function(){$(this).hide();});
	$(hallImgs).eq(cnt).stop(true,false).show().fadeTo(appT, 1.0);
	
	$(thumbImgs).find("a").removeClass("active");
	$(thumbImgs).eq(cnt-1).find("a").addClass("active");
	
	prv = cnt;
}

function thumbOver__() {
	clearInterval(timer);
	timer = null;
	
	var myIndex = $(thumbImgs).index(this);
	
	cnt = myIndex+1;
	
	$(thumbImgs).find("a").removeClass("active");
	$(hallImgs).stop(true,false).fadeTo(vanT,0,function(){$(this).hide();});
	$(hallImgs).eq(cnt).stop(true,false).show().fadeTo(appT, 1.0);
	$(this).find("a").addClass("active");
	
	prv = cnt;
	
	timer = setInterval(changeImg__, duration);
}

function brightBack__(){
	$(this).fadeTo(50, 0.8).fadeTo(800, 1.0);
}