/*
License: Creative Commons http://creativecommons.org/licenses/by-nc-sa/2.5/
*/

function parseMenu () //создаем функцию, которая будет изменять наше меню
  {
  var menus = $$('#menu a'); //создаем массив элементов "<a></a>", находящихся внутри блока "#menu"
  /*
  создаем новый класс fx из элементом массива menus,
  к которым применяем эффект перехода(Transitions) методом bounceOut.
  duration: длительность в милисекундах
  wait: время от собвтия до начала эффекта в милисекундах
  Полный список методов может быть найден по адресу http://docs.mootools.net/files/Effects/Fx-Transitions-js.html
    In - по нарастанию
  Out - по затуханию
  */
  var fx = new Fx.Elements(menus, {wait: false, duration: 250, transition: Fx.Transitions.linear});		
  /*
  присваиваем каждома элементы menu вызовом addEvent событие mouseover,
  при котором вызывается функция function(e)
  */
  menus.each(function(menu, i) 
    {
    menu.addEvent('mouseover', function(e)
      {
      e = new Event(e).stop(); //создаем новое событие и запрещаем ему зацикливаться
      /*
      создаем массив par в котором будут храниться параметры, передаваемые
      объекту fx, в данном случае изменения верхнего внутреннего отступа от X до Y
      */
      var par = {};
      par[i] = {
      /*
      при наведении на i-ый элемент выщитываем его первоначальное состояние getStyle (padding-top)
      и увеличиваем (уменьшаем) до нужного значения (40)
      */
      'padding-top': [menu.getStyle('padding-top').toInt(), 40] 
      };
      menus.each(function(other, j)
        {
        if (other != menu)
          {
          /*
          при наведении на j-ый элемент эффект у i-ого идет в обратном направлении
          в данном случае padding-top стремится к нулю
          */
          par[j] = {'padding-top': [other.getStyle('padding-top').toInt(), 0]};
          }
        });
      fx.start(par); /*вызываем объект fx с параметрами par*/
      });
    });
  /*
  при наведении на содержимое страницы (не на меню) эффект идет в обратном направлении
  */
  document.addEvent('mouseover', function(e)
    {
    e = new Event(e);
    var par = {};
    menus.each(function(other, j)
      {
      par[j] = {'padding-top': [other.getStyle('padding-top').toInt(), 0]};
      });
    fx.start(par);
    });
  }
/*
когда Объектная Модель Документа построена вызываем функцию parseMenu
*/
Window.onDomReady(parseMenu);