$(function () {
    var hideDelay = 500;
    var currentID;
    var hideTimer = null;

    // One instance that's reused to show info for the current person
    var container = $('<div id="personPopupContainer">'
      + '<table width="" border="0" cellspacing="0" cellpadding="0" align="center" class="personPopupPopup">'
      + '<tr>'
      + '   <td class="corner topLeft"></td>'
      + '   <td class="top"></td>'
      + '   <td class="corner topRight"></td>'
      + '</tr>'
      + '<tr>'
      + '   <td class="left">&nbsp;</td>'
      + '   <td><div id="personPopupContent"></div></td>'
      + '   <td class="right">&nbsp;</td>'
      + '</tr>'
      + '<tr>'
      + '   <td class="corner bottomLeft">&nbsp;</td>'
      + '   <td class="bottom">&nbsp;</td>'
      + '   <td class="corner bottomRight"></td>'
      + '</tr>'
      + '</table>'
      + '</div>');

    $('body').append(container);
    $('.personPopupTrigger').hover(function () {
        var urls = $(this).attr('lang');
        if (currentID == '')
            return;

        if (hideTimer)
            clearTimeout(hideTimer);

        var pos = $(this).offset();
        var width = $(this).width();
        var tops = pos.top + 20;
        var lefts = (pos.left + width - 40);
        container.css({
            left: lefts+'px',
            top: tops+'px'
        });
        if (urls.indexOf('?') < 0) {
            urls += "?";
        }
        else {
            urls += "&";
        }
        urls += "abcd=" + Math.random();
        $('#personPopupContent').html('&nbsp;');
        $('#personPopupContent').addClass('waitting-personPopupPopup-load');
        $.get(urls, function (respone) {
           // alert($(window).width());
            $('#personPopupContent').html(respone);
            $('#personPopupContent').removeClass('waitting-personPopupPopup-load');
           // alert($('#personPopupContainer').outerWidth(true) + "+" + lefts + "=" + ($('#personPopupContainer').find('table.personPopupPopup').outerWidth(true) + lefts) + ">" + $(window).width());
            if ($('#personPopupContainer').outerWidth(true)  + lefts > $(window).width()) {
                         //   alert("sdf");
                            container.css({
                                left:($(window).width() - $('#personPopupContainer').outerWidth(true)-40) + 'px'
                            });
                        }
        });
        container.css('display', 'block');
    }, function () {
        if (hideTimer)
            clearTimeout(hideTimer);
        hideTimer = setTimeout(function () {
            container.css('display', 'none');
        }, hideDelay);
    });
    /* $('.personPopupTrigger').live('mouseover', function () {
      

    var urls = $(this).attr('lang');
    if (currentID == '')
    return;

    if (hideTimer)
    clearTimeout(hideTimer);

    var pos = $(this).offset();
    var width = $(this).width();
    container.css({
    left: (pos.left + width / 2) + 'px',
    top: pos.top - 5 + 'px'
    });
    if (urls.indexOf('?') < 0) {
    urls += "?";
    }
    else {
    urls += "&";
    }
    urls += "abcd=" + Math.random();
    $('#personPopupContent').html('&nbsp;');
    $('#personPopupContent').addClass('waitting-personPopupPopup-load');
    $.get(urls, function (respone) {
    $('#personPopupContent').html(respone);
    $('#personPopupContent').removeClass('waitting-personPopupPopup-load');

    });
    container.css('display', 'block');
       
    });*/

    /* $('.personPopupTrigger').live('mouseout', function () {
    if (hideTimer)
    clearTimeout(hideTimer);
    hideTimer = setTimeout(function () {
    container.css('display', 'none');
    }, hideDelay);
       
    });*/

    // Allow mouse over of details without hiding details
    $('#personPopupContainer').mouseover(function () {
        if (hideTimer)
            clearTimeout(hideTimer);
    });

    // Hide after mouseout
    $('#personPopupContainer').mouseout(function () {
        if (hideTimer)
            clearTimeout(hideTimer);
        hideTimer = setTimeout(function () {
            container.css('display', 'none');
        }, hideDelay);
    });
});