        var xmlHttp;
        var dataDiv;
        var dataTable;
        var dataTableBody;
        var offsetEl;

        function createXMLHttpRequest() {
            if (window.ActiveXObject) {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            else if (window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();                
            }
        }

        function initVars() {
            dataTableBody = document.getElementById("popupDataBody");            
            dataTable = document.getElementById("popupData");
            dataDiv = document.getElementById("popup");
        }

        function getpopupData(element) {
            initVars();            
            createXMLHttpRequest();
            offsetEl = element;
            var url = "/tooltip.jsp?key=" + escape(element.id);
            
            xmlHttp.open("GET", url, true);
            xmlHttp.onreadystatechange = callback;
            xmlHttp.send(null);
        }

        function callback() {
            if (xmlHttp.readyState == 4) {
                if (xmlHttp.status == 200) {
                    setData(xmlHttp.responseXML);
                }
            }
        }
        
        function setData(popupData) {            
            clearData();
            setOffsets();
            var title = popupData.getElementsByTagName("title")[0].firstChild.data;
            var message = popupData.getElementsByTagName("message")[0].firstChild.data;
            
            var row, row2;
            var titleData = " " + title
            var messageData = " " + message;
            
            row = createRow(titleData);            
            row2 = createRow(messageData);
            
            dataTableBody.appendChild(row);
            dataTableBody.appendChild(row2);
        }

        function createRow(data) {            
            var row, cell, txtNode;
            row = document.createElement("tr");
            cell = document.createElement("td");

            cell.setAttribute("bgcolor", "#999999");
            cell.setAttribute("border", "0");                           

            txtNode = document.createTextNode(data);
            cell.appendChild(txtNode);
            row.appendChild(cell);
           
            return row;  
        }
        
        function setOffsets() {
            var end = offsetEl.offsetWidth;
            var top = calculateOffsetTop(offsetEl);
            dataDiv.style.border = "black 1px solid";
            dataDiv.style.left = end + 15 + "px";
            dataDiv.style.top = top + "px";
        }
        
        function calculateOffsetTop(field) {
          return calculateOffset(field, "offsetTop");
        }

        function calculateOffset(field, attr) {
          var offset = 0;
          while(field) {
            offset += field[attr]; 
            field = field.offsetParent;
          }
          return offset;
        }

        function clearData() {            
            var ind = dataTableBody.childNodes.length;            
            for (var i = ind - 1; i >= 0 ; i--) {
                dataTableBody.removeChild(dataTableBody.childNodes[i]);       
            }
            dataDiv.style.border = "none";
        }        
