/* Popup Utils

 * Last Update: September 2, 2008(Alex)

 * Description:
   Utilities needed for a popup
	
 * Dependencies:
   - Requires: jquery.js, jquery.dimensions.js, images/dc_BtnClosePopup.gif
   - Used with: iframe_popup.js
	
 * Modules:	
	- viewport
		utility used for getting the dimensions of the visible area displayed currently on the screen, for positioning the popup relatively to it
	- dc_ ... (dynamically created)
		PopupIframe
			an IFRAME created dynamically to be displayed as a popup IFRAME
		PopupCloseBtn
			the close button of the popup IFRAME
		WaitPopup
			the message displayed while popup is loading
		ViewportMask
			the viewport mask displayed under the popup layer
		
		Each dc_ module functions separately. The popup dependencies are linked to the popup using the rel attribute, having the name of the IFRAME as value
 */
jQuery.extend({
	// viewport
	viewport:
		{
			width : function()	
						{
							if(self.innerWidth)
								return self.innerWidth
							else if(document.documentElement && document.documentElement.clientWidth)
								return document.documentElement.clientWidth
							else if(document.body)
								return  document.body.clientWidth
						},
						
			height : function()	
						{
							if(self.innerHeight)
								return self.innerHeight
							else if(document.documentElement && document.documentElement.clientHeight)
								return document.documentElement.clientHeight
							else if(document.body)
								return  document.body.clientHeight
						}
		},

	/* 
	- popupIframeName
		the name of the IFRAME; used for the "target" attribute of the trigger links, and also for the popup dependencies, identified using rel="[popupIframeName]"
	- popupIframeClass
		the CSS class associated to the popup, defined in external stylesheet
	- popupDefaultSrc
		the default source of the popup
	- popupWidth
		the width of the popup IFRAME
	- popupHeight
		the height of the popup IFRAME
	- popupLeft: viewportCenter/parentNodeCenter/precise value
		the left position of the popup
	- popupTop: viewportCenter/parentNodeCenter/precise value
		the top position of the popup
	- popupParentNode
		the popup parent node, given as jQuery object. All the elements dynamically created(popup IFRAME, popup close button, wait message, popup mask) will be appended to this node. Default: body node
	*/
	dc_PopupIframe: function(settings)
					{
						settings = jQuery.extend({
												  popupIframeName: 'dc_PopupIframe',
													popupIframeClass: 'dc_PopupIframe',
													popupDefaultSrc: '',
													
												  popupWidth: 400,
												  popupHeight: 300,
												 
												  popupLeft: 'viewportCenter',
												  popupTop: 'viewportCenter',			
													
												  popupParentNode: 'body'
												 }, settings);
												 
						var popupParentNode = jQuery(settings.popupParentNode);
						
						// calculate popup position
						if (settings.popupLeft == 'viewportCenter') // positioning relatively to viewport
							var posX = Math.round((jQuery(window).width() - settings.popupWidth)/2) + 'px'
						else if(settings.popupLeft == 'parentNodeCenter') // positioning relatively to parent node
							var posX = Math.round((popupParentNode.width() - settings.popupWidth)/2) + 'px'
						else // precise positioning 
							var posX = settings.popupLeft;
							
						if (settings.popupTop == 'viewportCenter') // positioning relatively to viewport
							var posY = Math.round(jQuery(window).scrollTop() + (jQuery.viewport.height() - settings.popupHeight)/2) + 'px'
						else if(settings.popupTop == 'parentNodeCenter') // positioning relatively to parent node
							var posY = Math.round(popupParentNode.scrollTop() + (popupParentNode.height() - settings.popupHeight)/2) + 'px'
						else // precise positioning 
							var posY = settings.popupTop;
						
						// create iframe popup
						var dcpi = jQuery('<iframe name="' + settings.popupIframeName + '" src="' + settings.popupDefaultSrc + '" marginheight="0" marginwidth="0" frameborder="0" allowtransparency="true" scrolling="no"></iframe>')
											.attr('class', settings.popupIframeClass)
											.css({
													width: settings.popupWidth + 'px',
													height: settings.popupHeight + 'px',
													left: posX,
													top: posY,
													visibility: 'hidden'
												})
											.appendTo(popupParentNode);
						
						// create methods for showing/hiding popup
						dcpi.extend({									   
										off: function()
													{
														jQuery(this).css('visibility', 'hidden')
													},
													
										on: function()
													{
														jQuery(this).css('visibility', 'visible')
													}
									})
						return dcpi;
					},
					
	/*			
	- popupCloseButton: true/false
		flag for showing close button
	- popupCloseButtonID
		the ID of the popup close button. The button is dynamically created
	- popupCloseButtonClass
		the CSS class associated to the popup close button, defined in external stylesheet
	- popupParentNode
		the popup parent node, given as jQuery object. All the elements dynamically created(popup IFRAME, popup close button, wait message, popup mask) will be appended to this node. Default: body node
	- triggerDynamicClass
		the name of the CSS class associated to the trigger when clicked on. Used for manipulating the "selected" state
	- triggerSelectionClass
		the name of the CSS class associated with the trigger when the popup is opened. Default: "selected".
	- disabledElementsClass
		the name of the CSS class associated with the elements disabled when the popup is open. Example: select elements. The class is used to hide/show elements dynamically
	- whenClicked
		function called when the close button is clicked on
	*/
	dc_PopupCloseBtn: function(settings)
						{
						settings = jQuery.extend({
												 	popupIframeName: 'dc_PopupIframe',
													
													popupCloseButtonID: 'dc_PopupCloseButton',
													popupCloseButtonClass: 'dc_PopupCloseButton',
													
													popupParentNode: 'body',
													
													triggerDynamicClass: 'dc_PopupTrigger',
													triggerSelectionClass: 'selected',
													disabledElementsClass: 'disabledByPopup',
													
													whenClicked: function()
															 {
																// remove selection class from the trigger
																jQuery('.' + dcp.settings.triggerDynamicClass)
																	.removeClass(dcp.settings.triggerSelectionClass);
																
																// remove popup and popup dependencies
																 jQuery('iframe[name=' + dcp.settings.popupIframeName + ']')
																	.add('[rel=' + dcp.settings.popupIframeName + ']')
																	.remove();
																
																// make elements disabled by popup visible
																jQuery('.'+ dcp.settings.disabledElementsClass)
																	.removeClass(dcp.settings.disabledElementsClass)
																	.css('visibility', 'visible')
															 }
												  },
												  settings);
													
						var popupParentNode = jQuery(settings.popupParentNode);
						
						// identify the popup iframe, for positioning
						var popup = jQuery('iframe[name=' + settings.popupIframeName + ']');
						
						// create close button
						var closeBtn = jQuery('<a href="#" id="' + settings.popupCloseButtonID + '" rel="' + settings.popupIframeName + '">close</a>');
						closeBtn
							.attr('class', settings.popupCloseButtonClass)
							.css({ // position on the top right corner on the popup
									left: parseInt(popup.css('left')) +
												popup.width() + 
												(parseInt(popup.css('border-left-width'))||0) +
												(parseInt(popup.css('margin-left'))||0) +
												'px',
												
									top: parseInt(popup.css('top')) + 
											(parseInt(popup.css('border-top-width'))||0) + 
											(parseInt(popup.css('margin-top'))||0) +
											'px',
									visibility: 'hidden'
								})
							.click(function(){
												settings.whenClicked.call();
												return false;
											 })
							.appendTo(popupParentNode)
							.css({ // reposition on the top right corner based on the button dimensions (available after the node is appended to document)
											left: parseInt(closeBtn.css('left')) - closeBtn.width() + 'px'
										})
							
							// create methods for showing/hiding close button							
							closeBtn
								.extend({
													on: function()
																{
																	var btn = jQuery(this);
																	btn.css('visibility', 'visible');
																},
													off: function()
																{
																	var btn = jQuery(this);
																	btn.css('visibility', 'hidden');
																}
												})												
							return closeBtn
					},
	/*												
		- popupWaitMessage
			flag for showing wait message 
		- popupWaitID
			the ID of the div displayed as "wait message". The div is dynamically created
		- popupWaitClass
			the CSS class associated to the popup wait message div, defined in external stylesheet
		- popupWaitMessageText
			the text within the wait box
	*/
	dc_PopupWaitMessage: function(settings)
					{
						settings = jQuery.extend({
																		 	popupIframeName: 'dc_PopupIframe',
																			
																			popupWaitID: 'dc_PopupWaitMessage',
																			popupWaitClass: 'dc_PopupWaitMessage',
																			popupWaitMessageText: 'Please wait...',
																			
																			popupParentNode: 'body'
																	  }, settings);
																		
						var popupParentNode = jQuery(settings.popupParentNode);
						
						// identify the popup iframe, for positioning
						var popup = jQuery('iframe[name=' + settings.popupIframeName + ']');
						
						// created "please wait" div
						var dcwp = jQuery('<div id="' + settings.popupWaitID + '" rel="' + settings.popupIframeName + '">' + settings.popupWaitMessageText + '</div>')
												.attr('class', settings.popupWaitClass)
												.css({// position on the center of the popup
														left: parseInt(popup.css('left')) +
																	parseInt(popup.width())/2 + 
																	(parseInt(popup.css('border-left-width'))||0) +
																	(parseInt(popup.css('margin-left'))||0) +
																	'px',
																	
														top: parseInt(popup.css('top')) + 
																 parseInt(popup.height())/2 + 
																 (parseInt(popup.css('border-top-width'))||0) + 
																 (parseInt(popup.css('margin-top'))||0) +
																'px',
														
														visibility: 'hidden'
													})
												.appendTo(popupParentNode);
						
						dcwp.css({ // reposition on center based on the box dimensions (available after the node is appended to document)
												left: parseInt(dcwp.css('left')) - dcwp.width()/2 + 'px',
												top: parseInt(dcwp.css('top')) - dcwp.height()/2 + 'px'
										});
										
						// create methods for showing/hiding close button	
						dcwp.extend({	
									off: function()
											{
												var wL = jQuery(this);
												wL.fadeTo('fast', 0.1, function(){jQuery(this).css('visibility', 'hidden')});
											},
												
									on: function()
												{
													var wL = jQuery(this);
													wL.css({
																opacity: 0.1,
																visibility: ''
															 })
														.fadeTo('fast', 1);
												}
								   });
						return dcwp;
					},
					
	/*
	- popupMask
		flag for showing popup mask
	- popupMaskID
		the ID of the div blocking other content interaction outside the popup. Dynamically created.
	- popupMaskClass
		the CSS class associated to the popup wait mask, defined in external stylesheet
	- popupMaskOpacity
		the opacity of the mask
	*/
	dc_ViewportMask: function(settings)
					{
						settings = jQuery.extend({
																				popupIframeName: 'dc_PopupIframe',
																				
																				popupMaskID: 'dc_ViewportMask',
																				popupMaskClass: 'dc_ViewportMask',
																				popupMaskOpacity: 0.8,
																				
																				popupParentNode: 'body',
																				whenClicked: function(){},
																				disabledElementsClass: 'disabledByMask'
																		  },
																		  settings);
						
						var popupParentNode = jQuery(settings.popupParentNode);
						
						var maskWidth = popupParentNode.width() + 
														(parseInt(popupParentNode.css('padding-left')) || 0) + 
														(parseInt(popupParentNode.css('padding-right')) || 0) + 
														'px';
														
						if (settings.popupParentNode == 'body')
							var maskHeight = Math.max(jQuery(window).height(), jQuery(document).height()) + 'px'
						else
							var maskHeight = popupParentNode.height() + 
															(parseInt(popupParentNode.css('padding-top')) || 0) + 
															(parseInt(popupParentNode.css('padding-bottom')) || 0) + 
															'px';
						
						// create  mask
						var dcvm = jQuery('<div id="' + settings.popupMaskID + '" rel="' + settings.popupIframeName + '"></div>')
											.attr('class', settings.popupMaskClass)
											.css({ // get same size as parent node
													width: maskWidth, 
													height: maskHeight,
													opacity: settings.popupMaskOpacity,
													visibility: 'hidden'
												})
												.click(function()
													{
														settings.whenClicked.call();
													})
											.appendTo(popupParentNode);
											
						// create methods for showing/hiding close button	
						dcvm.extend({
										off: function()
												{
													var vm = jQuery(this);
													vm.css('visibility', 'hidden');
													jQuery('.' + settings.disabledElementsClass)
														.css('visibility', 'visible')
														.removeClass(settings.disabledElementsClass);
												},
													
										on: function()
												{
													var vm = jQuery(this);
													vm.css('visibility', '');
													jQuery('select')
														.css('visibility', 'hidden')
														.addClass(settings.disabledElementsClass);
												}
									   });	
						return dcvm;
					}
})