var navigation = function (id) {
  var navigation = $(id);
  var uri = new URI().toAbsolute();

  navigation.getElements('a').each(function(link){
    link.addEvent('focus',function() { this.blur();});
  });

  $$('#'+id+' > ul > li').each(function(item) {
    item.addClass('menuItem');

    item.getElements('a').each(function(link){
      var linkHref = link.get('href');
      if (linkHref == '#') linkHref = link.get('rel');
      var matches = uri.match(linkHref);
      var home = uri == linkHref;
      if (home || (matches != null && matches.length > 0 && linkHref.length > 1)) $(link.parentNode).addClass('selected');
    });

    new Element('div',{'class':'left'}).inject(item);
    new Element('div',{'class':'right'}).inject(item);
    var subMenu = item.getElement('ul');
    if (subMenu) {
      item.addClass('hasSubMenu');
      subMenu.addClass('subMenuItem');
      new Element('div',{'class':'subLeft'}).inject(subMenu);
      new Element('div',{'class':'subRight'}).inject(subMenu);
      subMenu.addEvents({
        'mouseover': function() {
          subMenu.store('show',true);
        },
        'mouseout': function(){
          subMenu.store('show',false);
        }
      });
    }
    item.addEvents({
      'mouseover': function(){
        navigation.getElements('.active').each(function(menuItem) {
          menuItem.removeClass('active')
          var myTimer = menuItem.retrieve('timer');
          if (myTimer) myTimer = $clear(myTimer);
        });
        item.addClass('active');
        if (subMenu && subMenu.retrieve('width') == null) {
          var width = 2;
          subMenu.getElements('li').each(function(subMenuItem){
            width = width + subMenuItem.getSize().x;
          });
          subMenu.setStyle('width',width);
          subMenu.store('width',width);
        }
      },
      'mouseout': function(){
        if (!subMenu) {
          item.removeClass('active');
        } else {
          var showSubMenu = subMenu.retrieve('show');
          if (!showSubMenu) {
            var delayed = function() { item.removeClass('active'); }
            item.store('timer',delayed.delay(1500));
          }
        }
      }
    })
  });
  navigation.setStyle('display','block');
}

window.addEvent('domready', function() {
  navigation('navigation');
});