// Vertically center the website
(function ($) {
$.fn.vAlign = function() {
	return this.each(function() {
		var site_height = 468; // Roughly 90% of the total content area
		var ah = $(this).height();
		var ph = $(this).parent().height();
		var mh = Math.round((ph - ah) / 2);
		$('#bg').css('height', mh + site_height - 45);
		$(this).css('paddingTop', mh);
	});
};
})(jQuery);




// Image animations
function slideSwitch() {
	// Get the current image
    var $active = $('#slideshow img.active');

	// Select the next image to display
    if ( $active.length == 0 ) $active = $('#slideshow img:last');
    var $next =  $active.next().length ? $active.next()
        : $('#slideshow img:first');

	// Test if we need to crossfade greyscale images
	var crossfade = $active.hasClass('greyscale');
	
	if (crossfade == true) {
	    $next.animate({opacity: 1}, 500, function() {
	    	$active.animate({opacity: 0}, 500).removeClass('active');
	    }).addClass('active');

	    delay = display_duration;
	} else {
	    $active.animate({opacity: 0}, 500, function() {
	    	$next.animate({opacity: 1}, 500).addClass('active');
	    }).removeClass('active');
	    
	    if (greyscale == true) {
	    	delay = 2500;
	    } else {
	    	delay = display_duration;
	    }
    }
    
    // Update description or selected navigation item
    if (show_image_descriptions == true) {
    	$('#slideshow-description').html($next.attr('alt'));
    } else {
	    current = $next.attr('id');
	    nextnav = $('#slideshow-nav [rel='+current+']');
	    if (nextnav.length) {
		    $('#slideshow-nav a').removeClass('selected-image');
		    nextnav.addClass('selected-image');	
	    }
    }

    // Create loop
    slideswitch = setTimeout( "slideSwitch()", delay );
}

$(function() {
	
	// Vertically centre website
    $('#wrapper-site').vAlign();
    $(window).bind('resize', function(){
		$('#wrapper-site').vAlign();
	});


	// Set up slideshow
	var images = $('#slideshow img');
	if (images.length == 1) {

		// Set up fake navigation for consistency
		if ($('body').hasClass('history')) {
			$('#slideshow').after('<div id="slideshow-description">'+$('#slideshow img:first').attr('alt')+'</div>');
		} else {
			$('#slideshow').after('<ul id="slideshow-nav"><li><a href="#" class="selected-image">x</a></li></ul>');
		}
		
	} else if (images.length > 1) {
	
		// Check if greyscale images are shown (philosophy page)
		greyscale = $('#slideshow').hasClass('greyscale');

		// Set delays between image transitions
		if ( $('body').hasClass('history') ) {
			display_duration = 2500;
		} else {
			display_duration = 5000;
		}

		
		// Check if image descriptions should be shown instead of navigation (history pages)
		show_image_descriptions = $('body').hasClass('history');

		// Hide images by default
		images.css({opacity: 0});
		
		// Begin slideshow
		slideSwitch();

		// Create buttons for image navigation UNLESS we're on the history page
		if (show_image_descriptions) {
			$('#slideshow').after('<div id="slideshow-description">'+$('#slideshow img:first').attr('alt')+'</div>');
		} else {
			$('#slideshow').after('<ul id="slideshow-nav"></ul>');
			images.each(function(index) {
				$(this).attr('id', 'slideshow-img-'+index);
			});
			
			nav_html = '';
			for (i=0; i < images.length; i++){  
				if (greyscale == true) {
					if (i % 2 == 0) {
						nav_html += '<li><a href="#" rel="slideshow-img-'+i+'">x</a></li>';
					}
				} else {
				    nav_html += '<li><a href="#" rel="slideshow-img-'+i+'">x</a></li>';
			    }
			}  
			$('#slideshow-nav').append(nav_html);
			$('#slideshow-nav a:first').addClass('selected-image');

			// Set up click functions			
			$('#slideshow-nav a').click(function() {

				// Stop auto animation
				clearTimeout(slideswitch);
			
				// Switch images
				$active = $('#slideshow img.active');
				$next = $('#'+$(this).attr('rel'));			
			    $active.animate({opacity: 0}, 500, function() {
			    	$next.animate({opacity: 1}, 500).addClass('active');
			    }).removeClass('active');
			    
			    // Update thumbnail display
			    $('#slideshow-nav a').removeClass('selected-image');
			    $(this).addClass('selected-image');
			    
				// Resume slideshow
				if (greyscale) {
					slideswitch = setTimeout( "slideSwitch()", 2500 );
				} else {
					slideswitch = setTimeout( "slideSwitch()", display_duration );
				}
				

			});
		}
	}
	
	// Add image previews on hover
	$('#utility-downloads a').hover(
		function(){
			$('#target-image').attr('src', $(this).attr('data-preview-image'))
		},
		function(){}
	);
	
	
});