// JavaScript Document// JavaScript Document
$(document).ready(function() {
	$('div.fl, div.fr').mouseenter(function() {
		$(this).append('<div class="imgHover">Click to view full image</div>');
		$('.imgHover').css({ opacity: 0, display: 'inline'}).animate({opacity: 0.7 }, 500);
	}).mouseleave(function() {
		$('.imgHover').animate({opacity: 0}, 500, function() { $(this).remove();});
	}).click(function() {
		var imgSrc = $(this).attr('id');
		var img = new Image();
		
		$(img).load(function() {
			$('body').prepend('<div id="fullImg"></div>');
			$('body').prepend('<div id="screen"></div>');
			var width = $(document).width();
			var height = $(document).height();
			$('div#screen').css({ width: width, height: height, display: 'inline'}).animate({opacity: 0.7}, 500);
			$('div#fullImg').css({ opacity: 0, display: 'inline'});
			$('#fullImg').append(this);
			var imgHeight = $('#fullImg img').height();
			
			if(imgHeight > (height - 30)) {
				$('div#fullImg img').css('height', (height - 50) + 'px');
			}
			
			var imgWidth = $('#fullImg img').width();
			
			if(width > imgWidth) {
				var pos = (width - imgWidth)/2;	
			} else {
				var pos = 20;
			}
	
			$('div#fullImg').css('left', pos + 'px').animate({ opacity : 1.0 }, 500);
			
			$('div#fullImg').prepend('<div id="fullImgCaption">Click anywhere to close...</div>');
		
			$('div#fullImg, #screen').click(function() {
				$('div#fullImg').fadeOut(200, function() { $('#fullImg').remove(); $('#screen').fadeOut(200, function() { $(this).remove(); }); });
			});
		})
		.attr('src', '/inc/img/brochure/' + imgSrc);
	});
});