
OverlayMessage = function()
{
	var htmlOfModalMessage;					                    // html of modal message
	
	var divs_transparentDiv;				                    // Der transparente Container zur Überlappung der Seite
	var divs_content;						// Modal message div.
	var width;								// Width of message box
	var height;								// Height of message box
	
	var cssClassOfMessageBox;				// Alternative css class of message box - in case you want a different appearance on one of them
	var MSIE;
		
	
	this.htmlOfModalMessage = '';			// Default message is blank
	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.MSIE = false;
	if(navigator.userAgent.indexOf('MSIE')>=0) this.MSIE = true;
	
}

OverlayMessage.prototype = {
    /**
     *	Setting static HTML content for the modal dialog box.
     * 	
     *	@param String newHtmlContent = Static HTML content of box
     *
     * @public	
     */		
     setHtmlContent : function(newHtmlContent)
	    {
		    this.htmlOfModalMessage = newHtmlContent;
	    }
  ,
    /**
     *	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;		
	    }
	,		
	  /**
     *	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='OverlayMessage_ContentDiv';	
		      }
		      
		      
	    }
	,		
	  /**
     *	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.__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.
    	}
  ,
  
     /**
     *	Close the modal dialog box
     * 	
     *
     * @public	
     */		
	   close : function()
	    {
		    
		
		    /* Hiding divs */
		    if (this.divs_transparentDiv) 
		      {
		        this.divs_transparentDiv.style.display='none';
		        this.divs_content.style.display='none';
		      }
		
	    }	
	,
	  /**
     *	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); 	    
	     } 
	,
     /**
     *	Create the divs for the modal dialog box
     * 	
     *
     * @private	
     */		
	   __createDivs : function()
	    {
		    // Creating transparent div
		    this.divs_transparentDiv = document.createElement('DIV');
		    this.divs_transparentDiv.className='OverlayMessage_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 = 'OverlayMessage_ContentDiv';
		    this.divs_content.id = 'OverlayMessage';
		    this.divs_content.style.zIndex = 100000;
				
	    	document.body.appendChild(this.divs_content);
	    	
		    window.refToModMessage = this;
		    
		    this.addEvent(window,'scroll',function(e){ window.refToModMessage.__repositionTransparentDiv() });
		    this.addEvent(window,'resize',function(e){ window.refToModMessage.__repositionTransparentDiv() });
		}
  ,
      /**
        *	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];		
		      }
	
	,
	
	  /**
     *	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='OverlayMessage_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';	
    	  
    	 
    }
 ,
     /**
     *	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';		
    	  
    	// alert(this.divs_transparentDiv.style.width + ' ' + this.divs_transparentDiv.style.height);
    	
    	  var brSize = this.__getBrowserSize();
		    var bodyWidth = brSize[0];
		    var bodyHeight = brSize[1];
		    
		    var topOffset = Math.max(document.body.scrollTop,document.documentElement.scrollTop);
		      
    	
    	  // 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';	
    	  
		   	
    }
	,
    /**
     *	Insert content into the content div
     * 	
     *
     * @private	
     */	
      __insertContent : function()
        {
		    	this.divs_content.innerHTML = this.htmlOfModalMessage;	
		    }
    

}

