// -----------------------------------------------------------------------------------
//
//  Modal Popup Generator
//  requires Prototype and Scriptaculous
//
//	ModalPopup v0.1
//	by Nathan Bentley - http://pod1.com
//	18/09/2007
//
//	v0.101
//	by Steve Craig - :P
//	15/10/2007
//
//	getPageScroll() and getPageSize() taken from Lightbox v1.0
//
//
// -----------------------------------------------------------------------------------
/*
	var myModalPopup = new modalPopup('name_of_my_div');
	
	<a href="fallback_location" onclick="myModalPopup.show(); return false;">Show popup</a>

	<div id="name_of_my_div">
	My content goes here.
	<a href="fallback_location" onclick="myModalPopup.hide(); return false;">Hide popup</a>
	</div>

	But what does it do with select boxes???? Zanete 12-11-2007
*/
// -----------------------------------------------------------------------------------

var modalPopupCurrentId = '';

function modalPopup(modalPopupContentId, afterFinishFunction)
{
	this.modalPopupContentId = modalPopupContentId;
	this.afterFinishFunction = afterFinishFunction;
	this.hideOnClick = false;
	this.transitionDuration = 0.3;
	this.minimumTopMargin = 10;
	this.settings = $H( {} );
	this.overlayId = 'overlay';
}

modalPopup.prototype.afterFinish = function (afterFinishFunction)
{
	this.afterFinishFunction = afterFinishFunction;
}

modalPopup.prototype.afterClose = function (afterCloseFunction)
{
	this.afterCloseFunction = afterCloseFunction;
}

modalPopup.prototype.setPopupContentId = function (modalPopupContentId)
{
	this.modalPopupContentId = modalPopupContentId;
}

modalPopup.prototype.setOverlayId = function (OverlayId)
{
	this.overlayId = OverlayId;
}

modalPopup.prototype.hideWhenClicked = function (status)
{
	this.hideOnClickFlag = status;
	this.settings.merge( { hideOnClickFlag : status } );
}	

modalPopup.prototype.setTransitionDuration = function (duration)
{
	this.transitionDuration = duration;
	this.settings.merge( { transitionDuration : duration } );
}	

modalPopup.prototype.show = function ()
{
	
	modalPopupCurrentId = this.modalPopupContentId;
	
	transitionDuration = this.transitionDuration;
	
	var modelBorderWidth = 10;
	var objModalDialog = $('modalPopupBox');
	var objModalContent = $(this.modalPopupContentId);
	
	if( document.getElementById(this.modalPopupContentId) == null)
	{
		return false;
	}
	
	// Check if we have an exclusionArray (set with instantiating this modalPopup object).
	// exclusionArray is used indicate 'problem' elements (e.g. SELECT and Flash) we do NOT 
	// want to change the display style of (hide/show).
	ExclusionArray = (typeof(this.exclusionArray) != 'undefined' ? this.exclusionArray : undefined);
	hideOverlayedElements(ExclusionArray);
	
	var objBody = document.getElementsByTagName("body").item(0);
	
	var objOverlay = document.createElement("div");
	objOverlay.setAttribute('id',this.overlayId);
	// commented out so that box ignores overlay clicking
	
	thisSelf = this;
	
	if(this.hideOnClickFlag == true)
	{
		objOverlay.onclick = function () { thisSelf.hide(); }
	}
	
	objOverlay.style.display = 'none';
	objOverlay.style.position = 'absolute';
	objOverlay.style.top = '0';
	objOverlay.style.left = '0';
	objOverlay.style.zIndex = '990';
	objOverlay.style.width = '100%';
	objBody.insertBefore(objOverlay, objBody.firstChild);
	
	// prep objects
	var objOverlay = $(this.overlayId);
	
	var arrayPageSize = getPageSize();
	var arrayPageScroll = getPageScroll();

	// set height of Overlay to take up whole page and show
	objOverlay.style.height = (arrayPageSize[1] + 'px');
	objOverlay.style.display = 'block';
	
	objModalDialog.style.display = "block";
	
	objModalDialog.appendChild(objModalContent);
	
	objModalContent.show();


	modalOriginalHeight =  parseFloat(objModalContent.offsetHeight);
	modalOriginalWidth = parseFloat(objModalContent.offsetWidth);

	objModalContent.hide();
	
	objModalContent.setStyle( { height : modalOriginalHeight,  width : modalOriginalWidth } );
	
	objModalDialog.setStyle( {height: (modalOriginalHeight / 2) + 'px' } );
	objModalDialog.style.width = (modalOriginalWidth / 2) + 'px';

	Scale = 200;
	
	var modalBoxTop = arrayPageScroll[1] + ((arrayPageSize[3] - ( ( modalOriginalHeight + modelBorderWidth)  / 2)) / 2);
	var modalBoxLeft = ((arrayPageSize[0]  - ( ( modalOriginalWidth + modelBorderWidth)  / 2)) / 2);

	var predictedTopAtFinish =  modalBoxTop - (modalOriginalHeight / 4);
	
	if(predictedTopAtFinish < this.minimumTopMargin)
	{
		modalBoxTop = (modalOriginalHeight / 4) + this.minimumTopMargin;
	}
	
	objModalDialog.style.top = (modalBoxTop < 0) ? "0px" : modalBoxTop + "px";
	objModalDialog.style.left = (modalBoxLeft < 0) ? "0px" : modalBoxLeft + "px";
	
	
	
	if(typeof(this.afterFinishFunction) == 'function')
	{
		
		var afterFinishFunction = this.afterFinishFunction;
	}
	
	new Effect.Appear(objModalDialog,{ duration: transitionDuration } );

	new Effect.Scale(objModalDialog, Scale, 
					{
						scaleX: false,
						scaleContent: false,
						duration: transitionDuration,
						scaleFromCenter: true,
						queue: 'front',
						scaleMode: {
							originalWidth: (modalOriginalWidth / 2),
							originalHeight: (modalOriginalHeight / 2)
						}
					});
	new Effect.Scale(objModalDialog, Scale, 
					 {
						 scaleY: false, 
						 scaleContent: false, 
						 delay: 0, 
						 scaleFromCenter: true, 
						 duration: transitionDuration,
						 afterFinish : function () {
							
								Effect.Appear(objModalContent, { duration: transitionDuration,
																 queue: 'front',
																 afterFinish : function () {
																 	thisSelf.currentX = parseFloat(objModalContent.offsetWidth);
																	thisSelf.currentY = parseFloat(objModalContent.offsetHeight);
																 }
																} );
								/*
									Added by Tom
									Forcing the height of the dialog causes problems if you change
									the content within it (eg some forms). So, after scriptaculous has done
									its stuff, change the height declaration to a min-height, so that the
									box has a fluid width.
								*/
								objModalDialog.setStyle({'min-height': objModalDialog.getStyle('height')});
								objModalDialog.setStyle({'height': ''});
								if(typeof(afterFinishFunction) == 'function')
								{
									afterFinishFunction();
								}
																
						 },
						 scaleMode: {
							originalWidth: (modalOriginalWidth / 2),
							originalHeight: (modalOriginalHeight / 2)
						}
					});
					

	
}



modalPopup.prototype.transformSize = function (newX, newY, settings)
{
	

	
	var objModalContent = $(this.modalPopupContentId);
	
	if(typeof(newX) == 'undefined')
	{
		newX = objModalContent.offsetWidth;
		newY = objModalContent.offsetHeight;
	}
	
	var objModalDialog = $('modalPopupBox');

	modelBorderWidth = 10;
	
	settings = $H().merge(settings);
		
	
	if(typeof(this.currentX) == 'undefined')
	{
		this.currentX = objModalDialog.offsetWidth;
		this.currentY = objModalDialog.offsetHeight;
	}

	currentX = this.currentX;
	currentY = this.currentY;

	
	
	scaleX = 100 / currentX * newX;
	scaleY = 100 / currentY * newY;
	
	this.currentX = newX;
	this.currentY = newY;
	
	modalPopupContentId = this.modalPopupContentId;

	var arrayPageSize = getPageSize();
	var arrayPageScroll = getPageScroll();

	var pageScrollY = arrayPageScroll[1];
	var pageHeight = arrayPageSize[3];
	var pageWidth = arrayPageSize[0];
	
	var modalBoxTop = pageScrollY 
					  + (pageHeight / 2)
					  - ((newY  + modelBorderWidth)  / (2 * (scaleY / 100)));

	var modalBoxLeft = ((pageWidth  - ( ( newX + modelBorderWidth)  / 2)) / 2) + (currentX /2);

	var predictedTopAtFinish = pageScrollY 
							   + (pageHeight / 2)
							   - ((newY  + modelBorderWidth) / 2);


//	alert('pageScroll: ' + pageScrollY + '\n'
//	+'modalBoxTop: ' + modalBoxTop + '\n'
//	+'modalBoxLeft: ' + modalBoxLeft + '\n'
//	+'scaleY: ' + (scaleY / 100)  + '\n'
//	+'currentY: ' + currentY + '\n'
//	+'newY: ' + newY + '\n'
//	+'predictedTopAtFinish: ' + predictedTopAtFinish + '\n');

	
	if(predictedTopAtFinish < this.minimumTopMargin)
	{
		modalBoxTop = (newY / 4) + this.minimumTopMargin;
	}
	
	objModalDialog.style.top = (modalBoxTop < 0) ? "0px" : modalBoxTop + "px";
	
	new Effect.Scale(objModalDialog, scaleY, 
					{
						scaleX: false,
						scaleContent: false,
						duration: transitionDuration,
						scaleFromCenter: true,
						queue: 'front',
						scaleMode: {
							originalWidth: currentX,
							originalHeight: currentY
						}
					});
	new Effect.Scale(objModalDialog, scaleX, 
					 {
						 scaleY: false, 
						 scaleContent: false, 
						 delay: 0, 
						 scaleFromCenter: true, 
						 duration: transitionDuration,
						 afterFinish: function () {
						 		
//						 	 alert(objModalDialog.offsetTop);
//						 	if((objModalDialog.offsetTop) < 1)
//						 	{
//						 		alert('wrong');
//						 	}
						 	
						 	if(typeof(settings.afterFinish) == 'function')
						 	{
						 		settings.afterFinish();
						 	}
						 },
						 scaleMode: {
							originalWidth: currentX,
							originalHeight: currentY
						}
					});
	
	
}


modalPopup.prototype.hide = function ()
{
	// get objects
	objOverlay = $(this.overlayId);
	objModalDialog = $('modalPopupBox');
	modalPopupContentId = this.modalPopupContentId;
	
	Effect.Fade(objModalDialog, { duration: transitionDuration,  queue: 'front'} );
	Effect.Fade(this.overlayId, {
				duration: 0,
				queue: 'end',
				afterFinish: function () {

						showOverlayedElements();
						$(modalPopupContentId).hide();
						$('modalPopupBox').setStyle( { opacity: '1', filter: 'alpha(opacity=100)' } );
						$('modalPopupBox').setStyle( { height: '', width: '' } );
						$('modalPopups').appendChild($(modalPopupContentId));		

						if(typeof(afterCloseFunction) == 'function')
						{
							afterCloseFunction();
						}
				
				}
				} );

}









//   ---   getPageScroll and getPageSize functions, taken from Lightbox v1.0    ---   //


function showOverlayedElements(){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(flashObjects[i].id) != 'undefined'
				&& ExclusionArray.indexOf(flashObjects[i].id) == -1))
		{
			flashObjects[i].style.visibility = "visible";
			flashObjects[i].style.display = "block";	
		}
	}

	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(flashEmbeds[i].id) != 'undefined'
				&& ExclusionArray.indexOf(flashEmbeds[i].id) == -1))
		{
			flashEmbeds[i].style.display = "block";	
		}
	}
	
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(selects[i].id) != 'undefined'
				&& ExclusionArray.indexOf(selects[i].id) == -1))
		{
			selects[i].style.visibility = "visible";
		}
	}
}

// ---------------------------------------------------

function hideOverlayedElements(ExclusionArray){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(flashObjects[i].id) != 'undefined'
				&& ExclusionArray.indexOf(flashObjects[i].id) == -1))
		{
			flashObjects[i].style.visibility = "hidden";
			flashObjects[i].style.display = "none";
		}
	}

	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(flashEmbeds[i].id) != 'undefined'
				&& ExclusionArray.indexOf(flashEmbeds[i].id) == -1))
		{
			flashEmbeds[i].style.display = "none";
		}
	}
	
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		if(typeof(ExclusionArray) == 'undefined'
			|| (typeof(ExclusionArray) == 'object'
				&& typeof(selects[i].id) != 'undefined'
				&& ExclusionArray.indexOf(selects[i].id) == -1))
		{
			selects[i].style.visibility = "hidden";
		}
	}

}


function getPageScroll(){

	var yScroll;

	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
	} else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
	} else if (document.body) {// all other Explorers
		yScroll = document.body.scrollTop;
	}

	arrayPageScroll = new Array('',yScroll) 
	return arrayPageScroll;
}

function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}

	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}

