var currentBGImageNum = 0;
var totalBgImages = 0;
var imageFadeTime = 1500;
var imageTimer = 7000;
var bgTimer;
var isAnimating = false;
var queuedNum = -1;

$(document).ready(function() {
	$(window).bind("resize", resizeBgImages);
});

var resizeBgImages = function() {
	var windowWidth = $(window).width();
	var windowHeight = $(window).height();

	var ratio1 = windowWidth / windowHeight;
	
	$("img.bg.loaded").each(function() {
		
		var imageWidth = $(this).width();
		var imageHeight = $(this).height();
		
		var ratio2 = imageWidth / imageHeight;
		
		if(ratio1 > ratio2)
		{
			$(this).attr({
				width: windowWidth
			}).removeAttr("height");
		}
		else
		{
			$(this).attr({
				height: windowHeight
			}).removeAttr("width");
		}
		
	});
}

var loadBGGallery = function(xmlPath) {
	
	$.ajax({
		type: "GET",
		url: xmlPath,
		dataType: "xml",
		success: function(d) {
					
			var i = 0;
			
			totalBgImages = $(d).find('item').length;
			
			var nodesOn = false;
			if(totalBgImages > 1)
			{
				nodesOn = true;
				
				var nodeTotalWidth = 7 + (16 * (totalBgImages-1));
				
				$('#bgGalleryControls').append('<div class="bgGalleryControlsContainer"><div class="rightBtn"></div><div class="bgNodesWrapper" style="width: '+nodeTotalWidth+'px"><ul class="bgNodes" id="bgNodes" style="width: '+nodeTotalWidth+'px"></ul><div style="clear:both;"></div></div><div class="leftBtn"></div><p class="title">Photographs</p><div style="clear:both;"></div></div>');
				
				$('.bgGalleryControlsContainer .rightBtn').click(nextBGImage);
				$('.bgGalleryControlsContainer .leftBtn').click(prevBGImage);
				
			}
			
			var $bgImageWrapper = $('<div class="bgImageWrapper"></div>').appendTo('body');
			
			$(d).find('item').each(function() {
				
				var $item = $(this);
				
				var imgPath = $item.find('file').text();
				
				var img = new Image();
				
				if(nodesOn)
				{
					var onClass = '';
					if(i == 0)
					{
						onClass = ' class="on"';
					}
					
					var newNode = $('<li id="node'+i+'"'+onClass+'></li>')
									.appendTo('#bgNodes')
									.click(bgNodeOnClick);
				}

				$(img).load(function () {
									  
					$(this).removeClass('loading');
					$(this).addClass('loaded');
									  
					resizeBgImages();
									  
					
					var imageNum = $(this).attr('id');
					imageNum = imageNum.split('image');
					imageNum = imageNum[1];
					
					if(imageNum == 0)
					{
						$(this).fadeIn(200);
						
						if(totalBgImages > 1)
						{
							setBGTimer();
						}
					}
				
				 }).attr('src', imgPath).appendTo($bgImageWrapper).attr('id', 'image'+i).addClass('bg').addClass('loading').fadeOut(0);
				
				i++;
				
				
			});
		}
	});
	
}

var setBGTimer = function() {
	clearTimeout(bgTimer);
	bgTimer = setTimeout(nextBGImage, imageTimer);
}

var nextBGImage = function() {
	getBGImage(-1);
}

var prevBGImage = function() {
	getBGImage(-2);
}

var bgNodeOnClick = function() {
	var imageNum = $(this).attr('id');
	imageNum = imageNum.split('node');
	imageNum = imageNum[1];
	
	getBGImage(imageNum);
}

var getBGImage = function(num) {
	
	if(num == -1)
	{
		num = currentBGImageNum + 1;
	}
	else if(num == -2)
	{
		num = currentBGImageNum - 1;
	}
	
	if(num > totalBgImages - 1)
	{
		num = 0;
	}
	else if(num < 0)
	{
		num = totalBgImages - 1;
	}
	
	if(num != currentBGImageNum)
	{
		if(isAnimating == false)
		{
			isAnimating = true;
			
			var $currentImage = $('#image'+currentBGImageNum);
			var $nextImage = $('#image'+num);
			
			$('.bgNodes li').removeClass('on');
			$('.bgNodes li#node'+num).addClass('on');
			
			$currentImage.removeClass('nextImage').delay(imageFadeTime).fadeOut(0);
			
			$nextImage.addClass('nextImage').fadeIn(imageFadeTime, checkQueue);
			
			currentBGImageNum = num;
		}
		else
		{
			queuedNum = num;
		}		
	}
	
	setBGTimer();
}

var checkQueue = function() {
	
	isAnimating = false;
	
	if(queuedNum == null || queuedNum != -1)
	{
		getBGImage(queuedNum);
		queuedNum = -1;
	}
	
}