/* 
Simple JQuery menu.
HTML structure to use:

Notes: 

Each menu MUST have a class 'menu' set. If the menu doesn't have this, the JS won't make it dynamic
If you want a panel to be expanded at page load, give the containing LI element the classname 'expand'.
Use this to set the right state in your page (generation) code.

Optional extra classnames for the UL element that holds an accordion:

noaccordion : no accordion functionality
collapsible : menu works like an accordion but can be fully collapsed

<ul class="menu [optional class] [optional class]">
<li><a href="#">Sub menu heading</a>
<ul>
<li><a href="http://site.com/">Link</a></li>
<li><a href="http://site.com/">Link</a></li>
<li><a href="http://site.com/">Link</a></li>
...
...
</ul>
// This item is open at page load time
<li class="expand"><a href="#">Sub menu heading</a>
<ul>
<li><a href="http://site.com/">Link</a></li>
<li><a href="http://site.com/">Link</a></li>
<li><a href="http://site.com/">Link</a></li>
...
...
</ul>
...
...
</ul>

Copyright 2007-2010 by Marco van Hylckama Vlieg

web: http://www.i-marco.nl/weblog/
email: marco@i-marco.nl

Free to use any way you like.
*/


jQuery.fn.initMenu = function() 
{
    return this.each(function()
    { /*each of menu and working with this menu*/
        var theMenu = $(this).get(0); /*get the entry of menu*/
        $('.acitem', this).hide();                /*hide all the acitem of this menu*/
        $('li.expand > .acitem', this).show();    /*show the node should be expended, and add class active to it's parent*/
        $('li.expand > .acitem', this).prev().addClass('active');
        
        $('li a', this).click(  /*deal with submenu item node*/
            function(e)
            {
                e.stopImmediatePropagation();
                var theElement = $(this).next(); /*the child node of click*/
                var parent = this.parentNode.parentNode; /*menu root*/
                if($(parent).hasClass('noaccordion'))
                {
                    if(theElement[0] === undefined)
                    {
                        window.location.href = this.href;
                    }
                    
                    $(theElement).slideToggle('normal', function()
                    {
                        if ($(this).is(':visible'))
                        {
                            $(this).prev().addClass('active');
                        }
                        else
                        {
                            $(this).prev().removeClass('active');
                        }    
                    });
                    return false;
                }
                else 
                {
                    if(theElement.hasClass('acitem') && theElement.is(':visible'))
                    {
                        if($(parent).hasClass('collapsible'))
                        {
                            $('.acitem:visible', parent).first().slideUp('normal',
                            function()
                            {
                                $(this).prev().removeClass('active');
                            });
                            return false;
                        }
                        return false;
                    }
                
                    if(theElement.hasClass('acitem') && !theElement.is(':visible')) 
                    {
                        $('.acitem:visible', parent).first().slideUp('normal', function()
                        {
                            $(this).prev().removeClass('active');
                        });
                        theElement.slideDown('normal', function()
                        {
                            $(this).prev().addClass('active');
                        });
                        return false;
                    }
                }
            });
               $('li a',this).hover(
               function()
               {
                 var theNextElement = $(this).next();
                 /*the child node of click*/
                 if(theNextElement.hasClass('acitem'))
                 {
                    $(this).css('background','transparent url(../images/rightarrow.png) no-repeat right');
                 }
               },
               function()
               {
                 var theNextElement = $(this).next();
                 /*the child node of click*/
                 if(theNextElement.hasClass('acitem'))
                 {
                    $(this).css('background','');
                 }
               });
    });
};

$(document).ready(function() {$('.menu').initMenu();});