window.addEvent("domready", function() {
  var menu2 = $$("#menu2 li");
  var menu3 = $$("ul.menu3");
  
  if (menu2.length > 1 && menu3.length > 1)
  {
    new Menu(menu2[0], menu3[0]);
    new Menu(menu2[1], menu3[1]);
  }
  
  $$(".photo_menu a").each(function(link) {new Lightbox(link) });
  
});

var Menu = new Class({
  initialize: function(menu, submenu)
  {
    menu.addEvent("mouseenter", function(){
      submenu.setStyle("display", "block");
    });
    
    menu.addEvent("mouseleave", function(event){
      if (event.relatedTarget.tagName != "UL")
      {
        submenu.setStyle("display", "none");
      }      
    });
    
    submenu.addEvent("mouseleave", function(event){
      submenu.setStyle("display", "none");
    });
  }
});

var Lightbox = new Class({
  initialize: function(link)
  {
    this.link = link;
    link.addEvent("click", this.show.bind(this));
    window.addEvent("scroll", this.hide.bind(this));
  },
  show: function()
  {
    var scrollY = window.pageYOffset || document.documentElement.scrollTop;
    var div = new Element("div");
    div.setStyles({
      "background-color": "black",
      "position" : "absolute",
      "opacity" : "1",
      "top" : scrollY + "px",
      "left" : "0px",
      "width" : document.documentElement.clientWidth + "px",
      "height" : document.documentElement.clientHeight + "px",
      "text-align" : "center",
      "padding-top" : "50px"
    });    
    var img = new Element("img");
    var linkpos = this.link.getPosition();
    img.setAttribute("src", this.link.href);
    img.inject(div);    
    div.addEvent("click", this.hide.bind(this));             
    
    var text = new Element("span");
    text.setStyle("color", "white");
    text.innerHTML = "<br />Click to close <br />ウィンドウを閉じるにはクリックしてください。<br />";    
    text.inject(div);
    div.inject(document.body);    
    this.div = div;
    return false;
  },
  hide: function()
  {
    if (this.div)
    {
      this.div.destroy();
    }
    this.div = null;
  }
});