/// <reference path="../jquery-1.3.2.js" />

/* Depends on:
-jquery-1.3.2.js
*/

var wnt = wnt == undefined ? new Object() : wnt;


/*
To use moreInfo just add the "moreInfo" className to a link
and set the link's title to the text you want to display 
*/
wnt.moreInfo = function() {
    var xOffset = 10; // x distance from mouse
    var yOffset = 0; // y distance from mouse
    var delay = 250;
    var oldEl = new Object();
    var showTimeoutId;
    var hideTimeoutId;    

    // Create the element to store text
    $('body').append('<div id="moreInfo"></div>');

    $(document.body).click(function() {
        $('div#moreInfo').hide("slow");
    });

    // On click event
    $('div#moreInfo').click(function(e) {
        e.stopPropagation();
    });

    // On Mouse leaving event
    $('div#moreInfo').mouseleave(function() {
        hideInfo();
    });
    
    // Function to display fly outs
    function showInfo(txt, top, left) {
        // if it is hiding, cancel the hide
        if (hideTimeoutId)
            clearTimeout(hideTimeoutId);

        // reposition and show the selected message
        showTimeoutId = setTimeout(function() {
            $('div#moreInfo').text(txt)
                            .css("top", top + "px")
                            .css("left", left + "px")
                            .show("slow");
        }, delay);
    }

    function hideInfo() {
        // if the event was "showing", cancel the show animation
        if (showTimeoutId)
            clearTimeout(showTimeoutId);

        hideTimeoutId = setTimeout(function() {
            $('div#moreInfo').hide("slow");
        }, delay);

        $('div#moreInfo').data('timeoutId', hideTimeoutId); //set the timeoutId, allowing us to clear this trigger if the mouse comes back over
    }

    $("a.moreInfo").each(function() {
        // store title and remove title attribute to prevent browser tool tips
        var title = $(this).attr('title');
        $(this).data('title', title);
        $(this).attr('title', '');

        var pos = $(this).position();
        this.top = pos.top + yOffset;
        this.left = pos.left + $(this).width() + xOffset;
        this.t = $(this).data('title');

        $(this).hover(function(e) {
            // if a popup is open, hide it
            var popEl = $('div#moreInfo');

            if (e.srcElement != oldEl) {
                var tx = this.t;
                var tp = this.top;
                var lf = this.left;
                popEl.hide("slow", function() {
                    showInfo(tx, tp, lf);
                });
            } else {
                showInfo(this.t, this.top, this.left);
            }

            oldEl = e.srcElement;
            e.preventDefault();
        });

        $(this).mouseleave(function(e) {
            hideInfo();
        });        
    });
};