showNav = false;

$(document).ready(function() {
	/* Drop down menu */
	$('#nav li').hover(  
        function() {  
            $('ul', this).show();  
        },   
        function () {  
            $('ul', this).hide();           
        }  
    ); 
    
    /* Image scroller */
    if($('#images').length > 0) {
    	initImageScroller();
    }
    
    /* Lock image height */
    if($('#image').length > 0) {
    	height = $('#image').height();
    	$('#image').css('height',height+'px');
    }
});

/**
 * Image scroller
 */
var imageFlowWidth = false;
var imagesWidth = false;
var imagePadding = false;
var imageBorder = 3;
var imageWidth = false;
var totalImages = false;
var visibleImages = 11;
var scrollToImg = 0;
var imageCache = new Array();

function initImageScroller() {
	imageFlowWidth = $('#imageFlow').width();
	imagesWidth = $('#images').width();

	imagePadding = $('#images a').css('marginRight');
	imagePadding = imagePadding.replace(/px/,'') * 1;
	
	imageWidth = $('#images img').width() + imagePadding;
	
	totalImages = $('#images a').size();
	
	if(totalImages > visibleImages) {
		$('#images-next').click(function() {
			nextPage();
			return false;
		});
	
		$('#images-prev').click(function() {
			prevPage();
			return false;
		});
	} else {
		$('#images-next,#images-prev').hide();
	}

	$('#images a').click(function() {
		$('#images .current').removeClass('current');
		getImage($(this));		
		return false;
	});
	
	// Keyboard shortcut
	$('body').keyup(function(event) {
		if(event.keyCode == 39 || event.keyCode == 32) {
			nextImage();
		} else if(event.keyCode == 37) {
			prevImage();
		}
	});
	
	$('#image img').live('click',function() {
		nextImage();
	});
}

function nextImage() {
	if($('#images .current').next().length > 0) {
		$('#images .current').removeClass('current').next().addClass('current')
		getImage($('#images .current'));
	}
}

function prevImage() {
	if($('#images .current').prev().length > 0) {
		$('#images .current').removeClass('current').prev().addClass('current');
		getImage($('#images .current'));
	}
}

function getImage(el) {
	$('.imageContainer').fadeOut(100);
	$(el).addClass('current');
	
	// See if images need to be scrolled
	scrollToImg = $(el).index() - 5;
	scrollImagesTo(scrollToImg);
	
	data = $(el).attr('id').split('-');
	page = data[1];
	id = data[2];

	// Get image
	if(imageCache[id] != undefined) {
		displayImage(imageCache[id]);
		return true;
	}
	
	$.getJSON(page.url,{'format':'json','photo':id,'page':page},function(result) {
		if(result.error) return;
		displayImage(result.html);
		imageCache[id] = result.html;
	});

	return true;
}

function displayImage(html) {
	$('.imageContainer').hide().html(html);
	$('.imageContainer img').load(function() {
		$('.imageContainer').fadeIn(100)
	});
}

function prevPage() {
	scrollToImg = scrollToImg - visibleImages;
	if(scrollToImg < 0) scrollToImg = 0;
	scrollImagesTo(scrollToImg);
}

function nextPage() {
	scrollToImg = scrollToImg + visibleImages;
	if(scrollToImg > (totalImages - visibleImages)) scrollToImg = totalImages - visibleImages;
	scrollImagesTo(scrollToImg);
}

function scrollImagesTo(scrollToImg) {
	if(scrollToImg > (totalImages - visibleImages)) scrollToImg = totalImages - visibleImages;
	px = 0 - (imageWidth * scrollToImg) + imageBorder;
	if(px > 0) px = imageBorder;
	thisPos = $('#imageFlow').position();
	if(thisPos.left == imageBorder && px == imageBorder) {
		$('#imageFlow').css({'left':px});
	} else {
		$('#imageFlow').animate({'left':px},100);
	}
}
