// JavaScript Document

$(document).ready(function() {
	
	var titles 					= [];
	var captions 				= [];
	var urls 					= [];
	var images 					= [];
	
	//Previous Image Set
	var previous_currentImageNo;
	var previous_nextImgNo 		= 1;
	var previous_preImgNo;
	
	//Current Imaege Set
	var currentImageNo 			= 1;
	var nextImgNo 				= 2;
	var preImgNo;
	
	//Next Image Set
	var next_currentImageNo 	= 2;
	var next_nextImgNo 			= 3;
	var next_preImgNo;

	var refreshIntervalId;
	var leftValue = 0;
	var imageWidth = 452;
	
	var animateValue = (imageWidth + 10);
	var animateRightValue = (imageWidth + 10);
	var startLeft = 3*imageWidth + 30 + (imageWidth - 211);
	
	var leftLimit = imageWidth + 10 + (imageWidth-211)
	var lastLeftValue;
	

	var nextLeftValue = imageWidth;
	var url = "";
	var firstRun = true;
	

	
	/*pageId = "F2594272-89A4-45CD-A695-4DBC342916F4";
	url = "http://w3svc775.production.netstarter.com";*/

	$.loadXML(url, xmlCallback, pageId);
	
	function xmlCallback(xml)
	{
		
		
		if(!(xml instanceof jQuery))
		{
			xml = $(xml);
		}
		
	
		noOfImages = xml.find('TemporaryTable').length;
		lastLeftValue = (((noOfImages+2)*animateRightValue) - (imageWidth - 231));
		
		previous_currentImageNo = noOfImages-1;
		preImgNo = noOfImages-1;
		
		
		xml.find('TemporaryTable').each(function(){
			titles.push($(this).find('Title').text());
			captions.push($(this).find('Caption').text());
			urls.push($(this).find('URL').text());
			images.push($(this).find('LargeFileName').text());
		});

		for(var i = 0; i <noOfImages ; i++){
			
			var imageChilds = "";
			var liChildValues = "";
			
			if(urls[i] == ""){
				liChildValues = "<img src='"+ images[i] +"' border='0' title='"+ titles[i] +"'/>";
			}else{
				liChildValues = "<a href='"+ urls[i] +"' rel='"+ captions[i] +"'><img src='"+ images[i] +"' border='0' title='"+ titles[i] +"'/></a>";
			}
			
			
			if(i==0){
				imageChilds = "<li class='currentImage'>"+ liChildValues +"</li>";
			}else{
				imageChilds = "<li>"+ liChildValues +"</li>";
			}
			
			$('#imageHolder').append(imageChilds);
			
			if(noOfImages >1){
				$('#imageHolder').css({width:imageWidth*(noOfImages+6)});
				$('#imageHolder').css({left:-(startLeft)});
			}else{
				var centerValue = (895 - imageWidth)/2
				$('.currentImage').css({width:imageWidth});
				$('#imageHolder').css({left:(centerValue)});
			}

		}
		
		if(noOfImages >1){
			$('#imageHolder li:eq('+ (0) +')').clone().appendTo('#imageHolder');
			$('#imageHolder li:eq('+ (1) +')').clone().appendTo('#imageHolder');
			$('#imageHolder li:eq('+ (2) +')').clone().appendTo('#imageHolder');
			
			$('#imageHolder li:eq('+ (noOfImages-1) +')').clone().prependTo('#imageHolder');
			$('#imageHolder li:eq('+ (noOfImages-1) +')').clone().prependTo('#imageHolder');
			$('#imageHolder li:eq('+ (noOfImages-1) +')').clone().prependTo('#imageHolder');
		}
		
		
		
		
		
		
		//addText();
		
		if(noOfImages >1){
			var firstTitle = "<span class='heading01'>"+ titles[1] +"<br/> </span>"; 
			var secondTitle = "<span class='heading02'>"+ captions[1] +"</span>";
		}else{
			var firstTitle = "<span class='heading01'>"+ titles[0] +"<br/> </span>"; 
			var secondTitle = "<span class='heading02'>"+ captions[0] +"</span>";
		}
		
		
		$('#captions').html('').append(firstTitle).append(secondTitle);
		
		Cufon.replace('#captions .heading01', { hover: true, fontFamily: 'Austin Roman' });
		Cufon.replace('#captions .heading02', { hover: true, fontFamily: 'Austin Roman' });
		
		
		
		var refreshIntervalId;
		
		var varName = function(){
			$('.rightNav').unbind('click');
			$('.leftNav').unbind('click');
			moveLeft();
		};
		
		if(noOfImages >1){
			defineInterval();
		}
		
		
		function defineInterval(){
			refreshIntervalId = setInterval(varName, 5000);
		}
		
		
		if(noOfImages > 1){
			definePlayNextButtons();
		}
		
		function definePlayNextButtons(){
			
			
			$('.rightNav').click(function(){
				clearInterval(refreshIntervalId);
				defineInterval();
				$('.rightNav').unbind('click');
				$('.leftNav').unbind('click');
				moveLeft();
			});
			
			$('.leftNav').click(function(){
				clearInterval(refreshIntervalId);
				defineInterval();
				$('.rightNav').unbind('click');
				$('.leftNav').unbind('click');
				moveRight();
			});
		}

		function moveLeft(){
			
			$('#imageHolder').animate({
				left: ($('#imageHolder').position().left - (animateValue))
			},500, function(){
				if($('#imageHolder').position().left <= - lastLeftValue){
					$('#imageHolder').css({left:-leftLimit});
				}
				if(currentImageNo < noOfImages-1){
					currentImageNo++;
				}else{
					//$('#imageHolder').css({left:-leftLimit});
					currentImageNo = 0;
				}
				addText();
			});
			
		}
		
		function moveRight(){
			
			$('#imageHolder').animate({
				left: ($('#imageHolder').position().left + animateRightValue)
			},500, function(){
				if($('#imageHolder').position().left >= - leftLimit){
					//$('#imageHolder').css({left:-lastLeftValue});
				}
				
				if(currentImageNo > 0){
					currentImageNo--;
				}else{
					currentImageNo = noOfImages - 1;
					$('#imageHolder').css({left:-lastLeftValue});
				}
				addText();
			});
			
		}
		
		function addText(){
			var h1Tag = "<span class='heading01'>"+ titles[currentImageNo] +"<br/> </span>"; 
			var h2Tag = "<span class='heading02'>"+ captions[currentImageNo] +"</span>";
			
			$('#captions').html('').append(h1Tag).append(h2Tag);
			
			Cufon.replace('#captions .heading01', { hover: true, fontFamily: 'Austin Roman' });
			Cufon.replace('#captions .heading02', { hover: true, fontFamily: 'Austin Roman' });
			
			/*console.log($('#imageHolder li:eq('+ (currentImageNo+3) +')').children().children().attr("title") );
			console.log(titles[currentImageNo]);
			console.log("---");*/
			
			definePlayNextButtons();
		}
	}

});
