/************************************************************************************************************

*	DHTML modal dialog box

*

*	Created:						August, 26th, 2006

*	@class Purpose of class:		Display a modal dialog box on the screen.

*			

*	Css files used by this script:	modal-message.css

*

*	Demos of this class:			demo-modal-message-1.html

*

* 	Update log:

*

************************************************************************************************************/





/**

* @constructor

*/



DHTML_modalMessage = function()

{

	var url;								// url of modal message

	var htmlOfModalMessage;					// html of modal message

	

	var divs_transparentDiv;				// Transparent div covering page content

	var divs_content;						// Modal message div.

	var iframe;								// Iframe used in ie

	var layoutCss;							// Name of css file;

	var width;								// Width of message box

	var height;								// Height of message box

	

	var existingBodyOverFlowStyle;			// Existing body overflow css

	var dynContentObj;						// Reference to dynamic content object

	var cssClassOfMessageBox;				// Alternative css class of message box - in case you want a different appearance on one of them

	var shadowDivVisible;					// Shadow div visible ? 

	var shadowOffset; 						// X and Y offset of shadow(pixels from content box)

	var MSIE;

		

	this.url = '';							// Default url is blank

	this.htmlOfModalMessage = '';			// Default message is blank

	this.layoutCss = 'modal-message.css';	// Default CSS file

	this.height = 200;						// Default height of modal message

	this.width = 400;						// Default width of modal message

	this.cssClassOfMessageBox = false;		// Default alternative css class for the message box

	this.shadowDivVisible = true;			// Shadow div is visible by default

	this.shadowOffset = 5;					// Default shadow offset.

	this.MSIE = false;

	if(navigator.userAgent.indexOf('MSIE')>=0) this.MSIE = true;

	



}



DHTML_modalMessage.prototype = {

	// {{{ setSource(urlOfSource)

    /**

     *	Set source of the modal dialog box

     * 	

     *

     * @public	

     */		

	setSource : function(urlOfSource)

	{

		this.url = urlOfSource;

		

	}	

	// }}}	

	,

	// {{{ setHtmlContent(newHtmlContent)

    /**

     *	Setting static HTML content for the modal dialog box.

     * 	

     *	@param String newHtmlContent = Static HTML content of box

     *

     * @public	

     */		

	setHtmlContent : function(newHtmlContent)

	{

		this.htmlOfModalMessage = newHtmlContent;

		

	}

	// }}}		

	,

	// {{{ setSize(width,height)

    /**

     *	Set the size of the modal dialog box

     * 	

     *	@param int width = width of box

     *	@param int height = height of box

     *

     * @public	

     */		

	setSize : function(width,height)

	{

		if(width)this.width = width;

		if(height)this.height = height;		

	}

	// }}}		

	,		

	// {{{ setCssClassMessageBox(newCssClass)

    /**

     *	Assign the message box to a new css class.(in case you wants a different appearance on one of them)

     * 	

     *	@param String newCssClass = Name of new css class (Pass false if you want to change back to default)

     *

     * @public	

     */		

	setCssClassMessageBox : function(newCssClass)

	{

		this.cssClassOfMessageBox = newCssClass;

		if(this.divs_content){

			if(this.cssClassOfMessageBox)

				this.divs_content.className=this.cssClassOfMessageBox;

			else

				this.divs_content.className='modalDialog_contentDiv';	

		}

					

	}

	// }}}		

	,	

	// {{{ setShadowOffset(newShadowOffset)

    /**

     *	Specify the size of shadow

     * 	

     *	@param Int newShadowOffset = Offset of shadow div(in pixels from message box - x and y)

     *

     * @public	

     */		

	setShadowOffset : function(newShadowOffset)

	{

		this.shadowOffset = newShadowOffset

					

	}

	// }}}		

	,	

	// {{{ display()

    /**

     *	Display the modal dialog box

     * 	

     *

     * @public	

     */		

	display : function()

	{

		if(!this.divs_transparentDiv){

			this.__createDivs();

		}	

		

		// Redisplaying divs

		this.divs_transparentDiv.style.display='block';

		this.divs_content.style.display='block';

		this.divs_shadow.style.display='block';		

		if(this.MSIE)this.iframe.style.display='block';	

		this.__resizeDivs();

		

		/* Call the __resizeDivs method twice in case the css file has changed. The first execution of this method may not catch these changes */

		window.refToThisModalBoxObj = this;		

		setTimeout('window.refToThisModalBoxObj.__resizeDivs()',150);

		

		this.__insertContent();	// Calling method which inserts content into the message div.

	}

	// }}}		

	,

	// {{{ ()

    /**

     *	Display the modal dialog box

     * 	

     *

     * @public	

     */		

	setShadowDivVisible : function(visible)

	{

		this.shadowDivVisible = visible;

	}

	// }}}	

	,

	// {{{ close()

    /**

     *	Close the modal dialog box

     * 	

     *

     * @public	

     */		

	close : function()

	{

		//document.documentElement.style.overflow = '';	// Setting the CSS overflow attribute of the <html> tag back to default.

		

		/* Hiding divs */

		this.divs_transparentDiv.style.display='none';

		this.divs_content.style.display='none';

		this.divs_shadow.style.display='none';

		if(this.MSIE)this.iframe.style.display='none';

		

	}	

	// }}}	

	,

	// {{{ __addEvent()

    /**

     *	Add event

     * 	

     *

     * @private	

     */		

	addEvent : function(whichObject,eventType,functionName,suffix)

	{ 

	  if(!suffix)suffix = '';

	  if(whichObject.attachEvent){ 

	    whichObject['e'+eventType+functionName+suffix] = functionName; 

	    whichObject[eventType+functionName+suffix] = function(){whichObject['e'+eventType+functionName+suffix]( window.event );} 

	    whichObject.attachEvent( 'on'+eventType, whichObject[eventType+functionName+suffix] ); 

	  } else 

	    whichObject.addEventListener(eventType,functionName,false); 	    

	} 

	// }}}	

	,

	// {{{ __createDivs()

    /**

     *	Create the divs for the modal dialog box

     * 	

     *

     * @private	

     */		

	__createDivs : function()

	{

		// Creating transparent div

		this.divs_transparentDiv = document.createElement('DIV');

		this.divs_transparentDiv.className='modalDialog_transparentDivs';

		this.divs_transparentDiv.style.left = '0px';

		this.divs_transparentDiv.style.top = '0px';

		

		document.body.appendChild(this.divs_transparentDiv);

		// Creating content div

		this.divs_content = document.createElement('DIV');

		this.divs_content.className = 'modalDialog_contentDiv';

		this.divs_content.id = 'DHTMLSuite_modalBox_contentDiv';

		this.divs_content.style.zIndex = 100000;

		

		if(this.MSIE){

			this.iframe = document.createElement('<IFRAME src="about:blank" frameborder=0>');

			this.iframe.style.zIndex = 90000;

			this.iframe.style.position = 'absolute';

			document.body.appendChild(this.iframe);	

		}

			

		document.body.appendChild(this.divs_content);

		// Creating shadow div

		this.divs_shadow = document.createElement('DIV');

		this.divs_shadow.className = 'modalDialog_contentDiv_shadow';

		this.divs_shadow.style.zIndex = 95000;

		document.body.appendChild(this.divs_shadow);

		window.refToModMessage = this;

		this.addEvent(window,'scroll',function(e){ window.refToModMessage.__repositionTransparentDiv() });

		this.addEvent(window,'resize',function(e){ window.refToModMessage.__repositionTransparentDiv() });

		



	}

	// }}}

	,

	// {{{ __getBrowserSize()

    /**

     *	Get browser size

     * 	

     *

     * @private	

     */		

	__getBrowserSize : function()

	{

    	var bodyWidth = document.documentElement.clientWidth;

    	var bodyHeight = document.documentElement.clientHeight;

    	

		var bodyWidth, bodyHeight; 

		if (self.innerHeight){ // all except Explorer 

		 

		    bodyWidth = self.innerWidth-18; // Fixed By divyesh Date : 03-Jun-2008

		   bodyHeight = self.innerHeight; 

		}  else if (document.documentElement && document.documentElement.clientHeight) {

		   // Explorer 6 Strict Mode 		 

		   bodyWidth = document.documentElement.clientWidth; 

		   bodyHeight = document.documentElement.clientHeight; 

		} else if (document.body) {// other Explorers 		 

		   bodyWidth = document.body.clientWidth; 

		   bodyHeight = document.body.clientHeight; 

		} 

		return [bodyWidth,bodyHeight];		

		

	}

	// }}}	

	,

	// {{{ __resizeDivs()

    /**

     *	Resize the message divs

     * 	

     *

     * @private	

     */	

    __resizeDivs : function()

    {

    	

    	var topOffset = Math.max(document.body.scrollTop,document.documentElement.scrollTop);



		if(this.cssClassOfMessageBox)

			this.divs_content.className=this.cssClassOfMessageBox;

		else

			this.divs_content.className='modalDialog_contentDiv';	

			    	

    	if(!this.divs_transparentDiv)return;

    	

    	// Preserve scroll position

    	var st = Math.max(document.body.scrollTop,document.documentElement.scrollTop);

    	var sl = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);

    	

    	window.scrollTo(sl,st);

    	setTimeout('window.scrollTo(' + sl + ',' + st + ');',10);



    	this.__repositionTransparentDiv();

    	



		var brSize = this.__getBrowserSize();

		var bodyWidth = brSize[0];

		var bodyHeight = brSize[1];

    	

    	// Setting width and height of content div

      	this.divs_content.style.width = this.width + 'px';

    	this.divs_content.style.height= this.height + 'px';  	

    	

    	// Creating temporary width variables since the actual width of the content div could be larger than this.width and this.height(i.e. padding and border)

    	var tmpWidth = this.divs_content.offsetWidth;	

    	var tmpHeight = this.divs_content.offsetHeight;

    	

    	

    	// Setting width and height of left transparent div

    	

    	



    	

    	

		

    	this.divs_content.style.left = Math.ceil((bodyWidth - tmpWidth) / 2) + 'px';;

    	this.divs_content.style.top = (Math.ceil((bodyHeight - tmpHeight) / 2) +  topOffset) + 'px';

    	

 		if(this.MSIE){

 			this.iframe.style.left = this.divs_content.style.left;

 			this.iframe.style.top = this.divs_content.style.top;

 			this.iframe.style.width = this.divs_content.style.width;

 			this.iframe.style.height = this.divs_content.style.height;

 		}

 		

    	this.divs_shadow.style.left = (this.divs_content.style.left.replace('px','')/1 + this.shadowOffset) + 'px';

    	this.divs_shadow.style.top = (this.divs_content.style.top.replace('px','')/1 + this.shadowOffset) + 'px';

    	this.divs_shadow.style.height = tmpHeight + 'px';

    	this.divs_shadow.style.width = tmpWidth + 'px';

    	

    	

    	

    	if(!this.shadowDivVisible)this.divs_shadow.style.display='none';	// Hiding shadow if it has been disabled

    	

    	

    }

    // }}}	

    ,

	// {{{ __insertContent()

    /**

     *	Insert content into the content div

     * 	

     *

     * @private	

     */	    

    __repositionTransparentDiv : function()

    {

    	this.divs_transparentDiv.style.top = Math.max(document.body.scrollTop,document.documentElement.scrollTop) + 'px';

    	this.divs_transparentDiv.style.left = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft) + 'px';

		var brSize = this.__getBrowserSize();

		var bodyWidth = brSize[0];

		var bodyHeight = brSize[1];

    	this.divs_transparentDiv.style.width = bodyWidth + 'px';

    	this.divs_transparentDiv.style.height = bodyHeight + 'px';		

		   	

    }

	// }}}	

	,

	// {{{ __insertContent()

    /**

     *	Insert content into the content div

     * 	

     *

     * @private	

     */	

    __insertContent : function()

    {

		if(this.url){	// url specified - load content dynamically

			ajax_loadContent('DHTMLSuite_modalBox_contentDiv',this.url);

		}else{	// no url set, put static content inside the message box

			this.divs_content.innerHTML = this.htmlOfModalMessage;	

		}

    }		

}