// JavaScript Document

$(document).ready(function() {
	
	var titles 		= [];
	var captions 	= [];
	var urls 		= [];
	var images 		= [];
	
	var newImagePathId = 0;
	var newImagePath;
	var currentImage;
	var documentWidth = $(window).width();
	var imageWidth = 1400;
	if(imageWidth < documentWidth && imageWidth!==0){
		documentWidth = imageWidth;
	}
	
	$('#headerBannerImage').width(documentWidth);
	$('#imageHolder').css({ left: ((documentWidth-imageWidth)/2) });
	
	pageId = "9aa09ecf-6a57-46d7-8046-0c2d6a6132da";
	
	$.loadXML("", xmlCallback, pageId,1);
	
	function xmlCallback(xml)
	{
		if(!(xml instanceof jQuery))
		{
			xml = $(xml);
		}
		
		noOfImages = xml.find('TemporaryTable').length;
		
		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());
		});
		
		
		var captionText = "<h1>"+ titles[0] +"</h1><p>"+ captions[0] +"</p><a href='"+ urls[0] +"'>Read More >></a>";
	
		//$('#slideContentHolder').append(captionText);
		
		//$('#slideContentHolder').animate({opacity: 1},500);
		
		for(var i = 0; i <noOfImages ; i++){
			var firstClass;
			
			if(i==0){
				firstClass = " class='selected'";
			}else{
				firstClass = ''
			}
			var li = i+1;
			var childLi = "<li"+ firstClass +"><a href='javascript:void(0);' class='slideBulletNumbers' rel='"+ i +"'><div></div></a></li>";
			$('#slideBullets').append(childLi);
			
			var imageChilds ="";
			if(i==0){
				imageChilds = "<li><img src='"+ images[i] +"' class='currentImage'/></li>";
				$('#imageHolder').append(imageChilds);

			}else{
				imageChilds = "<li><img src='"+ images[i] +"'/></li>";
				$('#imageHolder').append(imageChilds);
				
				$('#imageHolder li:eq('+i+')').children().animate({
					opacity: 0
				}, 10);

			}
			
			//onImgLoadComplete();

			
		}
		$('.jqSignUp').attr('href',"/try-whiteglo-for-free");
		$('.readMore').attr('href',urls[0]);
		var refreshIntervalId;
		
		var varName = function(){
			if(newImagePathId < noOfImages-1) {
				newImagePathId++;
				loadNextImage();
			
			} else {
				clearInterval(refreshIntervalId);
			}
		};
		
		defineInterval();
		function defineInterval(){
			refreshIntervalId = setInterval(varName, 5000);
		}

		
		function loadNextImage(){
			
			$('.currentImage').animate({
				opacity: 0
			},800);

			$('.currentImage').parent().children().removeClass();
			
			$('#imageHolder li:eq('+newImagePathId+')').children().animate({
				opacity: 1
			},800);
			
			$('#imageHolder li:eq('+newImagePathId+')').children().addClass('currentImage');

			$('#slideBullets li').removeClass();
			
			$('#slideBullets li:eq('+newImagePathId+')').addClass('selected')

		
		}
			
		$('.slideBulletNumbers').click(function(){
			clearInterval(refreshIntervalId);
			defineInterval();
			newImagePathId = $(this).attr('rel');
			$('.readMore').attr('href',urls[newImagePathId]);

			loadNextImage();
		});
		
		
		
	}

	function onImgLoadComplete()
	{
		//console.log((documentWidth-imageWidth)/2);
		//var imageWidth = $('img.currentImage').width();
		//$('#headerBannerImage').width(documentWidth);
		//$('#headerBannerImageHolder').width(documentWidth);
		//$('#imageHolder').css({ left: ((documentWidth-imageWidth)/2) });
		//$('#slideContent').offset({ left: (documentWidth-960)/2 });
		//$('#headerBannerImage').offset({ left: (Math.abs(documentWidth - imageWidth)/2) });
	}
	
	

});