﻿    var hideCallout = true;
    var HOVER_DELAY = 1000;

    function showCallout(element){
        $('#calloutBox').remove();
        $('#calloutTip').remove();
	    hideCallout = false;
        bindMouseLeave(element);
        
        var calloutWidth = $(element).attr("calloutWidth");
        var calloutHeight = $(element).attr("calloutHeight");
        $("<div id='calloutBox'><table cellspacing='0' style='width:" + calloutWidth + ";height:" + calloutHeight + ";' class='nopad' border='0'><tr><td class='popup_tl'></td><td class='popup_tm'></td><td class='popup_tr'></td></tr><tr><td class='popup_ml'></td><td class='popup_bg'><div class='calloutContent'></div></td><td class='popup_mr'></td></tr><tr><td class='popup_bl'></td><td class='popup_bm'></td><td class='popup_br'></td></tr></table></div>").appendTo('body');
        $("<div id='calloutTip' ></div>").appendTo('body');
        
        var tipTop = $(element).position().top + 6;
        $('#calloutTip').css('top', tipTop);
        var tipLeft = $(element).position().left + $(element).width() + 14;
        $('#calloutTip').css('left', tipLeft);
        
        var boxTop = tipTop - 40;
        $('#calloutBox').css('top', boxTop);
        var boxLeft = tipLeft + $('#calloutTip').width() - 2;
        $('#calloutBox').css('left', boxLeft);
        
        $('#calloutTip').bind('mouseenter', function(){ hideCallout = false; });
        $('#calloutBox').bind('mouseenter', function(){ hideCallout = false; });
        bindMouseLeave($('#calloutBox'));
        bindMouseLeave($('#calloutTip'));
        
        $('.calloutContent').html($("#" + $(element).attr('contentId')).html());
        
        $('#calloutTip').fadeIn('fast');
        $('#calloutBox').fadeIn('fast');
    }
    
    function bindMouseLeave(element) {
        $(element).bind('mouseleave', function(){
            hideCallout = true;
            setTimeout(hideCalloutBox, HOVER_DELAY);
        });
    }
    
    function hideCalloutBox(){
        if(hideCallout) {
            $('#calloutBox').remove();
            $('#calloutTip').remove();
        }
    }
    
    $(document).ready(function() {
		$("a[@class='callout']").unbind("mouseenter").bind('mouseenter',function(){
		    showCallout(this);
		});
    });