$(function() {

    var showned_popup;
    var current_popup; //popup to be shown
    var delay_show = 450;
    var delay_hide = 225;
    var is_in_process = false;
    var can_change = true;

    // Tabs
    $('#tabs').tabs();

    $('#tabs').find('li.ui-corner-top').each(function() {
        $(this).css('borderColor', $(this).css('backgroundColor'));
        $(this).css('borderStyle', 'none');
        $(this).css('borderWidth', '1px');
        /*
        $(this).corner({
            tl: { radius: 4 },
            tr: { radius: 4 },
            bl: { radius: 0 },
            br: { radius: 0 },
            antiAlias: true,
            autoPad: true,
            validTags: ["li"]
        });
        */
        $(this).removeClass('ui-corner-top');
    });

    $('#tabs').bind('tabsshow', function(event, ui) {
        // Objects available in the function context:
        //        ui.tab     // anchor element of the selected (clicked) tab
        //        ui.panel   // element, that contains the selected/clicked tab contents
        //        alert('tabsshow' + ui.index);   // zero-based index of the selected (clicked) tab
        $('.has_event').each(function() {
            //initialize position and size
            var popup = $('td:last-child div.popup', this);
            popup.height($(this).height() + 78);
            popup.width($(this).width() + 20);
            popup.offset({ top: $(this).offset().top - 20, left: ($(this).offset().left - 7) });
            //initialize to invisible and opacity
            popup.css('display', 'none');
            popup.css('opacity', 0);
        });
    });
    $('.has_event').each(function() {
        //initialize position and size
        var popup = $('td:last-child div.popup', this);
        //popup.height($(this).height() + 78);
        popup.width($(this).width() + 20);
        popup.offset({ top: $(this).offset().top - 20, left: ($(this).offset().left - 7) });
        //initialize to invisible and opacity
        popup.css('display', 'none');
        popup.css('opacity', 0);

        $(this).mouseover(function() {
            //            debugger;
            current_popup = popup;
            if (is_in_process == true) return;
            //if (can_change == false) return;
            if (showned_popup == popup) return;

            if (showned_popup != undefined) {
                showned_popup.animate(
                        { opacity: 0 },
                        delay_hide,
                        function() {
                            $(this).css('display', 'none');
                        }
                        );
                showned_popup = undefined;
            }

            is_in_process = true;
            //            debugger;
            popup.css('display', 'inline');
            //            alert('offset.top = ' + $(this).offset().top + '  offset.left = ' + $(this).offset().left);
            popup.offset({ top: $(this).offset().top - 20, left: ($(this).offset().left - 7) });
            //            alert('popup.offset.top = ' + popup.offset().top + '  popup.offset.left = ' + popup.offset().left);
            popup.animate(
                        { opacity: 1 },
                        delay_show,
                        function() {
                            showned_popup = popup;
                            is_in_process = false;
                            can_change = false;
                        }
                        );
        });
    });

    //mouseoutevent
    $('.mouseoutevent').each(function() {
        $(this).mouseout(function() {
            if (window.event != null) {
                /* sadly, there's no "contains" method on Arrays.

                var fireEventAt = new Array();
                fireEventAt = ["DIV", "TR", "TD", "TABLE"];
                */
                if (window.event.srcElement.tagName == "DIV" || window.event.srcElement.tagName == "TABLE") {
                    if (showned_popup != undefined) {
                        showned_popup.css('display', 'none');
                        can_change = true;
                        showned_popup = undefined;
                    }
                }
            }
        });
    });

    // window handle
    $(document).mousemove(function(event) {
        var elmX1 = $('div#tabs').attr('offsetLeft');
        var elmY1 = $('div#tabs').attr('offsetTop');
        var elmX2 = elmX1 + $('div#tabs').outerWidth();
        var elmY2 = elmY1 + $('div#tabs').outerHeight();

        //document.title = 'x: ' + event.pageX + '- y: ' + event.pageY + ' -- left:' + elmX1 + ', top:' + elmX2 + ', height:' + elmY1 + ', width:' + elmY2;

        if ((event.pageX < elmX1-40) || (event.pageX > elmX2) || (event.pageY < elmY1) || (event.pageY > elmY2+40)) {
            $('div.popup').each(function() {
                $(this).css('display', 'none');
                can_change = true;
                showned_popup = undefined;
            });
        }
    });

});
