$(document).ready(function() {
    function show() {
        var caller = $(this);
        var pos = caller.offset();
        var width = caller.width();
        $("#popup").css({ left: (pos.left + width) + 'px', top: pos.top - 5 + 'px' });

        var url = "";
        var id = "";
        id = caller.attr('popup');

        if (id.indexOf('profile_') != -1) {
            url = "/api/api.asmx/GetProfilePopup";
            id = id.substring(8, id.length);
        }

        if (id.indexOf('guildsite_') != -1) {
            url = "/api/api.asmx/GetGuildsitePopup";
            id = id.substring(10, id.length);
        }

        if (id.indexOf('image_') != -1) {
            url = "/api/api.asmx/GetScreenshotPopup ";
            id = id.substring(6, id.length);
        }


        $.ajax({
            type: "POST",
            url: url,
            data: "{'contextKey':'" + id + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) { AjaxSucceeded(msg); },
            error: AjaxFailed
        });


        function AjaxSucceeded(result) { $("#popup").html(result.d); $("#popup").show(); }
        function AjaxFailed(result) { alert(result.status + ' ' + result.statustext); }
    }

    function hide() {
        var menu = $(this);
        $("#popup").html("")
        $("#popup").hide();
    }

    $(".popup").hoverIntent({
        sensitivity: 1, // number = sensitivity threshold (must be 1 or higher)
        interval: 100,   // number = milliseconds for onMouseOver polling interval
        over: show,     // function = onMouseOver callback (required)
        timeout: 100,   // number = milliseconds delay before onMouseOut
        out: hide       // function = onMouseOut callback (required)
    });
});