window.addEvent('domready', pimpMyMenu);

function pimpMyMenu() {
  var url = 'assets/templates/menu/right-arrow.gif';
  var alink = $$('#menu li a');
  var bg;
  var fxs = [];
  var uls = $$('#menu ul.sub');
  uls.each(function(ul, index){
    ul.setProperty('myPos', index);//to find the fx
    fxs[index] = new Fx.Style(ul, 'height', {
      wait: false,
      duration: 500
    });
  });
  alink.each(function(item){
    var li = item.getParent();
    li.addEvent('mouseenter', function(){

      // hover color effects - different bg for parents and nonparents
      if(item.hasClass('parent') && !(item.hasClass('level1'))){
        var bg = '#00afda url(' + url + ') no-repeat right center';
      } else {
        var bg = '#00afda';
      }
      item.setStyles({'background':bg, 'color':'#fff'});

      //show submenus for parents
      if(item.hasClass('parent')){
        ul = getUL(li, item);
        if(item.hasClass('level1')){
          showSubMenu(li, ul, fxs[ul.getProperty('myPos')]);
        } else if(item.hasClass('level2')){
          showSubSubMenu(li, ul, fxs[ul.getProperty('myPos')]);
        }
      }

    }).addEvent('mouseleave', function(){

      // hover color effects - different bg for parents and nonparents
      if(item.hasClass('parent') && !(item.hasClass('level1'))){
        var bg = '#333 url(' + url + ') no-repeat right center';
      } else {
        var bg = '#333';
      }
      item.setStyles({'background':bg, 'color':'#ccc'});

      //hide submenus for parents
      if(item.hasClass('parent')){
        ul = getUL(li, item);
        if(item.hasClass('level1')){
          hideSubMenu(li, ul, fxs[ul.getProperty('myPos')]);
        } else if(item.hasClass('level2')){
          hideSubSubMenu(li, ul, fxs[ul.getProperty('myPos')]);
        }
      }
    });
  });
}

var containerStyle = {
//  'position':'relative',
//  'z-index':500
};

function showSubMenu(li, ul, fx){
  li.setStyles(containerStyle);
  ul.setStyles({
    'left':0,
    'top':'40px',
    'width':'131px',
//    'height':'auto'
    'height':'auto',
    'overflow':'hidden',
    'visibility':'hidden',
    'display':'block'
  })
  //hide the subsubmenus
  .getElements('li ul.sub').each(function(elm){
    hideSubSubMenu(li, elm);
  });
  var h = ul.getSize().size.y;
  ul.setStyles({'height':0,'visibility':'visible'});
  fx.start(0, h).chain(function() {
    ul.setStyle('overflow','visible');
  });
}

function hideSubMenu(li, ul, fx){
  ul.setStyles({
    'position':'absolute',
    'left':'-9999px',
    'top':'-9999px',
    'width':0,
    'height':0,
    'margin':0,
    'padding':0,
    'list-style':'none'
  });
}

function showSubSubMenu(li, ul, fx){
  li.setStyles(containerStyle);
  ul.setStyles({
    'left':'131px',
    'top':0,/*'-1px',*/
    'white-space':'nowrap',
    'width':'131px',
    'height':'auto',
    'overflow':'hidden',
    'visibility':'hidden',
    'display':'block'
  });
  var h = ul.getSize().size.y;
  ul.setStyles({'height':0,'visibility':'visible'});
  fx.start(0, h).chain(function() {
    ul.setStyle('overflow','visible');
  });
/*
  li.setStyles(containerStyle);
  ul.setStyles({
    'left':'131px',
    'top':'-1px',
    'white-space':'nowrap',
//    'width':'131px',
    'width':0,'overflow':'hidden',
    'height':'auto'
  });
  fx = new Fx.Style(ul, 'width', {
    wait: false,
    duration: 400
  }).start(0, '131px').chain(function() {
    ul.setStyle('overflow','visible');
  });*/
}

function hideSubSubMenu(li, ul, fx){
  hideSubMenu(li, ul);
}

function getUL(li, alink){
  var ul;
  if(isIE6()){
    var table = alink.getElement('table');
    var container = table.getElement('tr').getElement('td');
    ul = container.getElement('ul');
  } else {
    ul = li.getElement('ul');
  }
  return ul;
}

function isIE6() {
  version = 0;
  if (navigator.appVersion.indexOf("MSIE") != -1){
    temp = navigator.appVersion.split("MSIE")
    version = parseFloat(temp[1])
  }
  return (version && (version < 7));
}