jQuery.extend({
	/**
	 * Loads the content of a URL in a lightbox style popup in the centre of the screen
	 *
	 * Available options:
	 * string			url				URL of remote script to retrieve content from
	 * string			type			Method of AJAX call (GET or POST)
	 * mixed			width			Width of content area (leave as 'auto' to automatically detect)
	 * mixed			height			Height of content area (leave as 'auto' to automatically detect)
	 * object			data			Any data (GET or POST) to send to the remote script whwn requesting content
	 * function			beforeSend		Callback function used before the AJAX request is made
	 * function			onComplete		Callback function used when the AJAX request is complete and the popup content is loaded
	 * function			onError			Callback function used incase of an AJAX error
	 * function			onClose			Callback function used when popup is closed
	 * global			boolean			Whether to trigger global AJAX event handlers for this request
	 * float			maskColor		Colour of overlay
	 * float			maskOpacity		Opacity to set overlay at
	 */
	loadPopup : function(config) {
		// Our default config options
		var configDefaults={
			'url'			:		'',
			'type'			:		'GET',
			'width'			:		'auto',
			'height'		:		'auto',
			'data'			:		{},
			'beforeSend'	:		function() {},
			'onComplete'	:		function() {},
			'onError'		:		function() {},
			'onClose'		:		function() {},
			'global'		:		true,
			'maskColour'	:		'#000000',	
			'maskOpacity'	:		0.3
		}
		// Extend the specified config with our defaults to form our parameters for this popup
		var params = $.extend({}, configDefaults, config);
		$.ajax({
			'url'			:		params.url,
			'type'			:		params.type,
			'data'			:		params.data,
			'beforeSend'	:		params.beforeSend,
			'error'			:		params.onError,
			'success'		:		function(popupHTML) {
				// Remove any existing popup iframes
				$('#popup_wrap').remove();
				// Append an iframe to our body
				$('body').append('<div id="popup_wrap"><div id="popup_mask"></div><div id="popup_iframe">'+popupHTML+'</div></div>');
				// Check whether we are using IE6 (if not we can use position: fixed for optimal results)
				var IE6=/MSIE 6/i.test(navigator.userAgent) ? true : false;
				
				function positionPopupItems() {
					
					var popupHeight		= params.height=='auto'	? $('#popup_iframe').children().outerHeight() 	: params.height;
					var popupWidth		= params.width=='auto'	? $('#popup_iframe').children().outerWidth()	: params.width;
					
					if(IE6) {
						// Grab some window properties
						var yScroll			= $(window).scrollTop();
						var xScroll			= $(window).scrollLeft();
						var windowHeight	= $(window).height();
						var windowWidth		= $(window).width();
						
						// Set our mask properties
						var maskPosition	= 'absolute';
						var maskTop			= yScroll;
						var maskLeft		= xScroll;
						var maskHeight		= windowHeight;
						var maskWidth		= windowWidth;
						
						// Set our popup properties
						var popupTop		= yScroll+((windowHeight/2)-(popupHeight/2));
						var popupLeft		= xScroll+((windowWidth/2)-(popupWidth/2));
						
						// Define mask CSS styles (specific to IE6 browser)
						var maskStylesBrowser = {
							'position'		:		'absolute',
							'top'			:		maskTop + 'px',
							'left'			:		maskLeft + 'px',
							'height'		:		maskHeight + 'px',
							'width'			:		maskWidth + 'px'
						};
						
						// Define popup CSS styles (specific to IE6 browser)
						var popupStylesBrowser = {
							'position'		:		'absolute',
							'left'			:		popupLeft + 'px',
							'top'			:		popupTop + 'px'
						};
					} else {
						var popupLeftMargin = -popupWidth/2;
						var popupTopMargin 	= -popupHeight/2;

						// Define mask CSS styles (specific to non-IE6 browsers)
						var maskStylesBrowser = {
							'position'		:		'fixed',
							'top'			:		'0px',
							'right'			:		'0px',
							'bottom'		:		'0px',
							'left'			:		'0px'
						};
						
						// Define popup CSS styles (specific to non-IE6 browsers)
						var popupStylesBrowser = {
							'position'		:		'fixed',
							'top'			:		'50%',
							'left'			:		'50%',
							'margin-left'	:		popupLeftMargin + 'px',
							'margin-top'	:		popupTopMargin + 'px'
						};
					}
					
					var maskStylesAll = {
						'background'		:		params.maskColour,
						'opacity'			:		params.maskOpacity,
						'z-index'			:		998
					}
					var popupStylesAll = {
						'width'			:		popupWidth + 'px',
						'height'		:		popupHeight + 'px',					
						'z-index'		:		999
					}
					// Marge our browser specific and non-browser specific styles together
					var maskStyles = $.extend({}, maskStylesAll, maskStylesBrowser);
					var popupStyles = $.extend({}, popupStylesAll, popupStylesBrowser);
					
					// Update CSS properties of both items
					$('#popup_mask').css(maskStyles);
					$('#popup_iframe').css(popupStyles);
				}
				// Position our popup and mask initially
				positionPopupItems();
				
				// Execute our completion callback if one was specified
				if($.isFunction(params.onComplete)) {
					params.onComplete();
				}
				
				if(IE6) {
					// Maintain our popup position after page scroll
					$(window).scroll(function() {
						positionPopupItems();
					});
					// Maintain our popup position after page resize
					$(window).resize(function() {
						positionPopupItems();
					});
				}
				
				$('#popup_mask').click(function() {
					// Remove our popup content
					$('#popup_wrap').remove();
					// Execute our close callback if one was specified
					if($.isFunction(params.onClose)) {
						params.onClose();
					}
				});
			}
		});	
	}
});
