/* TODO
	
	ensure page height is enough for window.scrollTo to work on iPhone
	
	iPhone alternate CSS
		wider spacing between nav elements
	
	ensure correct CSS formatting; prop:val; with no spaces
	
	validate
	
	favicon?
	
	history manager
*/

var galleryImagePath = 'images/gallery/';
var galleryThumbPath = 'images/gallery/thumbs/';

var galleryContent = [
	{ image:'001', caption:'Plas Hafod Hotel Flintshire' },
	{ image:'002', caption:'Doubletree by Hilton Chester' },
	{ image:'003', caption:'Adlington Hall Cheshire' },
	{ image:'004', caption:'Pre-wedding Shoot Bodnant Garden Conwy' },
	{ image:'005', caption:'' },
	{ image:'006', caption:'' },
	{ image:'007', caption:'Llyndir Hall Wrexham' },
	{ image:'008', caption:'Macdonald Portal Hotel Cheshire' },
	{ image:'009', caption:'Thornton Manor Wirral' },
	{ image:'010', caption:'' },
	{ image:'011', caption:'Church of John The Baptist Chester' },
	{ image:'012', caption:'Soughton Hall Flintshire' },
	{ image:'013', caption:'' },
	{ image:'014', caption:'Carden Park Cheshire' },
	{ image:'015', caption:'Thornton Manor Wirral' },
	{ image:'016', caption:'' },
	{ image:'017', caption:'Arley Hall Cheshire' },
	{ image:'018', caption:'Rowton Castle Shropshire' },
	{ image:'019', caption:'Queen Hotel Chester' },
	{ image:'020', caption:'Adlington Hall Cheshire' },
	{ image:'021', caption:'Ruthin Castle Denbighshire' },
	{ image:'022', caption:'' },
	{ image:'023', caption:'Rookery Hall Cheshire' },
	{ image:'024', caption:'Rowton Castle Shropshire' },
	{ image:'025', caption:'Inglewood Manor Wirral' },
	{ image:'026', caption:'Arley Hall Cheshire' },
	{ image:'027', caption:'' },
	{ image:'028', caption:'Delbury Hall Shropshire' },
	{ image:'029', caption:'' },
	{ image:'030', caption:'' },
	{ image:'031', caption:'Thornton Manor Wirral' },
	{ image:'032', caption:'Caer Rhun Hall Conwy' },
	{ image:'033', caption:'Inglewood Manor Wirral' },
	{ image:'034', caption:'' },
	{ image:'035', caption:'Plas Maenan Conwy' },
	{ image:'036', caption:'' }
];

var weddingImagePath = 'images/wedding/';

var sequence = [
	{ image:'001', caption:"" },
	{ image:'002', caption:"“ We didn't just get great photographs; they are amazing! We're so happy with them! ”" },
	{ image:'003', caption:'' },
	{ image:'004', caption:"“ Thank you so much for capturing our day so perfectly. Couldn't recommend you any higher! ”" },
	{ image:'005', caption:"" },
	{ image:'006', caption:"“ Thank you so much for the gorgeous album. The photographs are simply amazing. ”" },
	{ image:'007', caption:'' },
	{ image:'008', caption:"“ Please accept our most sincere thanks and gratitude for all the hard work that you did on our special day. ”" },
	{ image:'009', caption:"" },
	{ image:'010', caption:"“ You captured everything we wanted and more! ”" }
];






/* site engine... */

var captionBgTint	= 0.6;
var imageCrossfade	= 2000;
var imagePolling	= 1000;	// waiting for image to load
var captionInBg		= 1000;
var captionInTxt	= 1000;
var captionWaitBg	= 3000;
var captionWaitTxt	= 4000;
var captionOutBg	= 2000;
var captionOutTxt	= 1000;
var noCaptionWait	= 5000;
var state			= 0;
var seqIndex		= 0;
var initGallery		= true;
var firstView		= true;


function showPage(p){
	
	if (p == 'main') {
	//	$('#content-main').show()
		$('#content-main').removeClass('hideMain');
		$('#nav-main').addClass('selected');
	} else {
	//	$('#content-main').hide();
		$('#content-main').addClass('hideMain');
		$('#nav-main').removeClass('selected');
	}
	
	if (p == 'gallery') {
		$('#content-gallery').show()
		$('#nav-gallery').addClass('selected');
	} else {
		$('#content-gallery').hide();
		$('#nav-gallery').removeClass('selected');
	}
	
	if (p == 'info') {
		$('#content-info').show()
		$('#nav-info').addClass('selected');
	} else {
		$('#content-info').hide();
		$('#nav-info').removeClass('selected');
	}
	
	if (p == 'prices') {
		$('#content-prices').show()
		$('#nav-prices').addClass('selected');
	} else {
		$('#content-prices').hide();
		$('#nav-prices').removeClass('selected');
	}
	
	if (p == 'client') {
		$('#content-client').show()
		$('#nav-client').addClass('selected');
	} else {
		$('#content-client').hide();
		$('#nav-client').removeClass('selected');
	}
	
	// skip iPhone address bar
	window.scrollTo(0, 1);
};


/* wedding presentation slideshow */
function goMain(){
	
	showPage('main');
};


/* presentation utility call */
function poll(next){
	
	var caption;
	
	switch(state) {
		
		case 0:
			
			if ($('#main-front img')[0].complete) {
				
				$('#main-front').fadeIn(imageCrossfade).queue(poll);
				state++;
			}
			else {
				
				$('#content-main').delay(imagePolling).queue(poll);
			}
			break;
		
		case 1:
			
			$('#main-back img').attr('src', weddingImagePath + sequence[(seqIndex+1)%sequence.length].image + ".jpg");
			
			caption = sequence[seqIndex].caption;
			$('#main-caption p').html( caption );
			
			seqIndex = (seqIndex + 1) % sequence.length;
			
			if (caption == '') {
				$('#main-caption').delay(noCaptionWait).queue(poll);
			}
			else {
				$('#main-caption div')
					.fadeTo(captionInBg, captionBgTint)
					.delay(captionWaitBg)
					.fadeOut(captionOutBg);
				
				$('#main-caption p')
					.fadeIn(captionInTxt)
					.delay(captionWaitTxt)
					.fadeOut(captionOutTxt).queue(poll);
			}
			state++;
			break;
		
		case 2:
			
			if ($('#main-back img')[0].complete) {
				
				$('#main-back').show();
				$('#main-front').fadeOut(imageCrossfade).queue(poll);
				state++;
			}
			else {
				
				$('#content-main').delay(imagePolling).queue(poll);
			}
			break;
		
		case 3:
			
			$('#main-front img').attr('src', weddingImagePath + sequence[(seqIndex+1)%sequence.length].image + ".jpg");
			
			caption = sequence[seqIndex].caption;
			$('#main-caption p').html( caption );
			
			seqIndex = (seqIndex + 1) % sequence.length;
			
			if (caption == '') {
				$('#main-caption').delay(noCaptionWait).queue(poll);
			}
			else {
				$('#main-caption div')
					.fadeTo(captionInBg, captionBgTint)
					.delay(captionWaitBg)
					.fadeOut(captionOutBg);
				
				$('#main-caption p')
					.fadeIn(captionInTxt)
					.delay(captionWaitTxt)
					.fadeOut(captionOutTxt).queue(poll);
			}
			state = 0;
			break;
		
	};
	
	next();
};


/* image gallery */
function goGallery(){
	
	// initialise?
	
	if (initGallery) {
		
		$('#gallery-image').click(function(event){//was #gallery-image a
			
			$('#gallery-image').empty();
			
			$('#gallery-caption').empty();
			
			$('#gallery-spinner').hide();
			
			$('#gallery-thumbs').show();
			
			event.preventDefault();
		});
		
		// add thumbnails
		
		$(galleryContent).each(function(index,item){
			
			// add thumbnail
			
			var li = $('<li id="thumbs-' + index + '"><a href="#"><img src="' + galleryThumbPath + item.image + '.jpg" /></a></li>').appendTo($('#gallery-thumbs ul'));
			
			// add thumbnail functionality
			
			$('li#thumbs-'+index).click(item, function(event){	// +' a' ?
				
				// hide thumbs, show spinner, remove previous image, hide caption
				
				$('#gallery-thumbs').hide();
				
				$('#gallery-spinner').show();
				
				// create and load new image
				
				var img		= new Image();
				
				var imgPath	= galleryImagePath + item.image + ".jpg";
				
				var caption	= item.caption;
				
				$(img).load(function(){
					
					$('#gallery-spinner').hide();
					
					$('#gallery-image').append('<a href="#"></a>');
					
					$('#gallery-image a').append(this);
					
					$('#gallery-image img').hide();
					
					$('#gallery-image img').fadeIn('slow');
					
					/* first viewing message override (fixme: better solution) */
					
					if (firstView == true) {
						
						caption = 'CLICK PHOTO TO RETURN';
						
						firstView = false;
					}
					
					if (caption != '') {
						
						$('#gallery-caption').append('<div></div><p>'+caption+'</p>');
						
						$('#gallery-caption div').hide();
						
						$('#gallery-caption p').hide();
						
						$('#gallery-caption div')
							.delay(500)
							.fadeTo(1000, captionBgTint)
							.delay(3000)
							.fadeOut(500);
						
						$('#gallery-caption p')
							.delay(500)
							.fadeIn(1000)
							.delay(3000)
							.fadeOut(500);
					}
					
				}).error(function(){
					
					$('#gallery-thumbs').show();
					
					$('#gallery-spinner').hide();
					
				}).attr('src', imgPath);
				
				event.preventDefault();
			});
			
		});
		
		initGallery = false;
	}
	
	// initial state
	
	$('#gallery-image').empty();
	
	$('#gallery-caption').empty();
	
	$('#gallery-spinner').hide();
	
	$('#gallery-thumbs').show();
	
	showPage('gallery');
};


/* contact & about page */
function goInfo(){
	
	showPage('info');
};


/* prices */
function goPrices(){
	
	showPage('prices');
};


/* client */
function goClient(){
	
	showPage('client');
};


/* client redirection */
function selectClient(value) {
	
//	alert(value);
};


/* main
	- #main-back initially hidden to prevent image placeholder on IE/Opera
*/
$(document).ready(function(){
	
	// add event handlers
	
	$('#nav-main').click(function(event){
		goMain();
		event.preventDefault();
	});
		
	$('#nav-gallery').click(function(event){
		goGallery();
		event.preventDefault();
	});
	
	$('#nav-info').click(function(event){
		goInfo();
		event.preventDefault();
	});
	
	$('#nav-prices').click(function(event){
		goPrices();
		event.preventDefault();
	});
	
//	$('#nav-client').click(function(event){
//		goClient();
//		event.preventDefault();
//	});
	
	// initial state
	
	$('#main-back').append( new Image() );
	$('#main-front').append( new Image() );
	
	$('#main-back').hide();
	$('#main-front').hide();
	
	$('#main-caption div').hide();
	$('#main-caption p').hide();
	
	// preload and begin
	
	$('#main-front img').attr('src', weddingImagePath + sequence[seqIndex].image + ".jpg");
	$('#content-main').delay(500).queue(poll);
	goMain();
});