//** Smooth Navigational Menu- By Dynamic Drive DHTML code library: http://www.dynamicdrive.com
//** Script Download/ instructions page: http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/
//** Menu created: Nov 12, 2008

var ddsmoothmenu = {

//Specify full URL to down and right arrow images (23 is padding-right added to top level LIs with drop downs):
arrowimages: {down:['downarrowclass', 'images/down.gif', 23], right:['rightarrowclass', 'images/right.gif']},

transition: {overtime: 300, outtime: 300},

detectwebkit: (navigator.userAgent.toLowerCase().indexOf("applewebkit") != -1), //detect WebKit browsers (Safari, Chrome etc)

buildmenu: function($, setting){
    var smoothmenu = ddsmoothmenu;
    
    //reference main menu UL
    var $mainmenu = $("#" + setting.mainmenuid + ">ul");
    
    var $headers = $mainmenu.find("ul").parent();
    
    //var $headers = $mainmenu.find("li.submenu_item");
    
    //headers = elke li met een ul erin
    
    $headers.hover(
        function(e) { //on
            $(this).children('a:eq(0)').addClass('selected');
        },
        
        function(e) { //out
            $(this).children('a:eq(0)').removeClass('selected');
        }
    );
    
    $headers.each(function(i) {
        //reference current LI header
        var $curobj = $(this).css({zIndex: 100 - i});
        
        var $subul = $(this).find('ul:eq(0)').css({display: 'block'});
        
        this._dimensions = {w: this.offsetWidth, h: this.offsetHeight, subulw: $subul.outerWidth(), subulh: $subul.outerHeight()};
        
        //is top level header?
        this.istopheader = ($curobj.parents("ul").length == 1);
        
        $subul.css({top:this.istopheader ? this._dimensions.h + "px" : 0});
        
        //add arrow images
        //$curobj.children("a:eq(0)").css(this.istopheader ? {paddingRight: smoothmenu.arrowimages.down[2]} : {}).append(
        //    '<img src="'+ (this.istopheader ? smoothmenu.arrowimages.down[1] : smoothmenu.arrowimages.right[1]) +
        //    '" class="' + (this.istopheader ? smoothmenu.arrowimages.down[0] : smoothmenu.arrowimages.right[0]) +
        //    '" style="border:0;" />'
        //);
        
        $curobj.hover(
            function(e) { //on
                var $targetul = $(this).children("ul:eq(0)");
                
                this._offsets = {left: $(this).offset().left, top: $(this).offset().top};
                
                var menuleft = this.istopheader ? 0 : this._dimensions.w;
                
                //calculate this sub menu's offsets from its parent
                menuleft = ((this._offsets.left + menuleft + this._dimensions.subulw) > $(window).width()) ? (this.istopheader ? -this._dimensions.subulw+this._dimensions.w : -this._dimensions.w) : menuleft;
                
                //if 1 or less queued animations
                if ($targetul.queue().length <= 1) {
                    $targetul.css({left: menuleft + "px", width: this._dimensions.subulw + 'px'}).animate({height: 'show', opacity: 'show'}, ddsmoothmenu.transition.overtime);
                }
            },
            
            function(e) { //out
                var $targetul = $(this).children("ul:eq(0)");
                
                $targetul.animate({height: 'hide', opacity: 'hide'}, ddsmoothmenu.transition.outtime);
            }
        );
    });
    
    $mainmenu.find("ul").css({display:'none', visibility:'visible'})
},

init: function(setting){
    jQuery(document).ready(function($) {
        ddsmoothmenu.buildmenu($, setting);
    })
}

}

ddsmoothmenu.init({
    mainmenuid: "menu"
});

