/************************************************************************************************************
*	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:
*
************************************************************************************************************/

// modified by Yuriy Babak 26.04.10


/**
* @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 realWidth;								// Real Width of message box
	var realHeight;								// Real 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 = BASEURL+'templates/'+theme+'/css/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.plainStyle = false;
	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.__insertContent();	// Calling method which inserts content into the message div.
		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;
		if(!this.MSIE) setTimeout('window.refToThisModalBoxObj.__resizeDivs()',150);

		
		
	}
	// }}}
	,
	// {{{ ()
    /**
     *	Display the modal dialog box
     *
     *
     * @public
     */
	setShadowDivVisible : function(visible)
	{
		this.shadowDivVisible = visible;
	}
	// }}}
	,
	// {{{ close()
    /**
     *	Close the modal dialog box
     *
     *
     * @public
     */
	setPlainStyle : function()
	{
		this.plainStyle = true;
	},
	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.zIndex = 95000;
		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 = 99000;
//		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;
		   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];

	this.__getRealContentSize();

	//if(debugmode==1)
	//	alert('Height is '+this.divs_content.offsetHeight+' want to set '+this.height);
    	// Setting width and height of content div
	var grvWidth=this.width;
	//var grvRealWidth=this.realWidth;
	//if(debugmode==1 && grvWidth<grvRealWidth)
	//	grvWidth=grvRealWidth+Math.round(grvRealWidth*5/100);
      	this.divs_content.style.width = grvWidth + 'px';
	

	var grvHeight=this.height;
	var grvRealHeight=this.realHeight;
	if(grvHeight<grvRealHeight)
		grvHeight=grvRealHeight+Math.round(grvRealHeight/10);
	this.divs_content.style.height= grvHeight + 'px';//comment this line to allow autosize
	
    	// 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 if (this.plainStyle) {
			this.divs_content.innerHTML = "\
        <table class='plain'>\
          <tr>\
            <td class='tlc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
            <td class='ht'>\
            </td>\
            <td class='trc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
          </tr>\
          <tr>\
            <td class='vl'>\
              </div>\
            </td>\
            <td class='content'>"+this.htmlOfModalMessage+"</td>\
            <td class='vr'>\
              </div>\
            </td>\
          </tr>\
          <tr>\
            <td class='blc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
            <td class='hb'>\
            </td>\
            <td class='brc'>\
            </td>\
          </tr>\
        </table>"
        this.plainStyle = false
        this.shadowDivVisible = false
        this.divs_shadow.style.display='none'
			
		}else{	// no url set, put static content inside the message box
			// this.divs_content.innerHTML = this.htmlOfModalMessage;
			
			this.divs_content.innerHTML = "\
        <table>\
          <tr>\
            <td class='tlc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
            <td class='ht'>\
            </td>\
            <td class='trc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
          </tr>\
          <tr>\
            <td class='vl'>\
              <div class='poloska' style='float:right;'>\
              </div>\
            </td>\
            <td class='content'>"+this.htmlOfModalMessage+"</td>\
            <td class='vr'>\
              <div class='poloska' style='float:left;'>\
              </div>\
            </td>\
          </tr>\
          <tr>\
            <td class='blc'>\
              <img alt='' height='14' src='/templates/sme/nd/images/_.gif' style='float:left;' width='14' />\
            </td>\
            <td class='hb'>\
            </td>\
            <td class='brc'>\
            </td>\
          </tr>\
        </table>"
        this.shadowDivVisible = false
        this.divs_shadow.style.display='none'
			
			
			
		}
    }
	// }}}
	,
	// {{{ __getRealContentSize()
    /**
     *	Insert content into the content div
     *
     *
     * @private
     */
	__getRealContentSize : function()
	{
		var contDiv = document.createElement('DIV');
		document.body.appendChild(contDiv);
		contDiv.innerHTML = this.divs_content.innerHTML;
		this.realHeight=contDiv.offsetHeight;
		this.realWidth=contDiv.offsetWidth;
		document.body.removeChild(contDiv);
		return 1;
	}
}