﻿/*
Popup

Created by: Paul O'Russa
Last Modified: 3/23/2007

Assists in making JavaScript-created popups.  Requires Tools.js and Debug.js.

To use, do something like:

In header:
	var popup = null;
	
	function loaded() {
		if (popup == null) {
			popup = new Popup();
		}
		
		popup.Background('mypopup', 'mycontent', 'white', 50);
		popup.PositionInside('mypopup');
		popup.Open('mypopup', null);
	}
	
In body:
<a href="javascript:popup.Open('mypopup', 'mylink')" id="mylink">Open Popup</a>

<div id="mypopup" style="width: 350px; height: 400px">
	<a href="javascript:popup.Close('mypopup')">Close Popup</a>
	My Content
</div>
*/

//document.write('<script type="text/javascript" src="/Include/JS/Debug.js"></script>');

//Global property that indicates the ID of the last popup window that was opened.
var popupLastID = null;

function Popup() {
	this.popups = new Array();
	//this.debug = null;
	this.iframe = null;
	
	//if (this.debug == null) {
	//	this.debug = new Debug();
	//	this.debug.Enable();
	//}
}


//Opens a DIV section on your page as a popup window.
//Parameters:
//	popupID		- either the ID of the popup DIV, or a reference to the DIV itself
//	attachToID	- Optional, either the ID of the element to attach the popup to, or a 
//				  reference to the element itself.  If not given, the element will be
//				  positioned by its own style.
//	offsetX		- Optional, the X offset from where the popup is attached.
//	offsetY		- Optional, the Y offset from where the popup is attached.
Popup.prototype.Open = function(popupID, attachToID, offsetX, offsetY) {
	var popup = $(popupID);
	
	popupLastID = popupID;
	//this.debug.Clear();
	
	//Add our popup class if we need to.
	if (popup.className.indexOf('spsBoxPopup') == -1) {
		if (popup.className.length > 0) {
			popup.className += ' spsBoxPopup';
		}
		else {
			popup.className = 'spsBoxPopup';
		}
	}
	
	var x = (typeof(offsetX) == "number" ? offsetX : -2);
	var y = (typeof(offsetY) == "number" ? offsetY : -2);
	this.SetProp(popup, "offsetX", x);
	this.SetProp(popup, "offsetY", y);
	
	//If we are attaching this element beneath another element...
	if (typeof(attachToID) != "undefined" && attachToID != null) {
		this.SetProp(popup, "attachToID", attachToID);
		
		if (this.popups[popup.id].position == "inside") {
			Tools.Position.Inside(attachToID, popup, x, y);
		}
		else {
			//popPos == "under"
			Tools.Position.Below(attachToID, popup, x, y);
		}
		
	}
	else {
		if (this.popups[popup.id].position == "center") {
			Tools.Position.Center(popup, x, y);
			
			if (this.popups[popup.id].keepCentered == true) {
				var obj = this;
				var objPopup = popup;
				window.onscroll = function() {
					obj.KeepCentered(objPopup);
				};
			}
		}
		
		this.SetProp(popup, "attachToID", null);
	}
	
	this.BackgroundOpen(popup.id);
	this.Iframe(popup);
	
	popup.style.zIndex = 999;		//So it appears above the opaque background, if there is one.
	popup.style.display = 'block';
}

//Used when trying to keep a popup centered on the screen.
Popup.prototype.KeepCentered = function(popup) {
	//Only keeps the last popup opened centered on the screen.
	Tools.Position.Center(popup.id, this.popups[popup.id].offsetX, this.popups[popup.id].offsetY);
}


//Closes all previously opened windows.
Popup.prototype.CloseAll = function() {
	for (var popupID in this.popups) {
		this.Close(popupID);
	}
}

//Closes a particular popup DIV.
//Parameters:
//	divID		- either the ID of the popup DIV, or a reference to the DIV itself
Popup.prototype.Close = function(popupID) {
	var div = $(popupID);
	
	if (div) {
		div.style.display = 'none';
		
		this.BackgroundClose(popupID);
		
		if (this.iframe != null) {
			this.iframe.style.display = 'none';
		}
	}
}

//Make it so IE6 doesn't let windowed controls show through our popups by adding an iframe
//behind them.
Popup.prototype.Iframe = function(div) {
	var ua = navigator.userAgent;
	
	if ((ua.indexOf("MSIE 6") != -1 || ua.indexOf("MSIE 5") != -1) && ua.indexOf("Opera") == -1) {
		if (this.iframe == null) {
			this.iframe = document.createElement('IFRAME');
			this.iframe.src = 'javascript:false;';
			this.iframe.className = 'spsBoxPopupIframe';
			
			//this.iframe.src = 'http://www.spokaneschools.org/';
			//this.iframe.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=33';
			//this.iframe.style.zIndex = 255;
			
			document.body.appendChild(this.iframe);
		}
		
		//Position the iframe directly behind our popup DIV.
		this.iframe.style.display = 'block';
		this.iframe.style.width = div.currentStyle.width;
		
		//If we have no height (it is "auto"), then set a default height.
		if (!div.style.height) {
			this.iframe.style.height = '300px';
		}
		else {
			this.iframe.style.height = div.style.height;
		}
		
		this.iframe.style.left = div.currentStyle.left;
		this.iframe.style.top = div.currentStyle.top;
		this.iframe.style.marginLeft = div.currentStyle.marginLeft;
		this.iframe.style.marginTop = div.currentStyle.marginTop;
	}
}

Popup.prototype.SetProp = function(popupID, name, value) {
	var popup = $(popupID);
	
	if (typeof(this.popups[popup.id]) != "object") {
		//Setup our popups data for this popup, defaulting the position attribute.
		this.popups[popup.id] = {
			"position": "under"
		};
	}
	
	this.popups[popup.id][name] = value;
}


Popup.prototype.PositionInside = function(popupID) {
	var popup = $(popupID);
	this.SetProp(popup, "position", "inside");
}

Popup.prototype.PositionUnder = function(popupID) {
	var popup = $(popupID);
	this.SetProp(popup, "position", "under");
}

Popup.prototype.PositionCenter = function(popupID, keepCentered) {
	var popup = $(popupID);
	this.SetProp(popup, "position", "center");
	this.SetProp(popup, "keepCentered", keepCentered);
}

//Turns on the background opacity effect of a particular popup.
Popup.prototype.BackgroundOpen = function(popupID) {
	var popup = $(popupID);
	
	if (this.BackgroundExists(popup.id)) {
		var bg = this.popups[popup.id].bg;
		var elementBG = this.popups[popup.id].bgElement;
		
		bg.setStyle({ display: 'block' });
		bg.clonePosition(elementBG);
		
		if (this.popups[popup.id].bgWidth != "") {
			bg.style.width = this.popups[popup.id].bgWidth;
			bg.style.height = this.popups[popup.id].bgHeight;
		}
				
		/*if (element == document.body) {
			bg.style.height = elementBG.offsetHeight + 'px';
			bg.style.width = '100%';
		}
		else {
			bg.style.height = elementBG.offsetHeight + 'px';
			bg.style.width = elementBG.offsetWidth + 'px';
		}
		
		Tools.Position.Inside(elementBG, bg, 0, 0);
		*/
	}
}

//Turns off the background opacity effect of a particular popup.
Popup.prototype.BackgroundClose = function(popupID) {
	var popup = $(popupID);
	
	if (this.BackgroundExists(popup.id)) {
		var bg = this.popups[popup.id].bg;
		
		bg.setStyle({ display: 'none' });
	}
}

//Call after Background() but before BackgroundOpen() or Open() to set the size of the background element.
Popup.prototype.BackgroundSize = function(popupID, width, height) {
	var popup = $(popupID);
	
	if (this.BackgroundExists(popup.id)) {
		var bg = this.popups[popup.id].bg;
		
		this.SetProp(popup, "bgWidth", width);
		this.SetProp(popup, "bgHeight", height);		
	}
}

//Returns true or false to indicate if the popup has a background transparency set on it.
Popup.prototype.BackgroundExists = function(popupID) {
	if (typeof(this.popups[popupID]) == "object") {
		if (typeof(this.popups[popupID].bg) != "undefined") {
			return true;
		}
	}
	
	return false;
}


//Covers an element with a background opacity effect.  This effect is turned on afterwards
//by either opening the attached popup with Open() or by explicitly calling BackgroundOpen().
//Closing the popup will turn off the effect, or by explicitly calling BackgroundClose().
//Parameters:
//	popupID  - the popup the background is attached to
//	opaqueID - the element to add the background effect to
//	color    - the color of the background effect
//	opacityNum  - a number 1-100
Popup.prototype.Background = function(popupID, opaqueID, color, opacityNum) {
	var popup = $(popupID);
	var opaqueElement = $(opaqueID);
	var bg = null;
	
	if (this.BackgroundExists(popup.id)) {
		bg = this.popups[popup.id].bg;
	}
	else {
		//bg = document.createElement('DIV');
		//document.body.appendChild(bg);
		
		//Find the popup's closest positioned parent to add the background to.
		bg = new Element('div');
		popup.getOffsetParent().appendChild(bg);
		
		this.SetProp(popup, "bg", bg);
		this.SetProp(popup, "bgElement", opaqueElement);
		this.SetProp(popup, "bgHeight", "");
		this.SetProp(popup, "bgWidth", "");
	}
	
	bg.setStyle({
		display: 'none',
		position: 'absolute',
		zIndex: 100,
		backgroundColor: color,
		opacity: (opacityNum / 100)
	});
	
	/*
	bg.style.display = 'none';
	bg.style.position = 'absolute';
	bg.style.zIndex = 100;
	bg.style.backgroundColor = color;
	
	bg.style.filter = "alpha(opacity=" + opacity + ")";
	bg.style.opacity = (opacity / 100);
	*/
}
