/** menu ****************/
jQuery(function() {
    
    var $ = jQuery;
    // retarder
    $.fn.retarder = function(delay, method){
        var node = this;
        if (node.length){
            if (node[0]._timer_) clearTimeout(node[0]._timer_);
            node[0]._timer_ = setTimeout(function(){ method(node); }, delay);
        }
        return this;
    };
    
    // base rules
    $('#menu').addClass('js-active');
    $('ul div', '#menu').css('visibility', 'hidden');
    $('.menu>li', '#menu').hover(
        function(){
            var ul     = $('div:first', this);
            if (ul.length){
                if (!ul[0].hei) ul[0].hei = ul.height();
                ul.css({height: 20, overflow: 'hidden'}).retarder(400, function(i){
                    i.css('visibility', 'visible').animate({height: ul[0].hei}, {duration: 400, complete : function(){ ul.css('overflow', 'visible'); }});
                });
            }
        },
        function(){
            var ul  = $('div:first', this);
            if (ul.length){
                var css = {visibility: 'hidden', height: ul[0].hei};
                ul.stop().retarder(1, function(i){ i.css(css); });
                
            }
        }
    );
    
    $('ul ul li', '#menu').hover(
        function(){
            var ul     = $('div:first', this);
            if (ul.length){
                if (!ul[0].wid) ul[0].wid = ul.width();
                ul.css({width: 0, overflow: 'hidden'}).retarder(400, function(i){
                    i.css('visibility', 'visible').animate({width: ul[0].wid}, {duration: 400, complete : function(){ ul.css('overflow', 'visible'); }});
                });
            }
        },
        function(){
            var ul  = $('div:first', this);
            if (ul.length){
                var css = {visibility: 'hidden', width: ul[0].wid};
                ul.stop().retarder(1, function(i){ i.css(css); });
            }
        }
    );
    
});