var cur;
var curThumbnail;
var curThuURL;
var curNum=0;
var totalNum = $("#imageList > li").size()
var interval;
var alt;
var defaultThumb;
var paintedThumb;
var curLinkLi="";
var block;  //clickableArea

$(function() {
	$("#imageList li:gt(0)").hide();
	$("#imageList li:last").addClass('last');
	$("#imageList li:first").addClass('first');
	$("#thumbnails div:last-child").addClass('lastThumb');
	$("#thumbnails div:first-child").addClass('firstThumb');

	cur = $("#imageList li:first");
	curThumbnail = $("#thumbnails div:first-child");
	defaultThumb=$("#otherThumbPic").attr("src");
	defaultThumb= "url('"+defaultThumb+"')";

	paintedThumb=$("#curThumbPic").attr("src");
	paintedThumb= "url('"+paintedThumb+"')";
	
	totalNum = $("#imageList > li").size();
	//alert(defaultThumb+ "\n" + "url('http://localhost/wordpress/wp-content/themes/phoenix/images/slideshow/thumbnail_painted.gif')");
	
	
	interval = setInterval( "animate()", 4000 );
} );

function stopPlaybackFunc() {
	clearInterval(interval);
}

function goToPic(picNumber, stopPlayback){
	if (stopPlayback) {
		stopPlaybackFunc();
	}
	curThumbnail.css("background-image", defaultThumb );
	cur.fadeOut( 2000 );
	cur = $('#imageList li').eq(picNumber);
	curThumbnail = $('#thumbnails div').eq(picNumber);
	curThumbnail.css("background-image", paintedThumb );
	
	var alt=cur.find('img:first').attr('alt');
	// putting the link into clickable area
	curLinkLi = $('#linkList li').eq(picNumber); //getting li with link
	var curLink = curLinkLi.text();  //getting link text
	
	if(curLinkLi.text()!=""){
		$('a#goTo').text(curLink);
		block.addClass("clickable");
		document.getElementById("goTo").setAttribute("href", curLink); //setting href
		var goTo="Go to ";
		curLink=goTo+curLink;
		document.getElementById("clickableArea").setAttribute("title", curLink); //setting title
	}else{
		curLink="";
		block.removeClass("clickable");
		$('a#goTo').text(curLink);
		document.getElementById("clickableArea").setAttribute("title", ""); //setting title
		document.getElementById("goTo").setAttribute("href", ""); //setting href
	}
	$('div#pictureDescrip').find('span:first').text(alt); //changing description
	// show up
	cur.fadeIn( 2000 );	
	//curThumbnail.css("background-image", "url('/images/slideshow/thumbnail_painted.gif')");
	
//	previous
//	current
//	
//	var tmp = previous.style.background;
//	previous.style.background = current.style.backgound;
//	current.style.background = tmp;
} 

function animate() {
	goFwd(false);
} 

function goFwd(stopPlayback){
	++curNum;
	if (curNum==totalNum) {
		curNum = 0;
	}
	goToPic(curNum, stopPlayback);
}

function goBack(stopPlayback){
	--curNum;
	if (curNum<0) {
		curNum = totalNum-1;
	}
	goToPic(curNum, stopPlayback);
}

function goThumbnail(toGo){
	var str = toGo.id;
	var picNum = str.substring(str.indexOf("_")+1, str.length);
	goToPic(picNum, true);
	
}
$(document).ready(function(){
	   block = $("div#clickableArea");
	   block.click(function(){
	      window.location = $(this).find("a:first").attr("href")
	   });
	   block.addClass("clickable");
	   block.hover(function(){
	      window.status = $(this).find("a:first").attr("href")
	   }, function(){
	      window.status = ""
	   })
	});