
(function($){
	$.fn.extend({
		photoModalPanel: function(photoSrc, photoTitle, photoLink) {
			//Create our overlay object
			var photoOverlay = $("<div id='photo-modal-overlay'></div>");
			//Create our modal window
			var photoModalWindow = $("<div id='photo-modal-window'></div>");
			
			//function showPhotoOverlay() {
			return this.each(function() {
					
				if (typeof document.body.style.maxHeight === "undefined") { //if IE 6
					$("body","html").css({height: "100%", width: "100%"});
					$("html").css("overflow","hidden");
				}
				
				//Append the overlay to the document body
				$("body").append(photoOverlay.click(function() { photoModalHide(); }))
				//Add a loader to our page
				$("body").append("<div id='photo-modal-load'></div>");
				
				//Set the css and fade in our overlay
				photoOverlay.css("opacity", 0.8);
				photoOverlay.fadeIn(150);
				
				
				//Load the image
				var img = new Image();
				$(img).load(function () {
					var imageWidth = img.width / 2 ;
					var imageHeight = img.height / 2;
					photoModalWindow.css({
						"margin-left": -imageWidth,
						"margin-top": -imageHeight
					});	
					$("#photo-modal-load").remove();
					photoModalWindow.append(img);
					$(this).addClass("modal-image");
					
					photoModalWindow.append("<div id='photo-modal-title'><a href='" + photoLink + "' target='_blank'>" + photoTitle + "</a></div>");
					
					$("body").append(photoModalWindow);
					photoModalWindow.fadeIn(150);
				})
				.attr({ src: photoSrc }).click(function() {
					photoModalHide();
				});
			});
			
			//Our function for hiding the modalbox
			function photoModalHide() {
				var remove = function() { $(this).remove(); };
				photoOverlay.fadeOut(remove);
				photoModalWindow
					.fadeOut(remove)
					.empty();
			}
			
		}
	});
})(jQuery);