var PopDiv = Class.create( {
	initialize : function(rootDivId) {
		var defaults = {
			loadingMsg:			"",
			mainDivClass:		"dropShadow",
			contentDivClass:	"subPage clearfix",
			closeBtClass:		"subPageClose",
			mainDivStyle:		{'height': '390px', 'width': '700px'},
			contentDivStyle:	{},
			ajaxCallback:		"",
			ajaxUrl:			"",
			loadImg:			"../template/images/loading2.gif"
		};

		this.state = 'closed';
		this.options = Object.extend(defaults, arguments[1] || {});
		//default style
		var _mainDivStyle = {'z-index': '1000', 'display': 'none', 'width': 'auto', "margin-left":"0px"};
		this.options.mainDivStyle = Object.extend(_mainDivStyle, this.options.mainDivStyle || {});
		var _contentDivStyle = {'height': ''};
		this.options.contentDivStyle = Object.extend(_contentDivStyle, this.options.contentDivStyle || {});

		this.rootDiv = $(rootDivId);

		if(!Object.isElement($('shadowBg'))){
			this.bgDiv = new Element('div', {id: 'shadowBg'});
			this.bgDiv.setStyle({'height': (this.rootDiv.offsetHeight+1500) + 'px', 'display': 'none'});
		}else{
			this.bgDiv = $("shadowBg");
		}

		this.rootDiv.insert({"after": this.bgDiv});
		
		this.mainDiv = new Element('div',{className: this.options.mainDivClass});
		this.mainDiv.setStyle(this.options.mainDivStyle);
		this.rootDiv.insert({"after": this.mainDiv});

		this.contentDiv = new Element('div',{className: this.options.contentDivClass});
		this.mainDiv.insert({"bottom":this.contentDiv});
		//button
		this.closeBt = new Element('a',{className:this.options.closeBtClass});
		this.closeBt.observe("click", this.close.bind(this));
		this.mainDiv.insert({"bottom":this.closeBt});

		var _div2 = new Element('div',{className:'panel tl'});
		var _div3 = new Element('div',{className:'panel tr'});
		var _div4 = new Element('div',{className:'panel bottomr'});
		var _div5 = new Element('div',{className:'panel bottoml'});
		this.mainDiv.insert({"bottom":_div2});
		this.mainDiv.insert({"bottom":_div3});
		this.mainDiv.insert({"bottom":_div4});
		this.mainDiv.insert({"bottom":_div5});

		//存放临时的select DOM
		this._select = this.rootDiv.getElementsByTagName('select');
	},

	open : function(innerHtml){
		this.state = 'open';
		document.documentElement.style.overflowY="hidden";
		//临时option
		var _size = Object.isUndefined(arguments[1])? 0 :arguments[1];

		this.mainDiv.setStyle(_size);

		if(!Object.isUndefined(_size.height)){
			var _h = parseInt(_size.height);
			_h = _h - 20;
			this.contentDiv.setStyle({"height":_h+"px"});
		}

		if(!Object.isUndefined(_size.width)){
			
			var _w = parseInt(_size.width);
			_w = _w - 50;
			this.contentDiv.setStyle({"width":_w+"px"});
		}

		this.mainDiv.className = arguments[2]||this.options.mainDivClass;

		this.shadowCenter();

		//隐藏select
		for(var i=0; i<this._select.length; i++) {
			this._select[i].style.display = "none";
		}

		this.contentDiv.update(innerHtml);
		this.mainDiv.show();
		this.bgDiv.show();
	},

	ajaxOpen : function(){
		//临时option
		var _option = Object.clone(this.options);
		this._options = Object.extend(_option, arguments[1] || {});
		
		var _h = Object.isUndefined(this._options.mainDivStyle.height)?"0px":this._options.mainDivStyle.height;
		var _w = Object.isUndefined(this._options.mainDivStyle.width)?"0px":this._options.mainDivStyle.width;

		this.loading(_w, _h, this._options.mainDivClass, this._options.loadingMsg);

		new Ajax.Request(arguments[0]||this._options.ajaxUrl, {
				method: "get",

				onLoaded: function(){
					this.close();
				}.bind(this),

				onComplete: function(transport){
					var _response = transport.responseText;
					this.open(_response, this._options.mainDivStyle, this._options.mainDivClass);
					if(Object.isFunction(this._options.ajaxCallback)){
						this._options.ajaxCallback();
					}
				}.bind(this)
			});
	},

	loading : function(w, h){
		var _classname = Object.isUndefined(arguments[2])?this.options.mainDivClass:arguments[2];
		var _msg = Object.isUndefined(arguments[3])?"":arguments[3];

		var _w = parseInt(w)-50;
		_w = _w + "px";
		var _h = parseInt(h)-30;
		_h = _h + "px";

		var _top = parseInt(_h)/2-21;
		var _left = parseInt(_w)/2-_msg.length*10;

		this.open('<div id="innerShadow" style="display:none"><div><img src="'+this.options.loadImg+'" />'+_msg+'</div></div>',
						{'width': w, 'height': h},
						_classname);

		$("innerShadow").setStyle({"height":_h, "width":_w });
		$("innerShadow").down('div').setStyle({"top":_top+"px" ,"left": _left+"px","position":"absolute"});
		$("innerShadow").show();
	},

	close : function(){
		this.state = 'closed';
		document.documentElement.style.overflowY="";
		this.mainDiv.hide();
		this.bgDiv.hide();
		for(var i=0; i<this._select.length; i++) {
			this._select[i].style.display = "";
		}

		this.mainDiv.className = this.options.mainDivClass;
		this.mainDiv.setStyle(this.options.mainDivStyle);
		this.contentDiv.setStyle(this.options.contentDivStyle);
	},

	shadowCenter : function (){ 
		//控制id=dropShadow的这个层的居中显示
		//this.mainDiv.style.marginTop = -this.mainDiv.offsetHeight/2 + "px";
		var posX, posY;
		
		if(window.innerHeight){
			posX = window.pageXOffset;
			posY = window.pageYOffset;
		}else if(document.documentElement && document.documentElement.scrollTop){
			posX = document.documentElement.scrollLeft;
			posY = document.documentElement.scrollTop;
		}else if(document.body){
			posX = document.body.scrollLeft;
			posY = document.body.scrollTop;
		}

		var __h = parseInt(this.mainDiv.style.height);
		var __x = parseInt(this.mainDiv.style.width);
		var _newtop = (document.documentElement.clientHeight/2 + posY - __h/2 - 5);

		var _newleft = (document.documentElement.clientWidth/2 + posX - __x/2 - 20);

		this.mainDiv.style.top = _newtop + "px";
		this.bgDiv.style.top = (_newtop - 400) + "px";

		this.mainDiv.style.left = (_newleft+17) + "px";
		//setTimeout(this.shadowCenter.bind(this), 1);
	},

	setStyle : function(elementName, style){
		 switch(elementName){
			 case 'contentDiv':
				this.contentDiv.style=style;
				break;
		 }
	},

	resetBgH : function(){
		this.bgDiv.setStyle({'height': this.rootDiv.offsetHeight + 'px'});
	}
});