function debug(text){
//    document.getElementById('debug').innerHTML += '<BR>' + text;
}

function enableTooltips(id){

    help_images = getElementsByClassName(document, '*','help_img');

    for(i=0;i<help_images.length;i++){
        Prepare(help_images[i]);
    }
}

function Prepare(el){

    var help = el.id.replace('img_','');

    el.onmouseover = function(e){
        showTooltip(e, help);
    }
    el.onmouseout = function(e){
        hideTooltip(e, help);
    }
    el.onmousemove = function(e){
        showTooltip(e, help);
    }
}




function showTooltip(e, help){

    var posx=0,posy=0;
    if(e==null) e=window.event;
    if(e.pageX || e.pageY){
        posx=e.pageX; posy=e.pageY;
        }
    else if(e.clientX || e.clientY){
        if(document.documentElement.scrollTop){
            posx=e.clientX+document.documentElement.scrollLeft;
            posy=e.clientY+document.documentElement.scrollTop;
            }
        else{
            posx=e.clientX+document.body.scrollLeft;
            posy=e.clientY+document.body.scrollTop;
            }
    }

    var Bubble = document.getElementById('bubble_'+help); 
    
    Bubble.style.display = 'block';
    Bubble.style.zIndex = "1000";


    height_visible_screen = (window.innerHeight || document.documentElement.clientHeight);
    heigh_bubble_div      = Bubble.offsetHeight;
    heigh_cursor_position = posy;
    

        //allow these values to be altered from within the HTML
        help_alter_top = 20;
        if ( document.getElementById('bubble_'+help).getAttribute("help_alter_top") ){
           help_alter_top = parseInt( Bubble.getAttribute("help_alter_top") );
        }
        help_alter_left = 5;
        if ( document.getElementById('bubble_'+help).getAttribute("help_alter_left") ){
           help_alter_left = parseInt( Bubble.getAttribute("help_alter_left") );
        } 
        // end left,top setup
    

    bubble_style_top  = posy + help_alter_top;
    bubble_style_left = posx+help_alter_left;
    
    //if there is no space to display to bubble under the cursor, show it on top 
    if( (heigh_cursor_position + heigh_bubble_div + 20) > height_visible_screen ){
        bubble_style_top = (heigh_cursor_position - heigh_bubble_div - 5);
    }
    
    //Finally set the top/left
    Bubble.style.top = bubble_style_top+'px';
    Bubble.style.left = bubble_style_left+'px';    
    
}

function hideTooltip(e, help){
    document.getElementById('bubble_'+help).style.display = 'none';
}


window.onload = enableTooltips;