// jquery function start //
$(function(){
$.ajax({
	type: "GET",
	url: "../Contents/Xml/seasonal.xml",
	dataType: "xml",
	success: xmlParser
});
}); //ready end

var opa = 0.7
function xmlParser(xml) {
	$(xml).find('item').each(function(){
		var itemID = $(this).attr('id');
		$('#spLarge').append('<li id="'+itemID+'"><a href="'+$(this).find("url").text()+'"><img src="../Contents/seasonalimages/' + $(this).find("image").text() + '" alt="'+$(this).find("text").text()+'" /></a></li>');
		$('#spLarge #'+itemID+' a img').fadeIn(300);
		$('#spThumb').append('<li class="'+itemID+'"><a href="'+$(this).find("url").text()+'"><img src="../Contents/seasonalimages/'+$(this).find("thumb").text()+'" alt="'+$(this).find("text").text()+'" /></a></li>');
		$('#spThumb .'+itemID+' a img').fadeIn(300,function(){
			$('#spThumb li').each(function(){
				$(this).css('background' , '#000');
			});
			$('#spThumb li:first img').css('opacity',opa);
		});
	});

	var i = 1;
	var fadeTime = 800;
	var intervalTimte = 5000;

	doInterval = setInterval(seasonalSwitch, intervalTimte);

	$('#spThumb li img').hover(function(){
		clearInterval(doInterval);
		i = $(this).parent().parent('li').attr('class').charAt(3);
		$('#spThumb li img').css('opacity','1');
		$(this).css('opacity',opa);
		$('#spLarge li').fadeOut(fadeTime);
		$('#spLarge #sp0'+i).fadeIn(fadeTime);
	},function(){
		$('#spThumb li img').css('opacity','1');
		$('#spThumb .sp0'+i+' img').css('opacity',opa);
		doInterval = setInterval(seasonalSwitch, intervalTimte);
	});

	function seasonalSwitch (){
		$('#spLarge #sp0'+i).fadeOut(fadeTime);
		i++;
		if(i==9){i=1;}
		$('#spThumb li img').css('opacity','1');
		$('#spThumb .sp0'+i+' img').css('opacity',opa);
		$('#spLarge #sp0'+i).fadeIn(fadeTime);
	}
}