﻿jQuery(function($) {
	var pg = $('.leGallery .pg').
		after('<a class="nextPage"></a>').
		before('<div id="leGalDisplay"></div><div id="leGalCaption"></div><a class="prevPage"></a>').
		scrollable({
			items: 'ul',
			size: 4,
			hover: true,
			onItemClick: function(item) {
				$('#leGalDisplay').addClass('loading');
				var imgUrl = item.find('a').attr('href');
				var thumb = item.find('img');
				var link = thumb.attr('longdesc');
				var credit = thumb.attr('alt');
				var cap = $('#leGalCaption').empty();
				
				var img = new Image();
				$(img)
					.load(function() {
						$(this).hide();
						$('#leGalDisplay').removeClass('loading').append(this);
						$(this).fadeIn("slow",function() { 
							cap.html(item.find('span').html());
							if ( link ) cap.prepend('<a href='+link+' target="_blank">Where is this photo?</a>');
							if (credit) cap.append('<i class="credit">'+credit+'</i>');
							cap.show("slow");
							$(this).prev().remove();
						});
					})
					//.error(function() { alert('Image not found or could not be loaded.'); })
					.attr( 'src', imgUrl);
			}
	});
	pg.find('li a').bind('click.scrollable', function(evt) { evt.preventDefault(); });
	var h =  pg.find('ul').height();
	pg.height(h);
	var h = $.browser.msie && parseInt( $.browser.version) <= 7 ? h/5 : h;
	pg.parent().height( h + 10 + pg.parent().height() );
	pg.scrollable().click(0);
});
