/**
 *  Tooltip class. Attaches a tooltip div to an element
 *  Fetches content from textdiv and attaches to icon
 */

function toolTip(icon, textdiv) {

    var ic = document.getElementById(icon);
    var td = document.getElementById(textdiv);
    var outer;
    
    var createDiv = function() {
        outer = document.createElement('div');
        var inner = document.createElement('div');
        outer.setAttribute('class', 'tooltip');
        inner.innerHTML = td.innerHTML;
        outer.appendChild(inner);
        document.body.appendChild(outer);
        outer.style.position = 'absolute';
        outer.style.dispay = 'none';
        var pos = cumulativeOffset(ic);
        outer.style.top = (pos.top - outer.offsetHeight - 5) + 'px';
        outer.style.left = (pos.left - outer.offsetWidth + ic.offsetWidth) + 'px';
    };
    
    var cumulativeOffset = function(el) {
        var os = { top: 0, left: 0 };
        while(el && el != document.body) {
            os.top += el.offsetTop;
            os.left += el.offsetLeft;
            el = el.offsetParent;
        }
        return os;
    };

    ic.onmouseover = function(e) {
        if(!outer) createDiv();
        outer.style.display = 'block';
    };
    
    ic.onmouseout = function() {
        outer.style.display = 'none';
    };

}