// (C) Copyright 2008, Compulutions B.V.

// Depends on Compulutions.Base.Common.js

// [RK] 20080403

var activeTT = null;

toolTipInit = function()
{
    var imgElms = document.getElementsByTagName('img');
    var imgElmsLen = imgElms.length;
    
    for (var i = 0; i < imgElmsLen; i++)
    {
        var imgElm = imgElms[i];
        if (imgElm.className.indexOf('imagebank') > -1)
        {
            imgElm.ToolTip = {
                MouseIn : false,
                IsOpen : false,
                ImgElm : imgElm,
                X : 0,
                Y : 0
            }
            
            imgElm.onmouseover = function(evt)
            {
                evt = evt || event;
                if (this.ToolTip.IsOpen)
                    return;
                    
                if (activeTT != null)
                    if (activeTT != this.ToolTip)
                        cancelToolTip(activeTT);
                    
                this.ToolTip.X = evt.clientX + scrollX();
                this.ToolTip.Y = evt.clientY + scrollY();
                
                this.onmousemove = function(evt)
                {
                    evt = evt || event;
                    if (!this.ToolTip.IsOpen)
                    {
                        this.ToolTip.X = evt.clientX + scrollX();
                        this.ToolTip.Y = evt.clientY + scrollY();
                    }
                }
                
                this.ToolTip.tHandle = setTimeout(function(ref)
                {
                    return function()
                    {
                        ref.onmousemove = null;
                        ref.ToolTip.tHandle = null;
                        activeTT = ref.ToolTip;
                        ref.ToolTip.IsOpen = true;
                        drawToolTip(ref.ToolTip);
                    }
                }(this), 1000);
            }
           
            imgElm.onmouseout = function()
            {
                // Event tug-of-war :(
                setTimeout(function(ref)
                {
                    return function()
                    {
                        if (ref.ToolTip.MouseIn)
                            return;
                        
                        ref.onmousemove = null;
                        cancelToolTip(ref.ToolTip);
                    }
                }(this), 20);
            }
                        
            imgElm.onclick = function()
            {
                this.onmousemove = null;
                cancelToolTip(this.ToolTip);
            }
        }
    }
}

cancelToolTip = function(tt)
{
    if (tt.IsOpen)
    {
        closeToolTip(tt);
        tt.MouseIn = false;
        tt.IsOpen = false;
        activeTT = null;
    }
    
    if (tt.tHandle != null)
    {
        clearTimeout(tt.tHandle);
        tt.tHandle = null;
    }
}


drawToolTip = function(tt) 
{
    var ttElm = document.createElement('div');
    
    ttElm.onmouseover = function() { tt.MouseIn = true; }
    ttElm.onmouseout = function() { tt.MouseIn = false; }
    ttElm.onclick = function() { cancelToolTip(tt); }
    
    ttElm.className = 'tooltip';
    
    with (ttElm.style)
    {
        position = 'absolute';
        left = (+tt.X + 2) + 'px';    // Plus 2, or else the imgElm.onmouseout will trigger immidiately
        top = (+tt.Y + 2) + 'px';
        zIndex = '99999';
    }
    
    tt.ttElm = ttElm;
    
    var loaderImg = document.createElement('img');
    loaderImg.src = 'gfx/loader.gif';
    loaderImg.className = 'tooltipLoader';

    ttElm.appendChild(loaderImg);
  
    document.body.appendChild(ttElm);
    
    var server = getXmlHttp();
    
    server.onreadystatechange = function()
    {
        if (server.readyState == 'complete' || server.readyState == 4)
        {
            if (!tt.IsOpen)
                return;
            
            var xmlDoc = server.responseXML;
            var ttTable = document.createElement('table');
            var ttTbody = document.createElement('tbody');
            
            var rows = xmlDoc.getElementsByTagName('Row');
            var rowsLen = rows.length;

            for (var i = 0; i < rowsLen; i++)
            {
                var tr = document.createElement('tr');
                var tdName = document.createElement('td');
                var tdValue = document.createElement('td');
                
                
                var currentRow = rows[i];
                
                var nameElement = currentRow.getElementsByTagName('Name')[0];
                var nameNameName;
                if (nameElement.firstChild == null)
                    nameNameName = ' ';
                else
                    nameNameName = nameElement.firstChild.nodeValue;
                
                tdName.appendChild(document.createTextNode(nameNameName));
                
                if (currentRow.getAttribute('valuetype') != null && currentRow.getAttribute('valuetype') == 'image')
                {
                    var img = document.createElement("img");
                    img.src = '/gfx/icons/' + currentRow.getElementsByTagName('Value')[0].firstChild.nodeValue + '.gif';
                    tdValue.appendChild(img);
                }
                else
                {
                    tdValue.appendChild(document.createTextNode(currentRow.getElementsByTagName('Value')[0].firstChild.nodeValue));
                }
                
                tr.appendChild(tdName);
                tr.appendChild(tdValue);
                ttTbody.appendChild(tr);
            }
            
            ttTable.appendChild(ttTbody);
            tt.ttElm.removeChild(tt.ttElm.firstChild);
            tt.ttElm.appendChild(ttTable);
        }
    }
    
    server.open('GET', tt.ImgElm.parentNode.href + '&ts=' + Math.random());
    server.send(null);
}

closeToolTip = function(tt)
{
    tt.ttElm.parentNode.removeChild(tt.ttElm);
    tt.ttElm = null;
}

addEvent(window, 'load', toolTipInit);