document.observe("dom:loaded", function() {
    new DropDownMenu();
});

var DropDownMenu = Class.create({
    MenuItems: [],
    initialize: function() {
        this.MenuItems = DropDownMenuItemCollection;
        for (var i = 0; i < this.MenuItems.length; i++) {
            this.MenuItems[i].HeaderItem.observe('mouseover', this.ShowMenuItem.bindAsEventListener(this, this.MenuItems[i]))
        }
    },
    ShowMenuItem: function(m) {
        for (var i = 0; i < this.MenuItems.length; i++) {
            if (this.MenuItems[i] != arguments[1]) {
                this.MenuItems[i].Hide();
            } else {
                this.MenuItems[i].Show();
            }
        }
    }
});

var DropDownMenuItem = Class.create({
    initialize: function(HeaderItem, DropDownItem) {
        this.HeaderItem = $(HeaderItem);
        this.DropDownItem = $(DropDownItem);
        this.Timout;
        this.DropDownItem.observe('mouseout', (function() { this.Timout = window.setTimeout(this.Hide.bind(this), 500); }).bind(this));
        this.DropDownItem.observe('mouseover', (function() { window.clearInterval(this.Timout); }).bind(this));
    },
    Show: function() {
        if (this.DropDownItem.select('li').length > 0) {
            this.DropDownItem.style.display = 'block';
        }
    },
    Hide: function() {
        this.DropDownItem.style.display = 'none';
    }
});