/************************************************************************************************************
*	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
	var htmlOfModalMessage;					// モーダルダイアログメッセージのhtml
	
	var divs_transparentDiv;				// ページを覆う透明div要素
	var divs_content;						// モーダルダイアログメッセージのdiv要素
	var iframe;								// IEで使うiframe
	var layoutCss;							// CSSファイル
	var width;								// メッセージボックスの幅
	var height;								// メッセージボックスの高さ
	
	var existingBodyOverFlowStyle;			// bodyがオーバーフローする時のCSS
	var dynContentObj;						// ダイナミックコンテンツのオブジェクト
	var cssClassOfMessageBox;				// メッセージボックスのCSSクラス属性
	var shadowDivVisible;					// シャドウ部分のdiv要素を表示する 
	var shadowOffset; 						// シャドウの位置
	var MSIE;
		
	this.url = '';							// モーダルダイアログメッセージのurl（初期状態）
	this.htmlOfModalMessage = '';			// モーダルダイアログメッセージのhtml（初期状態）
	this.layoutCss = 'modal-message.css';	// CSSファイル（初期状態）
	this.height = 300;						// メッセージボックスの高さ（初期状態）
	this.width = 600;						// メッセージボックスの幅（初期状態）
	this.cssClassOfMessageBox = false;		// メッセージボックスのCSSクラス属性（初期状態）
	this.shadowDivVisible = true;			// シャドウ部分のdiv要素を表示（初期状態）
	this.shadowOffset = 5;					// シャドウの位置（初期状態）
	this.MSIE = false;
	if(navigator.userAgent.indexOf('MSIE')>=0) this.MSIE = true;
	

}

DHTML_modalMessage.prototype = {
	// {{{ setSource(urlOfSource)
    /**
     *	モーダルダイアログメッセージのソースを設定
     * 	
     *
     * @public	
     */		
	setSource : function(urlOfSource)
	{
		this.url = urlOfSource;
		
	}	
	// }}}	
	,
	// {{{ setHtmlContent(newHtmlContent)
    /**
     *	モーダルダイアログメッセージに静的HTMLを利用
     * 	
     *	@param String newHtmlContent = Static HTML content of box
     *
     * @public	
     */		
	setHtmlContent : function(newHtmlContent)
	{
		this.htmlOfModalMessage = newHtmlContent;
		
	}
	// }}}		
	,
	// {{{ setSize(width,height)
    /**
     *	モーダルダイアログメッセージのサイズ
     * 	
     *	@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)
    /**
     *	モーダルダイアログメッセージにCSSの新しいクラス属性を設定
     * 	
     *	@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)
    /**
     *	シャドウのサイズを指定
     * 	
     *	@param Int newShadowOffset = Offset of shadow div(in pixels from message box - x and y)
     *
     * @public	
     */		
	setShadowOffset : function(newShadowOffset)
	{
		this.shadowOffset = newShadowOffset
					
	}
	// }}}		
	,	
	// {{{ display()
    /**
     *	モーダルダイアログメッセージを表示
     * 	
     *
     * @public	
     */		
	display : function()
	{
		if(!this.divs_transparentDiv){
			this.__createDivs();
		}	
		
		// div要素を再表示
		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();
		
		/* CSSファイルが変更された場合に備えて__resizeDivsメソッドを二度呼ぶ */
		window.refToThisModalBoxObj = this;		
		setTimeout('window.refToThisModalBoxObj.__resizeDivs()',150);
		
		this.__insertContent();	// メッセージのdiv要素にコンテンツを挿入するメソッドを呼ぶ
	}
	// }}}		
	,
	// {{{ ()
    /**
     *	モーダルダイアログメッセージを表示
     * 	
     *
     * @public	
     */		
	setShadowDivVisible : function(visible)
	{
		this.shadowDivVisible = visible;
	}
	// }}}	
	,
	// {{{ close()
    /**
     *	モーダルダイアログメッセージを閉じる
     * 	
     *
     * @public	
     */		
	close : function()
	{
		//document.documentElement.style.overflow = '';	// <html>タグのCSSのoverflowを初期状態に戻す
		
		/* divを隠す */
		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';
		
	}
	// }}}	
	,
	// {{{ __createDivs()
    /**
     *	モーダルダイアログメッセージ用のdiv要素を作成x
     * 	
     *
     * @private	
     */		
	__createDivs : function()
	{
		// 透明用の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);
		// コンテンツ用の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);

	}
	// }}}	
	,
	// {{{ __resizeDivs()
    /**
     *	メッセージ用のdiv要素のサイズを変更
     * 	
     *
     * @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;
    	
    	// スクロールの位置を保存
    	var st = Math.max(document.body.scrollTop,document.documentElement.scrollTop);
    	var sl = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);
    	//document.documentElement.style.overflow='auto';
    	
    	window.scrollTo(sl,st);
    	setTimeout('window.scrollTo(' + sl + ',' + st + ');',10);
    	var bodyWidth = document.documentElement.clientWidth;
    	var bodyHeight = document.documentElement.clientHeight;
    	
		var bodyWidth, bodyHeight; 
		if (self.innerHeight){ // IE以外のブラウザ用 
		 
		   bodyWidth = self.innerWidth; 
		   bodyHeight = self.innerHeight; 
		}  else if (document.documentElement && document.documentElement.clientHeight) {
		   // IE 6 Strictモード用 		 
		   bodyWidth = document.documentElement.clientWidth; 
		   bodyHeight = document.documentElement.clientHeight; 
		} else if (document.body) {// 残りのIE用 
		 
		   bodyWidth = document.body.clientWidth; 
		   bodyHeight = document.body.clientHeight; 
		} 

    	
    	// コンテンツのdiv要素の幅と高さを設定
      	this.divs_content.style.width = this.width + 'px';
    	this.divs_content.style.height= this.height + 'px';  	
    	
    	// 実際のコンテンツのdiv要素の幅と高さが、this.widthやthis.heightよりも大きい場合に備えて、一時的なサイズの変数を作成
    	var tmpWidth = this.divs_content.offsetWidth;	
    	var tmpHeight = this.divs_content.offsetHeight;
    	
    	
    	// 左側の透明div要素の幅と高さを設定
    	this.divs_transparentDiv.style.width = Math.ceil((bodyWidth - tmpWidth) / 2) + 'px';
    	this.divs_transparentDiv.style.height = bodyHeight + '100px';
    	
    	// 上側・下側・右側の透明div要素のサイズをできるだけ大きな値で設定
		
    	this.divs_transparentDiv.style.height = document.documentElement.clientHeight + 'px';   
    	this.divs_transparentDiv.style.width = document.documentElement.clientWidth + 'px';   
    	
    	
		
    	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';	// シャドウ機能がオフの場合にシャドウを隠す
    	
    	
    }	
	// }}}	
	,
	// {{{ __insertContent()
    /**
     *	コンテンツのdiv要素にコンテンツを挿入
     * 	
     *
     * @private	
     */	
    __insertContent : function()
    {
		if(this.url){	// 指定されたURLのファイルをダイナミックに読み込む
			ajax_loadContent('DHTMLSuite_modalBox_contentDiv',this.url);
		}else{	// URLが指定されていない場合は、メッセージボックス内の静的コンテンツを表示
			this.divs_content.innerHTML = this.htmlOfModalMessage;	
		}
    }		
}

