$(document).ready(function(){initPopupHints();});
$.fn.x = function(n) {
     var result = null;
     this.each(function() {
         var o = this;
         if (n === undefined){
             var x = 0;
             if (o.offsetParent) {
                 while (o.offsetParent) {
                     x += o.offsetLeft;
                     o = o.offsetParent;
                 }
             }
             if (result === null){result = x;} 
             else {result = Math.min(result, x);}
         } else {o.style.left = n + 'px';}
     });
     return result;
};
$.fn.y = function(n) {
     var result = null;
     this.each(function(){
         var o = this;
         if (n === undefined) {
             var y = 0;
             if (o.offsetParent) {
                 while (o.offsetParent) {
                     y += o.offsetTop;
                     o = o.offsetParent;
                 }
             }
             if (result === null){result = y;}else{result = Math.min(result, y);}
         }else {o.style.top = n + 'px';}
     });
     return result;
};
function initPopupHints() {
    var popup = $('#popupHint');
    if (!popup) { return; }

    $('.jsDisplayPopup').each(function() {
        $(this).bind("focus", function(e) {
            popup.css('left', $(this).x() + 320);
            popup.css('top', $(this).y()- 20);
            $('#popupHintContent').html($(this).parent().find('.hint-content').html());
            if ($(document).width() < (parseInt(popup.css('left')) + 300)) {
                if (!popup.hasClass('right')) { popup.addClass('right'); popup.removeClass('left'); }
                popup.css('left', $(this).x() - 415);
            } else {popup.removeClass('right');popup.addClass('left');}
            popup.fadeIn('fast');
            $('#popupHintClose').click(function(){popup.css('display', 'none');});
        });
//        $(document).bind("focus", function(e){popup.css('display', 'none');});
//        $(document).bind("click", function(e){popup.css('display', 'none');});
    });
}