MenuWP = Class.create();
Object.extend(MenuWP.prototype, 
{
	initialize: function(el) {
		this.container = $(el);
		if (this.container == undefined) return 0;
		
		this.elements = [];
		var u = this.container.down("ul.firstlevel");
		//var ffll = u.select("div.firstlevelitem");
		var ffll = u.select("a");
		ffll.each((function(fl) {
			fl.observe("mouseover", this.overItem.bind(this), false);
			fl.observe("mouseout", this.outItem.bind(this), false);
			fl.controller = this;
			fl.owner = fl.up("div");
			fl.owner.fade = (function() { this.removeClassName("firstlevelover") }).bind(fl.owner);
			var sl = $(fl.owner.id+"_sl");
			sl.controller = fl;
			sl.owner = fl.owner;
			sl.observe("mouseover", this.overSlItem.bind(sl), false);
			sl.observe("mouseout", this.outSlItem.bind(sl), false);
			
			this.elements.push({fl:fl, sl:sl, sleffect:undefined});
		}).bind(this));
	},
	overItem: function(e) {
		var a = e.element();
		a.owner.addClassName("firstlevelover");
		this.elements.each((function(e) {
			if (a.owner.id+"_sl" == e.sl.id) {
				if (e.sl.style.display == "none") {
					e.sl.setStyle({opacity:0});
					e.sl.show();
					e.sleffect = new Effect.Opacity(e.sl, {from: 0, to: 1.0, duration: 0.5});
				} else {
					e.sleffect.cancel();
					e.sl.show();
					e.sl.setStyle({opacity:1.0});
				}
			} else {
				e.sl.owner.removeClassName("firstlevelover");
				e.sl.hide();
			}
		}).bind(this));
	},
	outItem: function(e) {
		var a = e.element();
		a.owner.intervalrem = setTimeout(a.owner.fade, 500);
		
		this.elements.each((function(e) {
			if (a.owner.id+"_sl" == e.sl.id) {
				e.sleffect = new Effect.Opacity(e.sl, {from: 1.0, to: 0, duration: 0.5, afterFinish:(function(){this.hide()}).bind(e.sl)});
			} else {
				e.sl.hide();
			}
		}).bind(this)); 
	},
	overSlItem: function(e) {
		this.controller.controller.elements.each((function(e) {
			if (this.id == e.sl.id) {
				e.sleffect.cancel();
				e.sl.show();
				e.sl.setStyle({opacity:1.0});
				clearInterval(e.sl.owner.intervalrem)
			} else {
				e.sl.hide();
			}
		}).bind(this)); 
	},
	outSlItem: function(e) {
		this.controller.controller.elements.each((function(e) {
			if (this.id == e.sl.id) {
				e.sleffect = new Effect.Opacity(e.sl, {from: 1.0, to: 0, duration: 0.5, afterFinish:(function(){this.hide(); this.owner.removeClassName("firstlevelover");}).bind(e.sl)});
			} else {
				e.sl.hide();
			}
		}).bind(this)); 
	}
});