var _makeBoxHighestZIndex = 500;
function PopIn(ContentElem, LocationX, LocationY, ContentElemX, ContentElemY) {
	if(typeof LocationX == "undefined" || typeof LocationY == "undefined" || typeof ContentElemX == "undefined" || typeof ContentElemY == "undefined") {
		var LocationX = parseInt(document.body.offsetWidth/2) - 200;
		var LocationY = parseInt(document.body.offsetHeight/2) - 125;
		var ContentElemX = 400;
		var ContentElemY = 250;
	}
	//the dimensions of the drop shadow
	var dsX = 13;
	var dsY = 13;
	var box = document.createElement("div");
	//box.style.display="none";
	box.style.width=(ContentElemX+dsX)+"px";
	box.style.height=(ContentElemY+dsY)+"px";
	if(LocationX > -1 && LocationY > -1) {
		box.style.position="absolute";
		box.style.left=LocationX+"px";
		box.style.top=LocationY+"px";
	} else {
		var nextSib = ContentElem.nextSibling;
	}

	var table = document.createElement('table');
	
	table.setAttribute("cellpadding", "0");
	table.setAttribute("cellspacing", "0");
	table.setAttribute("border", "0");
	table.cellPadding = 0;
	table.cellSpacing = 0;
	table.border = 0;
	//create standard td
	var td = document.createElement("td");
	td.style.padding = "0px";
	
	var tbody = table.appendChild(document.createElement("tbody"));
	var tr1 = tbody.appendChild(document.createElement("tr"));
	var tr2 = tbody.appendChild(document.createElement("tr"));
	var td1 = tr1.appendChild(td.cloneNode(true));
	var td2 = tr1.appendChild(td.cloneNode(true));
	//top right corner drop shadow
	var toprightds = td2.appendChild(document.createElement("div"));
	toprightds.style.width = dsX + "px";
	toprightds.style.height = dsY + "px";
	toprightds.style.backgroundImage = "url(/images/dropshadow/corner.png)";
	toprightds.style.backgroundPosition = "-16px 0px";
	toprightds.style.backgroundRepeat = "no-repeat";
	//right side drop shadow
	var	rightds = td2.appendChild(document.createElement("div")); 
	rightds.style.width = dsX + "px";
	rightds.style.height = (ContentElemY-dsY) + "px";
	rightds.style.backgroundImage = "url(/images/dropshadow/side.png)";
	rightds.style.backgroundPosition = "-16px 0px";
	rightds.style.backgroundRepeat = "repeat-y";
	//the last row has a table to divide the left from the rest of the bottom shadow
	var td3 = tr2.appendChild(document.createElement("td"));
	var innerTable = td3.appendChild(table.cloneNode(false));
	var innerTbody = innerTable.appendChild(document.createElement("tbody"));
	var innerTr = innerTbody.appendChild(document.createElement("tr"));
	//bottom left corner drop shadow
	var bottomleftds = innerTr.appendChild(td.cloneNode(true));
	bottomleftds.style.width = dsX + "px";
	bottomleftds.style.height = dsY + "px";
	bottomleftds.style.backgroundImage = "url(/images/dropshadow/corner.png)";
	bottomleftds.style.backgroundPosition = "0px -16px";
	bottomleftds.style.backgroundRepeat = "no-repeat";
	//bottom edge drop shadow
	var bottomds = innerTr.appendChild(td.cloneNode(true));
	bottomds.style.width = ContentElemX + "px";
	bottomds.style.height = dsY + "px";
	bottomds.style.backgroundImage = "url(/images/dropshadow/bottom.png)";
	bottomds.style.backgroundPosition = "0px -16px";
	bottomds.style.backgroundRepeat = "repeat-x";
	//bottom right drop shadow
	var bottomrightds = tr2.appendChild(td.cloneNode(true));
	bottomrightds.style.width = dsX + "px";
	bottomrightds.style.height = dsY + "px";
	bottomrightds.style.backgroundImage = "url(/images/dropshadow/corner.png)";
	bottomrightds.style.backgroundPosition = "-16px -16px";
	bottomrightds.style.backgroundRepeat = "no-repeat";
	
	box.style.zIndex = 500;
	if(LocationX > -1 && LocationY > -1) {
		document.body.appendChild(box);
		box.appendChild(table);
		td1.appendChild(ContentElem);
		td1.style.verticalAlign = "top";
		//td1.style.backgroundColor="white";
		//box.onclick = function () {this.parentNode.removeChild(this);};
	} else {
		var helper = ContentElem.cloneNode(false);
		document.body.appendChild(box);
		box.appendChild(table);
		td1.appendChild(ContentElem);
		td1.style.backgroundColor="white";
		nextSib.parentNode.insertBefore(helper,nextSib);
		helper.style.padding = "0px";
		helper.style.border = "0px";
		helper.appendChild(box);
	}
	
	
	

	
	
	box.onmousedown = box.ondrag = function(e) { 
		if (!e) var e = window.event;
		
		if(this.style.zIndex < _makeBoxHighestZIndex) {
			_makeBoxHighestZIndex++;
			this.style.zIndex = _makeBoxHighestZIndex;
		}
		
		var CursorBoxOffsetX = e.clientX - this.offsetLeft;
		var CursorBoxOffsetY = e.clientY - this.offsetTop;
		this.onmousemove = 
		function(e) { 
			if (!e) var e = window.event;
			this.style.left = e.clientX - CursorBoxOffsetX +"px";
			this.style.top = e.clientY -CursorBoxOffsetY +"px";
		};
		
	};
	
	box.onmouseup = box.onmouseout = function() {
		this.onmousemove = 
		function(e) { 	};
		
	};
	document.body.appendChild(box);
	return box;

}

function createChatBox(message, type, width, height) {
	if(typeof width == "undefined") var width = 350;
	if(typeof height == "undefined") var height = 250;
	var modal = document.createElement("div");
	modal.style.zIndex = 499;
	setOpacity(modal, .7);
	modal.style.backgroundColor = "#000000";
	modal.style.position = "absolute";
	document.body.appendChild(modal);
	var div = document.createElement("div");
	//var titlebar = document.createElement("div");
	var text = document.createElement("div");
	text.style.fontSize = "12px";
	text.innerHTML = "<img src='/images/dialog/"+type+".png' style='float:left;padding-right:10px;padding-bottom-10px;'/>" + message + "<br/><br/><div style='text-align:center;'><button>close</button></div>";
	//div.appendChild(titlebar);
	//div.appendChild(text);
	
	
		
	div.innerHTML = fulltext;
	
	text.style.backgroundColor = "#EEEDE2";
	text.style.height = height - 52 +"px";
	text.style.border = "3px solid blue";
	text.style.borderTopWidth = "0px";
	text.style.padding = "10px";
	text.getElementsByTagName("button")[0].onclick = function() {
		box.parentNode.removeChild(box);
	};

		var box = PopIn(div, parseInt(document.body.offsetWidth/2) - 175, parseInt(document.body.offsetHeight/2) - 125, width, height);

}

function displayAlert(message, type) {
	
}

	
function setOpacity(elem, op) {
	elem.style.MozOpacity = op;
	elem.style.KhtmlOpacity = op;
	elem.style.MsFilter = "progid:DXImageTransform.Microsoft.Alpha(Opacity="+parseInt(op*100)+")";
	elem.style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity="+parseInt(op*100)+")";
	elem.style.opacity = op;
}

function getOSFromUserAgent() {
	if(navigator.userAgent.search(/Windows NT 5\.1/) != -1) 
		return "Windows XP";
	if(navigator.userAgent.search(/Windows NT 6\.0/) != -1) 
		return "Windows Vista";
	if(navigator.userAgent.search(/M(a|A)(c|C) ?OS ?X/) != -1) 
		return "Mac OS X";
	if(navigator.userAgent.search(/Linux/) != -1) 
		return "Linux";
	return "unknown";
		
}

<!--- This function gets the top left pixel position of an element--->
function getTopLeft(elem) {
	var parent = elem;
	var x = 0;
	var y = 0;
	while(parent != document.body && parent != null)	{
		if(parent.offsetLeft)x = x + parent.offsetLeft;
		if(parent.offsetTop)y = y + parent.offsetTop;
		parent = parent.offsetParent;
	}
	if( parent != null) {
		x = x + parent.offsetLeft;
		y = y + parent.offsetTop;
	}
	return [x,y];
}