var PopupMenu = Class.create({

    initialize: function(menuId) {
        this.menuId = menuId;
        $$("#"+menuId+">li").invoke("observe","mouseover",this.show_sub_menu.bindAsEventListener(this));
        $$("#"+menuId+" input.select").invoke("observe","click",this.selectItems.bindAsEventListener(this));
        var sub_search = " li ul";
        while ((sub_menus = $$("#"+menuId+sub_search)).size() > 0) {
            sub_menus.invoke("hide");
            sub_search = sub_search + sub_search;
        }
        $(document).observe("mousemove",this.checkPopup.bindAsEventListener(this));
        this.active = "";
    },

    selectItems: function(event) {
        event.element().up("li").select("ul input.select").each(function(item) {item.checked=event.element().checked;});
    },

    show_sub_menu: function (event) {
         var main_item_id = "container_"+event.element().identify();
		 if( $(main_item_id)) {
			 if ($(main_item_id).up().identify() == this.menuId) {
				 if (this.active != "") this.hide_sub_menu(this.active);
				 this.active = event.element().identify();
				 if ((sub_menu = $$("#"+main_item_id+" ul")).size() > 0) {
					sub_menu[0].setStyle({position:"absolute",zIndex:"1",opacity:0.9});
					sub_menu[0].show();
				 }
			 }
		 }
    },

    checkPopup: function(event) {
        if (!this.mouse_in_sub_menu(event.pointerX(),event.pointerY())) this.hide_sub_menu(this.active);
    },

    hide_sub_menu: function (id) {
         if ((sub_menu = $$("#container_"+id+" ul")).size() > 0)
             sub_menu[0].hide();
         this.active = "";
    },

    mouse_in_sub_menu: function(x,y) {
        if (this.active != "") {
            if ((sub_menu = $$("#container_"+this.active+" ul")).size() > 0) {
                var left = $(this.active).cumulativeOffset().left;
                var top1 = sub_menu[0].cumulativeOffset().top;
                var top2 = $(this.active).cumulativeOffset().top;
                var right1 = sub_menu[0].cumulativeOffset().left+sub_menu[0].getWidth();
                var right2 = $(this.active).cumulativeOffset().left+$(this.active).getWidth();
                var bottom = sub_menu[0].cumulativeOffset().top+sub_menu[0].getHeight();
                if ( (x >= left && y <= bottom) && ((y >= top1 && x <= right1) || (y >= top2 && x <= right2)) ) return true;
            }
        }
        return false;
    }
});


$(document).observe("dom:loaded",function(){
    var popup = new PopupMenu("menu");
});