jQuery.extend({
	/**
	 * Creates a custom popup window capable of displaying a specified message and unlimited buttons with custom events
	 * attached
	 *
	 * @author		Alex Kaye 13/05/09
	 * @param		object		config		Config object to change performance of popup. See defaults for available methods
	 * @param		mixed		buttons		Object of array of objects with button information. See defaults for available methods
	 */

	popup : function(config, buttons) {
		var config_defaults={
			'title'			:	'',
			'content'		:	'Are you sure you want to do this?',
			'speed'			:	'fast',
			'popupClass'	:	'normal',
			'draggable'		:	false,
			'closeable'		:	true,
			'closeButton'	:	'<img src="/graphics/popups/close-button.png" alt="Close" />',
			'height'		:	'auto',
			'width'			:	460,
			'maskColour'	:	'#000000',
			'maskOpacity'	:	0.4,
			'popupOpacity'	:	1,
			'onStart'		:	null,
			'onLoad'		:	null,
			'onClose'		:	null,
			'onComplete'	:	null,
			'onUnload'		:	null
		};
		var button_defaults={
			'label'			:	'OK',
			'buttonClass'	:	'small_button',
			'action'		:	null,
			'closePopup'	:	true
		};
	
		// Apply defaults to any unset properties for this button
		var config=$.extend({}, config_defaults, config);

		function closePopup(callback) {
			popup.hide();
			mask.fadeOut(config.speed, function() {
				$('#popup, #mask').remove();
				if($.isFunction(callback)) {
					callback();
				}
				if($.isFunction(config.onUnload)) {
					config.onUnload();
				}					
			});
		}
		
		var closeButton=''
		if(config.closeable) {
			closeButton	='<a class="close_popup">'+config.closeButton+'</a>';
		}
		
		// Call any start events
		if($.isFunction(config.onStart)) {
			config.onStart();
		}
		// Append our mask and popup structure
		$('body').append('<div id="mask"></div><div id="popup" class="' + config.popupClass + ' clearfix"><div id="popup_title">' + closeButton + config.title + '</div><div id="popup_inner" class="clearfix">' + config.content + '</div></div>');
				
				var popup	= $('#popup');
				var mask	= $('#mask');
				
				// 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 popupWidth		= config.width=='auto'	? popup.outerWidth()		: config.width;
					var popupHeight		= config.height=='auto'	? popup.outerHeight()	: config.height;
					
					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'		:		config.maskColour,
						'opacity'			:		config.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
					mask.css(maskStyles);
					popup.css(popupStyles);
				}
				// Position our popup and mask initially
				positionPopupItems();
				if(IE6) {
					// Maintain our popup position after page scroll
					$(window).scroll(function() {
						positionPopupItems();
					});
					// Maintain our popup position after page resize
					$(window).resize(function() {
						positionPopupItems();
					});
				}


		// Fade in our mask and popup 
		mask.fadeTo(0,0);
		popup.hide();		
		mask.fadeTo(config.speed, config.maskOpacity, function() {
			popup.show();										   
		});

		// Add events to any close buttons
		$('#popup .close_popup').click(function() {
			closePopup(config.onClose);	
		});
		
		// Make popup draggable if specified
		if(config.draggable) {
			popup.draggable({ handle : '#popup_title' });
		}
		
		// Check whether we need to add any buttons
		if(buttons) {
			// Force our buttons value into an array 
			if(!$.isArray(buttons)) {
				// If so make it into an array containing the single button object
				buttons=[buttons];
			}
			// Loop through each button
			$.each(buttons, function(i) {
				// Apply defaults to any unset properties for this button
				var thisButton=$.extend({}, button_defaults, buttons[i]);
				
				// Create button container for first button
				if(i==0) {
					$('#popup_inner').append('<div id="popup_buttons" class="clearfix"></div>');	
				}
				if(thisButton.buttonClass) {
					var buttonClass=' class="'+thisButton.buttonClass+'"';	
				} else {
					var buttonClass='';
				}
				// Append the button to our popup
				$('#popup_buttons').append('<button'+buttonClass+'>' + thisButton.label + '</button>');
				// If an action has been associated with the buttons then create the event
				if(thisButton.action) {
					$('#popup button:last').click(thisButton.action);
				}
				// If the button closes the popup then create that event
				if(thisButton.closePopup) {
					$('#popup button:last').click(function() {
						closePopup();
						// Call our complete event function if one exists
						if($.isFunction(config.onComplete)) {
							// Pass the index of the button clicked
							config.onComplete(i);
						}
					});
				}
			});
		}
		
	}
});
