var jsAreaShowTime = 20000;
var JsAreas = new Object();

function GetArea(id)
{
	return JsAreas[id] ? JsAreas[id] : (JsAreas[id] = new JsArea(id));
}

// A single popup window
function JsArea(id)
{
	this.AreaId = id;
}

// Function to return the DIV Layer
JsArea.prototype.ContentArea= function()
{
	var divArea = document.getElementById(this.AreaId);
	if (divArea != null)
	{
		return divArea;
	}
	return null;
}

var activeAreaId = null;

// Function to show the DIV Layer
JsArea.prototype.popareaup = function(x, y) {
    if (activeAreaId != null)
        jsAreaClose(activeAreaId);

    var brwser_x, brwser_y;
    if (self.innerHeight) // all except Explorer
    {
        brwser_x = self.innerWidth;
        brwser_y = self.innerHeight;
    }
    else if (document.documentElement && document.documentElement.clientHeight)
    // Explorer 6 Strict Mode
    {
        brwser_x = document.documentElement.clientWidth;
        brwser_y = document.documentElement.clientHeight;
    }
    else if (document.body) // other Explorers
    {
        brwser_x = document.body.clientWidth;
        brwser_y = document.body.clientHeight;
    }
//    confirm(brwser_x + '#' + brwser_y);
    var divLayer = this.ContentArea();
    var containerWidth = parseInt($(divLayer).width(), 10);
    var containerHeight = parseInt($(divLayer).height(), 10);
    var displayX = x + containerWidth;
    if (displayX > brwser_x) {
        displayX = x - containerWidth;
    }
    else {
        displayX = x;
    }

    

//    var displayY = y + containerHeight;
//    confirm(displayY + '|' + y + '|' + brwser_y);
//    if (displayY > brwser_y) {
//        displayY = y - containerHeight;
//    }
//    else {
//        displayY = y;
//    }

    var displayY = y;

    divLayer.style.position = 'absolute';
    divLayer.style.display = 'block';
    //peter
    //firefox need the 'px' at the end
    divLayer.style.left = displayX + 'px';
    divLayer.style.top = displayY + 'px';
    divLayer.onmouseover = JsAreaMouseOver;
    divLayer.onmouseout = jsAreaMouseOut;
    activeAreaId = this.AreaId;

    return false;
}

// Function to hide the DIV Layer
JsArea.prototype.hide = function()
{
	var divLayer = this.ContentArea();
	if (divLayer != null)
		divLayer.style.display = 'none';
		
	return false;
}

// Function to be called
// by Web forms to show the Popup Window
function PopupArea(e, areaId)
{
	if (e.pageX || e.pageY)
	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else 
	if (e.clientX || e.clientY)
	{
		posx = e.clientX + document.body.scrollLeft;
		posy = e.clientY + document.body.scrollTop;
}
	var area = GetArea(areaId);
	area.popareaup(posx, posy);
}

// Function to hide the DIV Layer
function jsAreaClose(areaId)
{
	GetArea(areaId).hide();
	activeAreaId = divHangTimer = null;	
}

var divHangTimer = null;

// Function to keep the Div Layer
// showing for a "period" of time
// after that period, if the mouse
// has been outside the DIV Layer, 
// it will be hidden automatically
function KeepArea(areaId)
{
	if (areaId == activeAreaId && divHangTimer != null)
	{
		clearTimeout(divHangTimer);
		divHangTimer = null;
	}
}

// Function to release the DIV Layer
function RelArea(areaId)
{
	if (areaId == activeAreaId && divHangTimer == null)
		divHangTimer = setTimeout('jsAreaClose(\'' + areaId + '\')', jsAreaShowTime);
}

// Function fired when mouse is over the 
// DIV Layer, used to keep the layer showing
function JsAreaMouseOver(e)
{
	if (!e) 
		var e = window.event;
	var targ = e.target ? e.target : e.srcElement;
	KeepArea(activeAreaId);
}

// Function that fires when mouse is out of
// the scope of the DIV Layer
function jsAreaMouseOut(e)
{
	if (!e) 
		var e = window.event;
	var targ = e.relatedTarget ? e.relatedTarget : e.toElement;
	var activeAreaView = document.getElementById(activeAreaId);
	if (activeAreaView != null && !jsAreaContains(activeAreaView, targ))
		RelArea(activeAreaId);
}
function jsAreaContains(parent, child)
{
	while(child)
		if (parent == child) return true;
		else 
			child = child.parentNode;
		
		return false;
}

//////////////////////////////////////////////////////////////////////
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;

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);
    }
}

///////////////////////////////////////////////////