var ModalBox = new Class({
   Implements: [Options],

   // Зададимся двумя опциями.
   options: {
      // Прозрачность оверлея после показа всплывающего окна.
      //destinationOverlayOpacity: 0.7,
      
      // Возможность спрятать окно кликом по оверлею.
      //allowManualClose: true
   },

   // В конструктор передаем два обязательных аргумента и необязательный аргумент с опциями.
   //  element — идентификатор элемента окна.
   //  overlay — идентификатор элемента оверлея.
   initialize: function(element, options)
   {
      this.setOptions(options);

      // Получаем элемент по его идентификатору.
      this.element = $(element);
//      this.overlay = $(overlay);

      // Проверяем опцию возможности скрытия окна по клику.
  //    if (this.options.allowManualClose)
         // Цепляем на клик по оверлею метод скрытия.
         // Примечание: функция bind(param) возвращает метод this.hide, внутри которого переменная this
         // привязана к param. Если опустить вызов bind, тогда this внутри this.hide будет привязан к элементу,
         // событие в котором мы обрабатываем, т.е. к this.overlay.
  //       this.overlay.addEvent('mouseleave', this.hide.bind(this));

      // Получаем размеры окна для последующей его центровки.
      this.targetCoords = this.element.getCoordinates();

      // Эффекты для показывания/скрытия окна и оверлея.
      // Используется эффект, изменяющий заданное CSS-свойство во времени, в данном случае — это прозрачность.
      this.fx = {
//         overlayAnimation: new Fx.Tween(this.overlay, { property: "opacity" }),
           elementAnimation: new Fx.Tween(this.element, { property: "opacity" })
     }
  },

   // Вызов этого метода покажет всплывающее окно.
   show: function()
   {
      // Выставляем элементы в нужные места.
      this.setPosition();
      
      // Запускаем анимацию показа (изменение прозрачности до видимых значений).
//      this.fx.overlayAnimation.start(0, this.options.destinationOverlayOpacity);
      this.fx.elementAnimation.start(0, 1);
   },

   // Вызов этого метода скроет всплывающее окно.
   hide: function()
   {
      // Запускаем анимацию скрытия (изменение прозрачности до невидимых значений).
//      this.fx.overlayAnimation.start(this.options.destinationOverlayOpacity, 0);
      this.fx.elementAnimation.start(1, 0);
   },

   // Здесь мы корректируем позицию всплывающего окна на странице и
   // размеры оверлея.
   setPosition: function()
   {
      this.element.setStyles({
         "marginLeft": -(this.targetCoords.width / 2),
         "marginTop": -(this.targetCoords.height / 2)
      });

//      this.overlay.setStyles({
//         "top": window.getScrollTop(),
//         "height": window.getHeight()
//      });
   }
});
