// Determine browser and version.
	function Browser() {
		var ua, s, i;
		
		this.isIE    = false;
		this.isNS    = false;
		this.version = null;
		
		ua = navigator.userAgent;
		
		s = "MSIE";
		if ((i = ua.indexOf(s)) >= 0) {
			this.isIE = true;
			this.version = parseFloat(ua.substr(i + s.length));
			return;
		}
		
		s = "Netscape6/";
		if ((i = ua.indexOf(s)) >= 0) {
			this.isNS = true;
			this.version = parseFloat(ua.substr(i + s.length));
			return;
		}
		
		// Treat any other "Gecko" browser as NS 6.1.
		s = "Gecko";
		if ((i = ua.indexOf(s)) >= 0) {
			this.isNS = true;
			this.version = 6.1;
			return;
		}
	}
	var browser = new Browser();
	
// Global object to hold drag information.
	var dragObj = new Object();
	dragObj.zIndex = 0;
	
/* --------------------------------------------------
	Drag Functions
-------------------------------------------------- */
	function dragStart(event, id) {
		var el;
		var x, y;
		
		// If an element id was given, find it. Otherwise use the element being clicked on.
		if (id)
			dragObj.elNode = document.getElementById(id);
		else {
			if (browser.isIE)
				dragObj.elNode = window.event.srcElement;
			if (browser.isNS)
				dragObj.elNode = event.target;
			
			// If this is a text node, use its parent element.
			if (dragObj.elNode.nodeType == 3)
				dragObj.elNode = dragObj.elNode.parentNode;
		}
		
		// Get cursor position with respect to the page.
		if (browser.isIE) {
			x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
			y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
		}
		if (browser.isNS) {
			x = event.clientX + window.scrollX;
			y = event.clientY + window.scrollY;
		}
		
		// Save starting positions of cursor and element.
		dragObj.cursorStartX = x;
		dragObj.cursorStartY = y;
		dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
		dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);
		
		if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
		if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;
		
		// Update element's z-index.
		//dragObj.elNode.style.zIndex = ++dragObj.zIndex;
		
		// Capture mousemove and mouseup events on the page.
		if (browser.isIE) {
			document.attachEvent("onmousemove", dragGo);
			document.attachEvent("onmouseup",   dragStop);
			window.event.cancelBubble = true;
			window.event.returnValue = false;
		}
		if (browser.isNS) {
			document.addEventListener("mousemove", dragGo,   true);
			document.addEventListener("mouseup",   dragStop, true);
			event.preventDefault();
		}
	}
	
	function dragGo(event) {
		var x, y;
		
		// Get cursor position with respect to the page.
		if (browser.isIE) {
			x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
			y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
		}
		if (browser.isNS) {
			x = event.clientX + window.scrollX;
			y = event.clientY + window.scrollY;
		}
		
		// Move drag element by the same amount the cursor has moved.
		dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
		dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";
		
		if (browser.isIE) {
			window.event.cancelBubble = true;
			window.event.returnValue = false;
		}
		if (browser.isNS)
			event.preventDefault();
	}
	
	function dragStop(event) {
		// Stop capturing mousemove and mouseup events.
		if (browser.isIE) {
			document.detachEvent("onmousemove", dragGo);
			document.detachEvent("onmouseup",   dragStop);
		}
		if (browser.isNS) {
			document.removeEventListener("mousemove", dragGo,   true);
			document.removeEventListener("mouseup",   dragStop, true);
		}
	}
	
/* --------------------------------------------------
	Showbox Variables
-------------------------------------------------- */
// unit of measurement is pixel
	var titleHeight = 35;
	var curveRadius = 5;
	var de = document.documentElement;
	var winW = (typeof(window.innerWidth)=="number" ? window.innerWidth : (de ? de.clientWidth : document.body.clientWidth));
	var winH = (typeof(window.innerHeight)=="number" ? window.innerHeight : (de ? de.clientHeight : document.body.clientHeight));
	
/* --------------------------------------------------
	Showbox Functions
-------------------------------------------------- */
	function hideTheBox() {
		var theBox = document.getElementById("box");
		theBox.style.top = '-9999em';
		theBox.style.left = '-9999em';
		
		var theLayer = document.getElementById("layer");
		theLayer.style.top = '-9999em';
		theLayer.style.left = '-9999em';
	}
	
/* --------------------------------------------------
	Update Showbox
-------------------------------------------------- */
	function updateShowbox(boxTitle, boxContent, boxW, boxH, isModal, isDrag) {
		
		if(typeof(boxTitle)=="undefined") boxTitle = "";
		if(typeof(boxContent)=="undefined") {
			if(boxTitle!="") {
				boxContent = boxTitle;
				boxTitle = "";
			} else {
				return;
			}
		} else {
			boxContent = unescape(boxContent);
		}
		if(typeof(boxW)=="undefined" || boxW==0) boxW = Math.ceil(winW * 0.6);
		if(typeof(boxH)=="undefined" || boxH==0) boxH = Math.ceil(winH * 0.6);
		if(typeof(isModal)=="undefined") isModal = 1;
		if(typeof(isDrag)=="undefined") isDrag = 1;
		
		var theBox = document.getElementById("box");
		theBox.style.width = boxW+'px';
		theBox.style.height = boxH+'px';
		var scrollX = self.pageXOffset || (de && de.scrollLeft) || document.body.scrollLeft;
		var scrollY = self.pageYOffset || (de && de.scrollTop) || document.body.scrollTop;
		
		var theLayer = document.getElementById("layer");
		if(isModal) {
			theLayer.style.top = scrollY+'px';
			theLayer.style.left = scrollX+'px';
		} else {
			theLayer.style.top = '-9999em';
			theLayer.style.left = '-9999em';
		}
		
		var boxSrc = '<table width="100%" height="100%" border="0" cellpadding="5" cellspacing="2">'+
				(boxTitle!="" ? '<tr><td height="10" class="boxedhead" '+(isDrag ? 'onmousedown="dragStart(event, \'box\');"' : '')+'>'+boxTitle+'</td></tr>' : '')+
			'	<tr valign="top"><td height="100%" class="boxed">'+
					boxContent+
			'	</td></tr>'+
				(boxContent.indexOf("hideTheBox")==-1 ? '<tr valign="top"><td height="10" class="boxed" align="right"><a href="javascript:hideTheBox();">close</a></td></tr>' : '') +
			'</table>';
		
		theBox.style.top = (((winH-boxH)/2)+scrollY)+'px';
		theBox.style.left = (((winW-boxW)/2)+scrollX)+'px';
		theBox.innerHTML = boxSrc;
	}
	
/* --------------------------------------------------
	Print Hidden Showbox and Layer
-------------------------------------------------- */
	document.write(
		'<div id="layer"></div>',
		'<div id="box"></div>'
	);