﻿var fullDivName = "Pop_Div";
var contentDivName = "Pop_ContentDiv";
var coverDivName = "Pop_CoverDiv";
function PopDiv(title, url, divWidth, divHeight, needCoverDiv)
{
	var titleHeight = 28;
	var tempDiv = document.getElementById(fullDivName);
	if (tempDiv == null)
	{
		var fullDiv = document.createElement("div");
		with (fullDiv)
		{
			id = fullDivName;
			className = "fullDiv";
			style.left = GetDivLeft(divWidth) + "px";
			style.top = GetDivTop(divHeight) + "px";
		}
		document.body.appendChild(fullDiv);
		
		var innerDiv = document.createElement("div");
		with (innerDiv)
		{
			className = "innerDiv";
			style.width = (divWidth + 4) + "px";
			style.height = (divHeight + titleHeight + 8) + "px";
		}
		fullDiv.appendChild(innerDiv);
		
		var inner = document.createElement("div");
		with (inner)
		{
			className = "inner";
			style.width = (divWidth + 2) + "px";
			style.height = (divHeight + titleHeight + 3) + "px";
		}
		innerDiv.appendChild(inner);
		var titleDiv = document.createElement("div");
		with (titleDiv)
		{
			className = "titleDiv";
			style.height = titleHeight + "px";
		}
		titleDiv.innerHTML = "<h2>" + title + "</h2><span onmousedown=\"CloseDiv()\"></span>";
		inner.appendChild(titleDiv);

		var contentDiv = document.createElement("div");
		contentDiv.id = contentDivName;
		with (contentDiv)
		{
			className = "contentDiv";
			style.width = divWidth + "px";
			style.height = (divHeight + 2) + "px";
			innerHTML = "<iframe src='" + url + "' width='" + divWidth + "px' height='" + divHeight + "px' scrolling='auto' transparent='true' frameborder='0'></iframe>";
		}
		inner.appendChild(contentDiv);
		
		var innerDiv1 = document.createElement("div");
		with (innerDiv1)
		{
			className = "innerDiv1";
			style.width = (divWidth + 4) + "px";
			style.height = (divHeight + titleHeight + 8) + "px";
		}
		fullDiv.appendChild(innerDiv1);


		var innerDiv2 = document.createElement("div");
		with (innerDiv2)
		{
			className = "innerDiv2";
			style.width = (divWidth + 4) + "px";
			style.height = (divHeight + titleHeight + 8) + "px";
		}
		fullDiv.appendChild(innerDiv2);
		
		var innerDiv3 = document.createElement("div");
		with (innerDiv3)
		{
			className = "innerDiv3";
			style.width = (divWidth + 4) + "px";
			style.height = (divHeight + titleHeight + 8) + "px";
		}
		fullDiv.appendChild(innerDiv3);
		
		var innerDiv4 = document.createElement("div");
		with (innerDiv4)
		{
			className = "innerDiv4";
			style.width = (divWidth + 4) + "px";
			style.height = (divHeight + titleHeight + 8) + "px";
		}
		fullDiv.appendChild(innerDiv4);
		if (needCoverDiv)
		{
			var screenWidth = (document.documentElement.scrollWidth || document.body.scrollWidth);
			if (screenWidth < GetScreenWidth())
			{
				screenWidth = GetScreenWidth();
			}
			var screenHeight = (document.documentElement.scrollHeight || document.body.scrollHeight);
			if (screenHeight < GetScreenHeight())
			{
				screenHeight = GetScreenHeight();
			}
			var coverDiv = document.createElement("div");
			with (coverDiv)
			{
				id = coverDivName;
				className = "coverDiv";
				style.width = screenWidth + "px";
				style.height = screenHeight + "px";
			}
			document.body.appendChild(coverDiv);
		}
		function PositionDiv()
		{
			with (fullDiv.style)
			{
				left = GetDivLeft(divWidth) + "px";
				top = GetDivTop(divHeight) + "px";
			}
		}
		if (document.all)
		{
			window.attachEvent('onresize', PositionDiv);
		}
		else
		{
			window.addEventListener('resize', PositionDiv, true);
		}
	    var me = this;
	    titleDiv.onmousedown = function(e)
	    {
			e = e||event;
			if( e.layerX )
			{
				fullDiv.oOffset = {x:e.layerX,  y:e.layerY};
			}
			else
			{
				fullDiv.oOffset = {x:e.offsetX, y:e.offsetY };
			}
			document.onmousemove = me.drag;
			document.onmouseup   = me.drop;
			document.onselectstart = function(){ return false; };
		}
		this.drag = function(e)
		{
			e = e||event;
			fullDiv.style.top  = e.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - fullDiv.oOffset.y + "px";
			fullDiv.style.left = e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - fullDiv.oOffset.x + "px";
		}
		this.drop = function(e)
		{
			e=e||event;
			document.onmousemove = document.onmouseup = document.onselectstart = null;
		}
	}
	else
	{
	    CloseDiv();
	    PopDiv(title, url, divWidth, divHeight, needCoverDiv);
	}
}
function CloseDiv()
{
	var fullDiv = document.getElementById(fullDivName);
	if (fullDiv != null)
	{
		document.body.removeChild(fullDiv);
	}
	var coverDiv = document.getElementById(coverDivName);
	if (coverDiv != null)
	{
		document.body.removeChild(coverDiv);
	}
}
function GetDivLeft(divWidth)
{
	var scrollLeft = (document.documentElement.scrollLeft || document.body.scrollLeft);
	return (GetScreenWidth() - divWidth)/2 + scrollLeft;
}
function GetDivTop(divHeight)
{
	var scrollTop = (document.documentElement.scrollTop || document.body.scrollTop);
	return (GetScreenHeight() - divHeight)/3 + scrollTop;
}
function GetScreenWidth()
{
	return (window.innerWidth || document.documentElement && document.documentElement.clientWidth || document.body.clientWidth);
}
function GetScreenHeight()
{
	return (window.innerHeight || document.documentElement && document.documentElement.clientHeight || document.body.clientHeight);
}
function AddShadow()
{
	var obj;
	if(arguments.length == 1)
	{
		obj=document.getElementById?document.getElementById(arguments[0]):document.all[arguments[0]];
	}
	else if(arguments.length > 1)
	{
		for(var i=0;i<arguments.length;i++)
		{
			AddShadow(arguments[i]);
		}
	}
	else
	{
		return false;
	}
	if(!obj) return false;
	var userAgent=navigator.userAgent.toLowerCase();
	var isOpera = userAgent.indexOf('opera')>-1;
	var isIE = userAgent.indexOf('msie')>-1 && !isOpera;
	var isNS = userAgent.indexOf("netscape")>-1;
	
	var objWidth = obj.offsetWidth;
	var objHeight = obj.offsetHeight;
	var GetPosition = function(tempObj)
	{
		if(!tempObj) return false;
		var tempLeft = 0,tempTop = 0;
		if(isIE||isOpera)
		{
			while(tempObj!=null&&tempObj.nodeName!="#document")
			{
				tempLeft += tempObj.offsetLeft;
				tempTop += tempObj.offsetTop;
				tempObj = tempObj.parentNode;
			}
		}
		else
		{
			tempTop = tempObj.offsetTop;
			tempLeft = tempObj.offsetLeft;
		}
		return {Top:tempTop,Left:tempLeft};
	}

	var temp = GetPosition(obj);
	var objLeft = temp.Left;
	var objTop = temp.Top;
	
	var div1 = document.createElement("div");
	var div2 = document.createElement("div");
	var div3 = document.createElement("div");
	var div4 = document.createElement("div");
	var AddStyle = function(obj,cssText,append)
	{
		if(!obj) return false;
		if(!isOpera)
		{
			if(!append)
			{
				obj.style.cssText=cssText;
			}
			else
			{
				obj.style.cssText+=cssText
			}
		}
		else
		{
			if(!append)
			{
				obj.setAttribute("style",cssText);
			}
			else
			{
				obj.setAttribute("style",obj.getAttribute("style")+";"+cssText);
			}
		}
	}
	var sCssText="width:100%;height:100%;position:absolute;margin:0px;padding:0px;top:-1px;left:-1px"; 
	AddStyle(div1,"position:absolute;left:"+(objLeft+3)+"px;top:"+(objTop+3)+"px;width:"+objWidth+"px;height:"+objHeight+"px;background:#eee");
	AddStyle(div2,sCssText+";background:#ddd");
	AddStyle(div3,sCssText+";background:#ccc");
	AddStyle(div4,sCssText+";background:#fff");
	
	if(isIE||isNS)
	{
		AddStyle(div1,";z-index:-1",1);
	}
	else
	{
		var newNode=obj.cloneNode(true);
		newNode.removeAttribute("id");
		AddStyle(newNode,"visibility:hidden",1);
		obj.parentNode.insertBefore(newNode,obj);
		if(newNode.tagName=="P")
		{
			var BodyMargin=(document.documentElement.offsetHeight-document.body.offsetHeight)/2;
			objTop=objTop-BodyMargin;
		}
		AddStyle(obj,"position:absolute;z-index:2;left:+"+objLeft+"px;top:"+objTop+"px",1);
	}
	div1.appendChild(div2);
	div2.appendChild(div3);
	div3.appendChild(div4);
	document.body.appendChild(div1);
}

