/**
 *  A covering element that cannot be moved.
 *  Works well on IE6+,Firefox,Opera
 *
 * @author Erick S <esatire at gmail dot com>
 * @copyright Atarim Group LTD.
 * @version 1.4.4
 *  
 *  20/07/2008 - Added option to set dimensions of alert/confirm box for next popup only
 *  31/03/2008 - Added isAnimating, isModal, hideOnOk and useHotkeys properties
 *  23/02/2008 - Fade animation
 *  13/02/2008 - Added MessageBox options,improved auto draw when not defining dimensions, more improvements 
 *  05/02/2008 - Added option to redraw border, when content changes
 *  29/01/2008 - Will now look the same on IE6 in quirks mode, or older, too
 *  28/01/2008 - Upgraded view
 *  23/10/2007 - Fixed appearance on HTML pages where body doesn't take the full screen
 */ 

/** Our own width definition  */
StaticPopup.BORDER_WIDTH = 6;
/* ### Button usage ### */
/** If you would like to provide your own buttons */
StaticPopup.BUTTON_NONE = 0; 
/** Default */
StaticPopup.BUTTON_OK = 1;
/** Show both ok and cancel */
StaticPopup.BUTTON_OK_CANCEL = 2;
/** We use opacity, unless it is IE, which uses DX filters */
StaticPopup.useAlphaFilter = false;
/** For animation */
StaticPopup.ANIM_MAX_FRAMES = 5;
StaticPopup.ANIM_RATE = 50;
StaticPopup.CONTAINER_CHANGE = 0.2;
StaticPopup.BORDER_CHANGE = 0.12;

/**
 *  Notes: Overwrites any CSS defined border width
 */
function StaticPopup()
{
	var me = this;
	/** Function call when shown */
	this.onShow = null;
	/** Function call on OK button click */
	this.onOk = null;
	/** Custom data that will be passed to onOk function. Should be set on onShow */
	this.data = null;
	/** For animation */
	this.timer = null;
	this.phase = 0;
	/** If someone clicks on the 'ok' button - a function should be called at the end of the animation */
	this.clickedOnOk = false;
	/** True during animation - Don't modify! */
	this.isAnimating = false;
	/** Wether to use the page overlay */
	this.isModal = true;
	this.useHotkeys = true;
	/** If you want to run a function when clicking ok, but keep the popup in view */
	this.hideOnOk = true;

	/** Have to handle IE quirks mode differently */
	if (document.body.clientHeight > 0 && document.documentElement.clientHeight == 0)
		this.docElement = document.body;
	else
		this.docElement = document.documentElement;
	
	/* DOM Layout */
	this.container = document.createElement('DIV');
	this.container.className = 'popupContainer';
	document.body.appendChild(this.container);
	this.content = document.createElement('DIV');
	this.content.className = 'popupContent';
	this.container.appendChild(this.content);
	this.buttonPanel = document.createElement('DIV');
	this.buttonPanel.className = 'popupButtonPanel';
	this.container.appendChild(this.buttonPanel);
	// Buttons
	this.okButton = document.createElement('INPUT');
	this.okButton.setAttribute('type','button');
	this.okButton.className = 'popupButton';
	this.okButton.value = 'אישור';
	this.buttonPanel.appendChild(this.okButton);
	this.cancelButton = document.createElement('INPUT');
	this.cancelButton.setAttribute('type','button');
	this.cancelButton.className = 'popupButton';
	this.cancelButton.value = 'ביטול';
	this.buttonPanel.appendChild(this.cancelButton);

	this.border = document.createElement("DIV");
	this.border.className = "popupBorder";
	document.body.appendChild(this.border);
	this.border.style.padding = StaticPopup.BORDER_WIDTH + 'px';
	if (this.container.style.opacity === undefined && this.container.style.filter !== undefined) 
	{
		StaticPopup.useAlphaFilter = true;
		StaticPopup.BORDER_CHANGE = Math.floor(StaticPopup.BORDER_CHANGE * 100);
		StaticPopup.CONTAINER_CHANGE = Math.floor(StaticPopup.CONTAINER_CHANGE * 100);
		this.container.style.filter = 'alpha(opacity=0)';
		this.border.style.filter = 	'alpha(opacity=0)';
	}
	else
	{
		this.container.style.opacity = '0.0';
		this.border.style.opacity = '0.0';
	}

	this.hide = function()
	{
		this.docElement.onkeydown = null;
		this.phase = StaticPopup.ANIM_MAX_FRAMES;
		this.isAnimating = true;		
		this.timer = window.setInterval(this.hideAnim,StaticPopup.ANIM_RATE);
	}
	/**
	 * Shows the popup at the center of the page
	 * @param {int} buttons Use the provided enums
	 */
	this.showCenter = function(buttons)
	{
		if (this.container.style.display != 'block') this.container.style.display = "block";

		var pos = StaticPopup.getScreenCenter();
		
		var element = (buttons == StaticPopup.BUTTON_NONE) ? this.content : this.container;

		pos.x -= Math.floor(element.offsetWidth/2);
		pos.y -= Math.floor(element.offsetHeight/2+StaticPopup.BORDER_WIDTH/2);
		
		this.show(pos.x,pos.y,buttons);
	}
	/**
	 * Shows the popup at requested location and with requested size
	 * @param {int} x
	 * @param {int} y
	 * @param {int} buttons Use the provided enums
	 */
	this.show = function(x,y,buttons)
	{
		// Default buttons, if value is ommited
		if (typeof(buttons) == 'undefined' || buttons == null) buttons = StaticPopup.BUTTON_OK;
		// Position the container
		this.container.style.left = x + "px";
		this.container.style.top = y + "px";
		// Buttons
		switch (buttons)
		{
			case StaticPopup.BUTTON_OK:
				this.okButton.style.display = 'inline';
				this.cancelButton.style.display = 'none';
				this.okButton.focus();
			break;
			case StaticPopup.BUTTON_OK_CANCEL:
				this.okButton.style.display = 'inline';
				this.cancelButton.style.display = 'inline';
				this.cancelButton.focus();
			break;			
			case StaticPopup.BUTTON_NONE:
				this.okButton.style.display = 'none';
				this.cancelButton.style.display = 'none';			
			break;
		}
		// After container is shown - draw border
		this.drawBorder();
		this.border.style.display='block';
		// Page overlay
		if (this.isModal)
		{
			if (StaticPopup.overlay == null) StaticPopup.CreateOverlay();
			StaticPopup.overlay.style.width = this.docElement.scrollWidth + 5 + 'px';
			//StaticPopup.overlay.style.width = this.documentElement.clientWidth + 'px';
			if (this.docElement.clientHeight > this.docElement.scrollHeight)
				StaticPopup.overlay.style.height = this.docElement.clientHeight + 5 + 'px';
			else
				StaticPopup.overlay.style.height = this.docElement.scrollHeight + 5 + 'px';	 
			StaticPopup.overlay.style.visibility = 'visible';
		}
		// Start the animation
		this.isAnimating = true;
		this.timer = window.setInterval(this.showAnim,StaticPopup.ANIM_RATE);		
	}
	/**
	 * Sets the inner content
	 * @param {String} text Including HTML
	 */
	this.setContent = function(text,w,h)
	{
		if (typeof (w) == 'undefined' || w == null)
			this.content.style.width = null;
		else
			this.content.style.width = w + 'px';

		if (typeof (h) == 'undefined' || h == null)
			this.content.style.height = null;
		else
			this.content.style.height = h + 'px';
			
		this.content.innerHTML = text;
	}
	/** 
	 * Draws the translucent border. 
	 * Call this explicitly if size of content changes without a call to 'show'.
	 */
	this.drawBorder = function()
	{
		this.border.style.top    = (this.container.offsetTop - StaticPopup.BORDER_WIDTH) + 'px';
		this.border.style.left   = (this.container.offsetLeft - StaticPopup.BORDER_WIDTH) + 'px';
		if (this.docElement == document.documentElement) // Standards mode 
		{
			this.border.style.width  = this.container.offsetWidth  + 'px';
			this.border.style.height = this.container.offsetHeight + 'px';
		}
		else // IE in 'quirks' mode includes padding in total w/h:
		{
			this.border.style.width  = (this.container.offsetWidth  + StaticPopup.BORDER_WIDTH * 2) + 'px';
			this.border.style.height = (this.container.offsetHeight + StaticPopup.BORDER_WIDTH * 2) + 'px';
		}
	}
	
	this.showAnim = function()
	{
		if (!StaticPopup.useAlphaFilter) 
		{
			me.container.style.opacity = me.phase * StaticPopup.CONTAINER_CHANGE;
			me.border.style.opacity = me.phase * StaticPopup.BORDER_CHANGE;
		}
		else
		{
			me.container.style.filter = 'alpha(opacity='+me.phase * StaticPopup.CONTAINER_CHANGE+')';
			me.border.style.filter = 	'alpha(opacity='+me.phase * StaticPopup.BORDER_CHANGE+')';			
		}
		// Fully shown
		if (++me.phase > StaticPopup.ANIM_MAX_FRAMES)
		{
			me.phase = StaticPopup.ANIM_MAX_FRAMES;
			window.clearInterval(me.timer);
			me.timer = null;
			// ESC closes the popup
			if (me.useHotkeys) me.docElement.onkeydown = me.onKey;
			me.isAnimating = false;
			if (me.onShow != null) me.onShow();
		}
	}
	this.hideAnim = function()
	{
		if (!StaticPopup.useAlphaFilter) 
		{
			me.container.style.opacity = me.phase * StaticPopup.CONTAINER_CHANGE;
			me.border.style.opacity = me.phase * StaticPopup.BORDER_CHANGE;
		}
		else
		{
			me.container.style.filter = 'alpha(opacity='+me.phase * StaticPopup.CONTAINER_CHANGE+')';
			me.border.style.filter = 	'alpha(opacity='+me.phase * StaticPopup.BORDER_CHANGE+')';			
		}		// Fully hidden
		if (--me.phase < 0)
		{
			me.phase = 0;
			window.clearInterval(me.timer);
			me.timer = null;
			// Hide overlay
			StaticPopup.overlay.style.visibility = 'hidden';
			/* 
			 * We don't use display=none, but instead move it out of view. This little trick's purpose
			 * is to have correct offsetHeight and offsetWidth values when showing the popup. 
			 */
			me.container.style.left = (-me.container.offsetWidth*2) + 'px';
			me.container.style.top = (-me.container.offsetHeight*2) + 'px';
			// Border can be 'nonned' safely
			me.border.style.display = "none";
			me.isAnimating = false;
			if (me.onOk && me.clickedOnOk) me.onOk(me.data);
		}
	}
	/* ### Events handlers ### */
	this.cancelButton.onclick = function() { me.clickedOnOk = false; me.hide(); }
	this.okButton.onclick = function()
	{
		if (me.hideOnOk)
		{
			me.clickedOnOk = true;	me.hide();
		}
		else if (me.onOk != null) me.onOk(me.data);
	}	
	/** Runs on keypress when popup is shown (Raised by documentElement) */
	this.onKey = function(evt)
	{
		var keyCode = getEventKeyCode(evt);
		switch (keyCode)
		{
			case 27: // ESC
				me.hide();
			break;
		}
	}
}
/** Covers the screens in darkness */
StaticPopup.overlay = null;
StaticPopup.CreateOverlay = function()
{
	StaticPopup.overlay = document.createElement('DIV');
	StaticPopup.overlay.className = 'popupPageOverlay';
	document.body.appendChild(StaticPopup.overlay);
}
/** returns an object With x and y properties. */
StaticPopup.getScreenCenter = function()
{
	var pos = {x:0,y:0};
	// Scrolling must be validated seperately, due to browser quirks
	if (document.body.scrollTop > 0)
		pos.y += document.body.scrollTop;
	else
		pos.y += document.documentElement.scrollTop; 
	if (document.body.scrollLeft > 0)
		pos.x += document.body.scrollLeft;
	else
		pos.x += document.documentElement.scrollLeft;

	/** Have to handle IE quirks mode differently */
	if (document.body.clientHeight > 0 && document.documentElement.clientHeight == 0)
		var docElement = document.body;
	else 
		var docElement = document.documentElement;
		
	pos.x += Math.floor(docElement.clientWidth/2);

	if (window.innerHeight)
		pos.y += Math.floor(window.innerHeight/2);
	else
		pos.y += Math.floor(docElement.clientHeight/2);

	return pos;
}

/** Complements popup - providing easy general messages (Like alert) */
function MessageBox(){}
MessageBox.element = null;
/** Default width for message boxes */
MessageBox.DEFAULT_WIDTH  = 350;
/** Default height */
MessageBox.DEFAULT_HEIGHT = null;
/** Used along with setDimensions */
MessageBox.nextWidth = null;
MessageBox.nextHeight =  null;

/**
 * For next alert/confirm only.
 * 
 * @param {int} width
 * @param {int} height
 */
MessageBox.setDimensions = function(width,height)
{
	MessageBox.nextWidth = width;
	MessageBox.nextHeight = height;
} 

MessageBox.createElement = function()
{
	MessageBox.element = new StaticPopup();
}
MessageBox.alert = function(content)
{
	if (MessageBox.element == null) MessageBox.createElement();

	MessageBox.element.onOk = null;
	MessageBox.element.data = null;

	if (MessageBox.nextWidth != null || MessageBox.nextHeight != null )
		MessageBox.element.setContent(content,MessageBox.nextWidth,MessageBox.nextHeight);
	else
		MessageBox.element.setContent(content,MessageBox.DEFAULT_WIDTH,null);

	MessageBox.element.showCenter(StaticPopup.BUTTON_OK);
	MessageBox.nextWidth = MessageBox.nextHeight = null;
}
MessageBox.confirm = function(content,func,data)
{
	if (MessageBox.element == null) MessageBox.createElement();	

	if (MessageBox.nextWidth != null || MessageBox.nextHeight != null )
		MessageBox.element.setContent(content,MessageBox.nextWidth,MessageBox.nextHeight);
	else
		MessageBox.element.setContent(content,MessageBox.DEFAULT_WIDTH,null);

	MessageBox.element.onOk = func;
	MessageBox.element.data = data;
	MessageBox.element.showCenter(StaticPopup.BUTTON_OK_CANCEL);
	MessageBox.nextWidth = MessageBox.nextHeight = null;
}
/** Set text on MessageBox buttons, if you don't like the default */
MessageBox.setButtonText = function(okButtonText,cancelButtonText)
{
	if (MessageBox.element == null) MessageBox.createElement();
	if (okButtonText !== undefined && okButtonText.length > 0)
		MessageBox.element.okButton.value = okButtonText;
	if (cancelButtonText !== undefined && cancelButtonText.length > 0)
		MessageBox.element.cancelButton.value = cancelButtonText;
}
// Compatibility with ajax.js
MessageBox.Alert = MessageBox.alert;
