/* 
Simple JQuery menu.
HTML structure to use:

Notes: 

1: each menu MUST have an ID set. It doesn't matter what this ID is as long as it's there.
2: each menu MUST have a class 'menu' set. If the menu doesn't have this, the JS won't make it dynamic

Optional extra classnames:

noaccordion : no accordion functionality
collapsible : menu works like an accordion but can be fully collapsed
expandfirst : first menu item expanded at page load

<ul id="menu1" 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>
<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>
...
...
</ul>

Copyright 2008 by Marco van Hylckama Vlieg

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

Free for non-commercial use
*/

function initMenus() {
  $('ul.menu ul').hide();
  $('ul.menu ul li ul').hide();
  $.each($('ul.menu'), function(){
      var cookie = $.cookie(this.id);
      if(cookie === null || String(cookie).length < 1) {
        $('#' + this.id + '.expandfirst ul:first').show();
      }
      else {			
        $('#' + this.id + ' .' + cookie).next().show();
      }
    });
  $.each($('ul.menu li ul li a'), function(){
      var cookie = $.cookie(this.id);
      if(!(cookie === null || String(cookie).length < 1)) {
        if ($.cookie(this.parentNode.parentNode.parentNode.parentNode.id)==$(this.parentNode.parentNode).prev().attr('class'))
          $(this).next().show();
        else
          $.cookie(this.id,null);
      }
    });
  $('ul.menu li a').click(
                          function() {
                            var checkElement = $(this).next();
                            var parent = this.parentNode.parentNode.id;
                            
                            if($('#' + parent).hasClass('noaccordion')) {
                              if((String(parent).length > 0) && (String(this.className).length > 0)) {
                                if($(this).next().is(':visible')) {
                                  $.cookie(parent, null);
                                }
                                else {
                                  $.cookie(parent, this.className);
                                }
                                $(this).next().slideToggle('normal');
                              }				
                            }
                            if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
                              if($('#' + parent).hasClass('collapsible')) {
                                $('#' + parent + ' ul:visible').slideUp('normal');
								 $.cookie(parent, null);
                              }
                              return false;
                            }
                            
                            if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
                              $('#' + parent + ' ul:visible').slideUp('normal');
                              if((String(parent).length > 0) && (String(this.className).length > 0)) {
                                $.cookie(parent, this.className);
                                $.cookie(this.id,'true');
                              }
                              $.cookie(this.id,'true');
                              checkElement.slideDown('normal');
                              return false;
                            }
                          }
                          );
}

// HOWTO:
// Write a .selected-link class in the CSS (basically the same as :hover)
// Add '.rollme' class to the UL containing the links.
function initSelected(){
  $('.rollme').each(function(){
        var menuId = this.id;
        var linkIndex = 0;
        $('#' + menuId + ' a').each(function(){
            // Assign this link a unique ID within the UL
            this.id = menuId + '-link-' + linkIndex;
            $(this).click(function(){
                $.cookie(menuId + '-current',this.id);
				$(this).addClass('selected-link');
              });
            // If it's the current one add the current class
            if ($.cookie(menuId + '-current') == this.id){
              $(this).addClass('selected-link');
            }
            linkIndex++;
        });
    });
}

$(document).ready(function() {
    initMenus();
    initSelected();
  });