/***************************************
 * Use TSPopup.create(instanceID, url, width, height) to generate a popup div.
 * the first two parameters must given.
 * Use TSPopup.close(instanceID) to destory the popup div.
 * And window.close() can be used in the iframe document which loaded the page of specified url.
 ***************************************/
var TSPopup=function(oLayer, url){
		this.id = oLayer.id;
		this.Layer = oLayer;
		this.URL=url;
};
TSPopup.prototype.version='1.0.0';
TSPopup.prototype.show=function(){
	//set it as representable element,
	//then get offsetWidth and adjust the position,
	//append an iframe in it, finally, show the layer
	var oLayer = this.Layer;
	var stage = TSPopup.stage();	
	oLayer.style.visibility	= 'hidden';
	oLayer.style.display	= '';
	oLayer.style.position	= 'absolute';
	oLayer.style.zIndex		= (9000 + TSPopup.instanceSeq++);
	oLayer.style.top		= stage.top + (stage.height - oLayer.offsetHeight)/2 + 'px';		
	oLayer.style.left		= stage.left + (stage.width - oLayer.offsetWidth)/2 + 'px';		

	var oFrm = this.Iframe = document.createElement('iframe');
	oFrm.Instance = this;
	oFrm.src				= this.URL ;
	oFrm.frameBorder		= '0' ;
	oFrm.scrolling			= 'no' ;
    oFrm.allowTransparency	= true ;
    oFrm.width				= oLayer.offsetWidth ;
    oFrm.height				= oLayer.offsetHeight ;
	oLayer.appendChild(oFrm);
	 
	TSPopup.curtain.show();
	oLayer.style.visibility	= 'visible';
	this.registerAPI();
	TSPopup.instances[this.id]=this;
}
TSPopup.prototype.registerAPI=function(){
	//alert(this.id);
	var windw=this.Iframe.contentWindow;
	var instance=this;
	if(windw._isInstance){
		setTimeout(function(){instance.registerAPI();},100);
	}else{
		//windw.TSPopup = this;
		windw.close=function(){instance.close();};
		TSPopup.attachEvent(windw, "unload", function(){instance.registerAPI();});
	    TSPopup.attachEvent(windw, "load", function(){
		    windw.document.body.style.backgroundColor='transparent';
		    windw.document.body.style.margin='0px';
		    windw.document.body.style.padding='0px';
		    windw.document.oncontextmenu = function() { return false;};
	    });
	    windw._isInstance=true;
    }
};
TSPopup.prototype.close=function(){
	this.Layer.style.display = 'none';
	this.Layer.innerHTML = '';
	TSPopup.curtain.hidden();
	TSPopup.instances[this.id] = null;
};
//=========================================================
TSPopup.instanceSeq = 0;
TSPopup.instances = new Object();
TSPopup.create = function(layerID, url, width, height){
	var layer=document.getElementById(layerID);
	if(!layer){
		layer=document.createElement('div');
		layer.id			= layerID;
		layer.style.display	= 'none';
		layer.style.border	= 'none';
		layer.style.width	= '720px';
		layer.style.height	= '460px';
		document.body.appendChild(layer);
	}
	if(width)
		layer.style.width	= width + 'px';
	if(height)
		layer.style.height	= height + 'px';
		
	this.initCurtain();
	new TSPopup(layer, url).show();
};
TSPopup.close = function(childWindow){
	childWindow.frameElement.Instance.close();
};
TSPopup.attachEvent = function(obj, evt, fucn){
	if(document.all){
		obj.attachEvent("on"+evt, fucn);
	}else{
		obj.addEventListener(evt, fucn, false);
	}
}
TSPopup.stage = function(){
    var isXhtml = false; //if current Doctype is Xhtml
    try{
        isXhtml = document.compatMode == 'CSS1Compat';
    }catch(e){}
    
    var body = isXhtml ? document.documentElement : document.body;
    	
 	return {top: body.scrollTop, left: body.scrollLeft, 
 			width: body.clientWidth, height: body.clientHeight, 
 			offsetWidth: body.scrollWidth, offsetHeight: body.scrollHeight};
};
TSPopup.initCurtain =function(){
	if(this.curtain)
		return;
		
	//create a div with iframe inside to hidden 'select' element in IE6	
	var oFrmDiv = document.createElement("DIV");
	oFrmDiv.style.position			= 'absolute';
	oFrmDiv.style.zIndex			= '8990' ;
	oFrmDiv.style.top				= '0px';		
	oFrmDiv.style.left				= '0px';		
	oFrmDiv.style.width				= '1px';		
	oFrmDiv.style.height			= '1px';		
	oFrmDiv.style.display			= 'none' ;
	oFrmDiv.style.backgroundColor	= '#000';
	oFrmDiv.style.border			= '0';
	document.all ? oFrmDiv.style.filter = "alpha(opacity=0);" : oFrmDiv.style.opacity=0; //IE or the other
	
	var oFrm = oFrmDiv.ifrm = document.createElement('IFRAME') ; 
	oFrm.src				= '' ;
	oFrm.frameBorder		= '0' ;
	oFrm.scrolling			= 'no' ;
	oFrmDiv.appendChild(oFrm);
	
	//create a div to cover the iframe, make the 'document.onmousemove' works well.
	var oCoverDiv = document.createElement("DIV");
	oCoverDiv.style.position		= 'absolute';
	oCoverDiv.style.zIndex			= '8991' ;
	oCoverDiv.style.top				= '0px';		
	oCoverDiv.style.left			= '0px';		
	oCoverDiv.style.width			= '1px';		
	oCoverDiv.style.height			= '1px';		
	oCoverDiv.style.display			= 'none' ;
	oCoverDiv.style.backgroundColor	= '#000';
	oCoverDiv.style.border			= '0';
	document.all ? oCoverDiv.style.filter = "alpha(opacity=50);" : oCoverDiv.style.opacity=0.5; //IE or the other

	document.body.appendChild(oFrmDiv);
	document.body.appendChild(oCoverDiv);
	this.curtain={
		ifrmDiv:oFrmDiv,
		coverDiv:oCoverDiv,
		counter:0,
		show:function(){
			this.counter++;

			var stage = TSPopup.stage();
			//minus 1 here, for firefox will show the scrollbar, 
			//then hidden it quickly when it's a full screen size.
			var width = (stage.offsetWidth > stage.width ? stage.offsetWidth - 1 : stage.width) + 'px';
			var height = (stage.offsetHeight > stage.height ? stage.offsetHeight - 1 : stage.height) + 'px';
			this.ifrmDiv.style.height		= height;		
			this.ifrmDiv.style.width		= width;
			this.ifrmDiv.ifrm.style.height	= height;		
			this.ifrmDiv.ifrm.style.width	= width;
			
			this.coverDiv.style.height		= height;		
			this.coverDiv.style.width		= width;
			
			this.ifrmDiv.style.display		= '';			
			this.coverDiv.style.display		= '';
		},
		hidden:function(){
			this.counter--;
			if(this.counter<=0){
				this.ifrmDiv.style.display		= 'none';			
				this.coverDiv.style.display		= 'none';
			}
		}
	};
}