var mainmenu;

(function($) {
    mainmenu = {
        orientation: 'h',
        
        transition: {
            overtime:200,
            outtime:200
        }, //duration of slide in/ out animation, in milliseconds
        
        showhidedelay: {
            showdelay: 100, 
            hidedelay: 300
        }, //set delay in milliseconds before sub menus appear and disappear, respectively
    
        init: function() {
            var menu = $('#mainmenu > ul');
            var headers = $(menu).find('ul').closest('li');
            
            $(headers).hover(
                function() {
                    $(this).addClass('selected');
                },
                function() {
                    $(this).removeClass('selected');
                }                
            );
                
            $(headers).each(function(idx) {
                var curobj = $(this).css({
                    zIndex: 100 - idx
                });
                
                var subul = $(this).find('ul:eq(0)').css({
                    display: 'block'
                });
                
                $(subul).data('timers', {});
                
                this._dimensions = {
                    w: this.offsetWidth + 2, 
                    h: this.offsetHeight, 
                    subulw: $(subul).outerWidth(), 
                    subulh: $(subul).outerHeight()
                }
                
                this.isTopHeader = $(curobj).parents('ul').length == 1 ? true : false //is top level header?
                $(subul).css({
                    top: this.isTopHeader && mainmenu.orientation != 'v' ? this._dimensions.h+"px" : 0
                });
                
                $(curobj).hover(
                    function() {
                        var targetul = $(subul); //reference UL to reveal
                        var header = $(curobj).get(0); //reference header LI as DOM object
                        
                        clearTimeout($(targetul).data('timers').hidetimer);
                        
                        $(targetul).data('timers').showtimer = setTimeout(function() {
                            header._offsets = {
                                left: $(curobj).offset().left,
                                top: $(curobj).offset().top
                            };
                            
                            var menuleft = header.isTopHeader && mainmenu.orientation != 'v' ? 0 : header._dimensions.w;
                            //calculate this sub menu's offsets from its parent
                            menuleft = (header._offsets.left + menuleft + header._dimensions.subulw > $(window).width()) ? (header.isTopHeader && mainmenu.orientation != 'v' ? -header._dimensions.subulw + header._dimensions.w : -header._dimensions.w + 30) : menuleft;
                            
                            if ($(targetul).queue().length <= 1){ //if 1 or less queued animations
                                $(targetul).css({
                                    left: menuleft+"px", 
                                    width: header._dimensions.subulw+'px'
                                }).animate({
                                    height: 'show',
                                    opacity: 'show'
                                }, mainmenu.transition.overtime);
                            }
                        }, mainmenu.showhidedelay.showdelay)
                    },
                    function() {
                        var targetul = $(subul);
                        
                        clearTimeout($(targetul).data('timers').showtimer);
                        
                        $(targetul).data('timers').hidetimer = setTimeout(function() {
                            $(targetul).animate({
                                height: 'hide', 
                                opacity: 'hide'
                            }, mainmenu.transition.outtime);                            
                        }, mainmenu.showhidedelay.hidedelay)
                    }
                );
            });
            
            $(menu).find('ul').css({
                display: 'none', 
                visibility: 'visible'
            });
        }
    };
    
    $(document).ready(function(){ mainmenu.init(); });
})(jQuery);

