// JQuery Lightbox effects
// links with a class attribute of "lightbox" will be loaded in the lightbox effect

// This needs to be in the JQuery load but I want the luxury of modular development; this include file
function setupLightboxEffect() {
	var isIE = (-1 < (navigator.userAgent).indexOf("MSIE"));  //IE seems to have trouble displaying the image, so we will degrade
	if (isIE)
		return true;
	$('a.lightbox').click(function(e) {
		//hide scrollbars!
		$('body').css('overflow-y', 'hidden');
		
		$('<div id="overlay"></div>')
		.css('top', $(document).scrollTop())
		.css('opacity', '0')
		.animate({'opacity': LIGHTBOX_OPACITY}, 'slow')
		.appendTo('body');
	
		$('<div id="lightbox"></div>')
		.hide()
		.appendTo('body');


		//there is a bug where this 'img' gets appended a second time
		if ($('#lightbox img').length > 0)
			return false;
			
		//changing the 'href' in this section will permit you to load an image different than the one being clicked
		$('<img />', {
			src: ($(this).attr('imgref')) ? $(this).attr('imgref') : $(this).attr('href'),
			load: function() {
				positionLightboxImage();
			},
			click: function() {
				removeLightbox();
			}
			}).appendTo('#lightbox');
			var FACEBOOK_LIKE_CODE = "<!-- Facebook 'Like' button --><iframe src=\"http://www.facebook.com/plugins/like.php?href=www.mentallic.com/" + $(this).attr('href') + "\" scrolling=\"no\" frameborder=\"0\" style=\"border:none; width:450px; height:80px\"><iframe>";
			$(FACEBOOK_LIKE_CODE).appendTo('#lightbox');
			
		return false;
	});
}

function positionLightboxImage() {
	var top = ($(window).height() - $('#lightbox').height()) / 2;
	var left = ($(window).width() - $('#lightbox').width()) / 2;
	$('#lightbox')
		.css({
			 'top': top + $(document).scrollTop(),
			 'left': left,
		 }).fadeIn();
}
function removeLightbox() {
	$('#overlay, #lightbox')
		.fadeOut('slow', function() {
			$(this).remove();
			$('body').css('overflow-y', 'auto'); //show scrollbars!
	  });
}