/**
 * @fileoverview
 * this files contains util animation method and object for comweb site
 * <ul>
 * 		<li>dialogBox</li>
 * </ul>
 */

/**
 * @class
 * Pops up a modal dialog window, blocking access to the screen and also graying out the screen.
 * Dialog is just an HTMLDivElement which must have the following initial style: "style='display:none'".
 * The dialog process is just to play with "style='display:none'" (to hide the dialogBox) and "style='display:block'" (to show it).
 * So if you want change the dialog text, used innerHTML method in the given HTMLDivElement.<br/>
 * The following code show how implements dialogBox (note that only a single instance of this class can be managed):</br>
 *
 * <p>
 *	&lt;body&gt;<br />
 *		&lt;div  id="dialogBoxContainer" style="display:none;position: absolute;left: 0px;top:0px; width: 100%; height: 500px;"&gt;<br />
 *			&lt;div id="dialogBg" style="width: 100%;height: 100%;"&gt; &lt;/div&gt;<br />
 *			&lt;div id="dialogBoxPassword" style="position:absolute;left:250px;top:200px; "&gt;<br />
 * 				&lt;div class="dialogBoxTop"&gt;&lt;/div&gt;<br />
 *				&lt;div id="dialog_Box_Body"&gt;&lt;/div&gt;<br />
 *				&lt;div class="dialogBoxFooter"&gt;&lt;/div&gt;<br />
 *			&lt;/div&gt;<br />
 *		&lt;/div&gt;<br />
 *<br />
 *		&lt;script type="text/javascript"&gt;<br />
 *			var dialogBox = new CW_DialogBox();<br />
 *			dialogBox.setDiv(document.getElementById("dialogBoxContainer"));<br />
 *<br />
 *			//dialogBox.show(); // or dialogBox.hide();<br />
 *		&lt;/script&gt;<br />
 *<br />
 *	&lt;/body&gt;<br />
 *</p>
 */
function CW_DialogBox() {
	this.initialize();
}
CW_DialogBox.prototype = {
	/**
	 * HtmlDivElement which contain the dialog box which must be showed and hide
	 * @type {HtmlDivElement}
	 */
	div : null,
	/**
	 * Timer which is launched when CW_DialogBox.show is called in order to regulary check if the dialog HTMLDivelement
	 * is at the top of the screen and if it is not position this one at the top
	 * @type {Object} a timmer object setted by window.setTimeout method
	 */
	timer: null,
	initialize: function(){

	},
	/**
	 * Set the correponding dialogBox HTMLDivElement
	 * @return {void}
	 */
	setDiv: function(div){
		this.div = div;
	},
	/**
	 * Allow to display the dialog box
	 * @return {void}
	 */
	show:function(){
		//this.div.style.display = "block;";

		var dimension = Element.getDimensions(document.body);
		//var wantedHeight = dimension.height;
		//var wantedWidth = dimension.width;

	    var wantedHeight = 0;
		var wantedWidth = 0;

		if (self.innerWidth){
			wantedHeight = self.innerHeight;
			wantedWidth = self.innerWidth;
		}else if (document.documentElement && document.documentElement.clientWidth){
			wantedHeight = document.documentElement.clientHeight;
			wantedWidth = document.documentElement.clientWidth;
		}else if (document.body){
			wantedHeight = document.body.clientHeight;
			wantedWidth = document.body.clientWidth;
		}else{
			wantedHeight = document.body.offsetHeight;
			wantedWidth = document.body.offsetWidth;
		}
		wantedHeight = wantedHeight + "px";
		Element.setStyle(this.div, {height: wantedHeight });
		Element.show(this.div);
		try{
			var dialogBoxDiv = document.getElementById("dialogBox");
			var letPos = (wantedWidth - (dialogBoxDiv.offsetWidth)) / 2 ;
			//alert("frame width:" + wantedWidth + "\ndiv width:" +dialogBoxDiv.offsetWidth + "\nletPos:" + letPos);
			dialogBoxDiv.setStyle(	{left: letPos + "px" });
		}catch(e){
			//alert("Error left dialog:" + e);
		}


		alwaysInTop(this.div.id);
		this.timer = window.setInterval("alwaysInTop('"+this.div.id+"');",250);
		Event.observe(document.getElementById("hider0"), 'click',function() {
		 	window.clearInterval(dialogBox.timer);
			Element.hide(dialogBox.div);
		});
	},
	/**
	 * Allow to hide the dialog box
	 * @return {void}
	 */
	hide:function(){
		window.clearInterval(this.timer);
		Element.hide(this.div);
	}
}


/**
 * Javascript timmer whioch allow to set the showed dialog box at the frame top
 */
function alwaysInTop(divId){
	var deltaY =  window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
	document.getElementById(divId).style.top = deltaY + "px";
}