jQuery(function() {
	
	addThumbnailsPageNav();
	$('#thumbnails').addClass('scrollable');
		
	$("#thumbnails").scrollable({ 
   		size: 1, 
    	vertical: false, 
		prev:'a.previous',     
		next:'a.next', 
		activeClass:'selected', 
		items: 'div.items',
		navi: '.navi'
		
	});
	
	$('#thumbnails .items a').click(function() {
		$('#thumbnails .items a').removeClass('selected');
		$(this).addClass('selected');
		var src = $('img', this).attr('src').replace('-tn', '');
		$('#picture-frame img').attr('src', src);
		$('#picture-frame span').css('width', 'auto');
		$('#image-info').empty();
		//$('#image-info').fadeTo(1,0);
		$.get($(this).attr('href'), function(data) {
			var blurb = $('#image-info', data);
			$('#image-info').html(blurb);
			//$('#image-info').fadeTo(400,1);
		});
		return false;
	});
	
	gotoThumbnailPage();
	
});




function addThumbnailsPageNav() {
	var pages = 0;
	var num = $('#thumbnails .items a').length;	
	pages = Math.ceil(num / 16);
	w = 0;
	if (pages > 0) {
		$('#thumbnails').append('<div class="navi"></div>');
		for (var i = 0; i < pages; i++) {
			$('.navi').append('<span>' + (i + 1) + '</span>');
			w += 12;
		}
		
		$('.navi').css('padding-left', Math.ceil((378 - w) / 2) + 'px');
	}
}


function gotoThumbnailPage() {
	var pages = $('.items .page');
	for (var i = 0; i < pages.length; i++) {
		if ($('.selected', pages[i]).length > 0) {
			return;
		} else {
			$('#thumbnails').scrollable().next();
		}
	}							
}