/*
* Author:      Marco Kuiper (http://www.marcofolio.net/)
*/

// Timeout id
var timeoutId = null;

var interval = null;

var stopAnimation;

// Speed of the automatic slideshow
var slideshowSpeed = 15000;

// Speed of the transition
var transitionSpeed = 1700;

var activeContainer = 1;
var currentImg = 0;
var animating = false;
var navigate;

var currentPhotoCount;

// Variable to store the images we need to set as background
// which also includes some text and url's.
var defaultPhotos = [ {
		"image" : "sample1.jpg",
		"transition_type" : 3
	}, {
		"image" : "sample2.jpg",
		"transition_type" : 3
	}, {
		"image" : "sample3.jpg",
		"transition_type" : 3
	}, {
		"image" : "sample4.jpg",
		"transition_type" : 3
	}, {
		"image" : "sample5.jpg",
		"transition_type" : 3
	}
];

$.fn.resizenow = function() {
	return this.each(function() {

		//Define image ratio
		var ratio = 383/550;

		//Gather browser and current image size
		var imagewidth = $(this).width();
		var imageheight = $(this).height();
		var browserwidth = $(window).width();
		var browserheight = $(window).height();
		var offset;

		//Resize image to proper ratio
		if ((browserheight/browserwidth) > ratio){
			$(this).height(browserheight);
			$(this).width(browserheight / ratio);
			$(this).children().height(browserheight);
			$(this).children().width(browserheight / ratio);
		} else {
			$(this).width(browserwidth);
			$(this).height(browserwidth * ratio);
			$(this).children().width(browserwidth);
			$(this).children().height(browserwidth * ratio);
		}
		$(this).children().css('left', (browserwidth - $(this).width())/2);
		$(this).children().css('top', (browserheight - $(this).height())/2);
		return false;
	});
};

stopAnimation = function() {
	// Change the background image to "play"
		$("#control").css({"background-image" : "url(/images/play.png)"});

	// Clear the interval
	clearInterval(interval);
	clearTimeout(timeoutId);
};

initControls = function()
{
	// Backwards navigation
	$("#prevslide").click(function() {
		stopAnimation();
		navigate("back");
		$("#control").css({"background-image" : "url(/images/play.png)"});
		if(currentPhotoCount > 1) {
			// Start playing the animation
			//interval = setInterval(function() {
			//	navigate("next");
			//}, slideshowSpeed);
		}
	});

	// Forward navigation
	$("#nextslide").click(function() {
		stopAnimation();
		navigate("next");
		$("#control").css({"background-image" : "url(/images/play.png)"});
		if(currentPhotoCount > 1) {
			// Start playing the animation
			//interval = setInterval(function() {
			//	navigate("next");
			//}, slideshowSpeed);
		}
	});

	$("#control").toggle(function(){
		stopAnimation();
	}, function() {
		// Change the background image to "pause"
		$(this).css({"background-image" : "url(/images/pause.png)"});

		// Show the next image
		navigate("next");

		// Start playing the animation
		interval = setInterval(function() {
			navigate("next");
		}, slideshowSpeed);
	});
        $(this).css({"background-image" : "url(/images/play.png)"});
}

initNavigate = function(photos)
{
	navigate = function(direction) {
		if($('#control').size() > 0 && $("#control").css("background-image").indexOf('images/play.png') > -1) {
			$("#control").css({"background-image" : "url(/images/pause.png)"});
		}
		// Check if no animation is running. If it is, prevent the action
		if(animating) {
			return;
		}

		// Check which current image we need to show
		if(direction == "next") {
			currentImg++;
			if(currentImg == photos.length + 1) {
				currentImg = 1;
			}
		} else {
			currentImg--;
			if(currentImg == 0) {
				currentImg = photos.length;
			}
		}

		var slideNumber = (currentImg < 10) ? '0' + currentImg.toString() : currentImg.toString();
		$('span.slidenumber').html(slideNumber);

		// Check which container we need to use
		var currentContainer = activeContainer;
		if(activeContainer == 1) {
			activeContainer = 2;
		} else {
			activeContainer = 1;
		}

		var transitionType = (photos.length > 1) ? parseInt(photos[currentImg - 1].transition_type) : 1;
		if(direction == "back") {
			switch(transitionType) {
				case 5:
					transitionType = 3;
					break;
				case 3:
					transitionType = 5;
					break;
				case 4:
					transitionType = 2;
					break;
				case 2:
					transitionType = 4;
					break;
			}
		}
		
		showImage(photos[currentImg - 1], currentContainer, activeContainer, transitionType);
		return false;
	};
}

var currentZindex = -1;
var showImage = function(photoObject, currentContainer, activeContainer, transitionType) {
	animating = true;

	// Make sure the new container is always on the background
	currentZindex--;

	// Set the background image of the new active container
	/*$("#headerimg" + activeContainer).css({
		"background-image" : "url(/slideshow/" + photoObject.image + ")",
		"display" : "block",
		"z-index" : currentZindex + 1
	});*/
	$("#headerimg" + currentContainer).css({
		"z-index" : currentZindex
	});
	
	$("#headerimg" + activeContainer + ' img').attr('src', "/slideshow/" + photoObject.image);
	$("#headerimg" + activeContainer + ' img').css({"width" : "100%", "height" : "100%"});
	$("#headerimg" + activeContainer).resizenow();

	switch(transitionType){
		case 1:
			$("#headerimg" + activeContainer).hide();
			$("#headerimg" + activeContainer).fadeIn(900);
			$("#headerimg" + currentContainer).fadeOut(900);
			animating = false;
			break;
		case 2:
			$("#headerimg" + activeContainer).hide();

			setTimeout(
				function()
				{
					$("#headerimg" + currentContainer).hide("slide", {"direction" : "up"}, transitionSpeed, function() {
						timeoutId = setTimeout(function() {
							animating = false;
							$("#headerimg" + activeContainer).css('top', 0);
						});
					});
				}, 50
			);

			$("#headerimg" + activeContainer).show("slide", {"direction" : "down"}, transitionSpeed, function() {
				timeoutId = setTimeout(function() {
					animating = false;
				});
			});
			break;
		case 3:
			$("#headerimg" + activeContainer).hide();
			setTimeout(
				function()
				{
					$("#headerimg" + currentContainer).hide("slide", {"direction" : "left"}, transitionSpeed, function() {
						timeoutId = setTimeout(function() {
							animating = false;
							$("#headerimg" + activeContainer).css('top', 0);
						});
					});
				}, 900
			);
			setTimeout(
				function()
				{
					$("#headerimg" + activeContainer).show("slide", {"direction" : "right"}, transitionSpeed, function() {
						timeoutId = setTimeout(function() {
							animating = false;
						});
					});
			},800
				
			);
			break;
		case 4:
			$("#headerimg" + activeContainer).hide();
			setTimeout(
				function()
				{
					$("#headerimg" + currentContainer).hide("slide", {"direction" : "down"}, transitionSpeed, function() {
						timeoutId = setTimeout(function() {
							animating = false;
							$("#headerimg" + activeContainer).css('top', 0);
						});
					});
				}, 50
			);

			$("#headerimg" + activeContainer).show("slide", {"direction" : "up"}, transitionSpeed, function() {
				timeoutId = setTimeout(function() {
					animating = false;
				});
			});
			break;
		case 5:
			$("#headerimg" + activeContainer).hide();

			setTimeout(
				function()
				{
					$("#headerimg" + currentContainer).hide("slide", {"direction" : "right"}, transitionSpeed, function() {
						timeoutId = setTimeout(function() {
							animating = false;
							$("#headerimg" + activeContainer).css('top', 0);
						});
					});
				}, 50
			);

			$("#headerimg" + activeContainer).show("slide", {"direction" : "left"}, transitionSpeed, function() {
				timeoutId = setTimeout(function() {
					animating = false;
				});
			});
			break;
		default:
			$("#headerimg" + activeContainer).hide();
			$("#headerimg" + currentContainer).fadeOut(function() {
				timeoutId = setTimeout(function() {
					animating = false;
					$("#headerimg" + activeContainer).fadeIn(function() {
						timeoutId = setTimeout(function() {
							animating = false;
						}, 100);
					});
				}, 100);
			});
			break;
	}
};

initSlideshow = function(slides)
{
        stopAnimation();
	var photos = new Array();
	photos = slides;
	currentPhotoCount = photos.length;

//	activeContainer = 1;
	currentImg = 0;
	animating = false;

	var totalSlides = (photos.length < 10) ? '0' + photos.length.toString() : photos.length.toString();
	$('span.totalslides').html(totalSlides);
	$("#control").css({"background-image" : "url(/images/pause.png)"});

	initControls();
	initNavigate(photos);

	// We should statically set the first image
	navigate("next");

	if(photos.length > 1) {
		// Start playing the animation
		interval = setInterval(function() {
			navigate("next");
		}, slideshowSpeed);
	}

	$(window).bind("resize", function(){
		$('#headerimg .headerimg').each(
			function()
			{
				$(this).resizenow();
			}
		);
	});
}