var layerId = null;
var layerShowType = '';

$(document).ready(function() {

    $('body').append('<div class="c24Frame" style="position: relative; left:0; bottom:0;"><div class="c24HelpOverlayer" style="display:none;" id="c24HelpOverlayer"></div></div>');

    $('.c24HelpLink').each(function(i, e) {

        if ($(e).css('position') == 'relative' || $(e).children('.c24HelpIcon').css('position') == 'relative') {
            $(e).parent().css('position', 'relative');
            $(e).parent().parent('td').css('position', 'relative');
        }

    });

    $('.c24Frame .c24HelpLink').click(function() {

        var layer = $($(this).next('.c24HelpOverlayer'));
        var image = $($(this).children('.c24HelpIcon'));

        layerShowType = 'click';
        handle_clicktip(this, layer.html(), image);

    });

    $(document).click(function(event) {

        var src = $(event.srcElement || event.target); // IE || Moz

        if (!src.hasClass('c24HelpIcon') && !src.hasClass('c24HelpOverlayer') && !src.hasClass('c24HelpLink') && !src.hasClass('c24SelfToolTipHandling')) {
            close_clicktip();
        }

    });

});

close_clicktip = function() {

    $('.c24Frame .c24HelpOverlayer').hide();

    layerId = null;
    layerShowType = '';

}

// Sender = this
// content = html
// image = image of click a element

handle_clicktip = function(sender, content, image) {

    var globalToolTip = $('#c24HelpOverlayer');

    var show = true;

    if (layerId != null && layerId == $(sender).attr('id') && layerShowType == 'click') {
        show = false;
    }

    if (content != '') {

        globalToolTip.hide();

        globalToolTip.html(content); // Set layer html content to global layer content

        var default_left = $(sender).offset().left;
        var default_top = $(sender).offset().top;

        default_top -= $(globalToolTip).height();
        default_top -= 13;

        if (jQuery.browser.msie == true && jQuery.browser.version >= 8.0) {
            default_top -= image.height() / 2; /* IE 8 has problems with offset calc */
        }

        default_left -= $(globalToolTip).width();
        default_left += $(image).width() / 2;
        default_left += 10 / 2; // Pointer width

        // Set values

        default_left = default_left - globalToolTip.parent().offset().left;

        default_top = default_top - globalToolTip.parent().offset().top;

        globalToolTip.css('top', default_top);
        globalToolTip.css('left', default_left);

        if (show) {

            globalToolTip.bgiframe();
            globalToolTip.show();

            layerId = $(sender).attr('id');

        } else {
            layerId = null;
        }

        if (globalToolTip.offset().left < 0) {

            // Turn right
            default_left = $(sender).offset().left;
            globalToolTip.children('.c24HelpPointer').css('left', 0);

        }

        if (globalToolTip.offset().top < 0) {

            // Turn down

            default_top = $(sender).offset().top - globalToolTip.parent().offset().top;

            default_top += image.height();
            default_left += 10; // Space

            globalToolTip.children('.c24HelpPointer').hide();

            default_left = $(sender).offset().left;

        }

        globalToolTip.css('top', default_top);
        globalToolTip.css('left', default_left);

    }

};