window.addEvent('domready', function() {
	if($('secondarymenu')) new Menus('secondarymenu');
	if($('innerleftmenu')) new MenusLeft('innerleftmenu');

	$$('.menuitem a').set('title', '');
});


MenusLeft = new Class({
	cur: {
		el: null,
		timer: null
	},

	initialize: function(el) {
		this.el = $(el);
		if(!el) return;

		var self = this;
		this.el.getElements('.menuitemwrap').each(function(mi) {
			if((smi = mi.getElement('.submenuitems')) && smi.getElements('.submenuitem').length > 0) {
				mi.addClass('has-children').addEvents({
					mouseenter: function() { self.itemOver(this) },
					mouseleave: function() { self.itemOut(this) }
				});

				//smi.setStyles({ height: 0, display:'block' }).set('tween', { duration: 500, link: 'cancel', transition: 'back:out' });
				smi.setStyles({ height: 0, display:'block' });

				if(mi.hasClass('on') || smi.getElement('.submenuitem.on')) {
					mi.addClass('expanded on');
					smi.setStyles({ height: smi.getScrollHeight() });
				}
			};
		});
	},

	itemOver: function(el) {
		if(el == this.cur.el) {
			clearTimeout(this.cur.timer);
		}
		else {
			clearTimeout(this.cur.timer);
			this.cur.el = el;
			this.cur.timer = setTimeout(this.show.bind(this), 450);
		}
	},
	itemOut: function() {
		this.hide();
	},
	show: function(el) {
		clearTimeout(this.cur.timer);
		if(this.cur.el && (sub = this.cur.el.getElement('.submenuitems'))) {
			this.cur.el.addClass('expanded');
			//sub.tween('height', sub.getScrollHeight());
			new Fx.Tween(sub, { duration: 500, transition: 'back:out' }).start('height', sub.getScrollHeight());
		}
	},
	hide: function() {
		clearTimeout(this.cur.timer);
		this.cur.el = null;

		$$('.menuitemwrap.has-children.expanded').each(function(el) {
			if(el.hasClass('on')) { return; }
			el.removeClass('expanded');
			if(sub = el.getElement('.submenuitems')) {
				//sub.tween('height', 2);
				new Fx.Tween(sub, { duration: 300, transition: 'back:in' }).start('height', 0);
			}
		});
	}
});

Menus = new Class({
	type: 'Menus',
	Implements: Options,

	timer: null,
	showtimer: null,

	options: {
		offsetX: 0,
		offsetY: 0,
		subOffsetX: -2,
		subOffsetY: -1,
		opacity: 0.9,
		delay: 1000,
		showSpeed: 100,
		hideSpeed: 75,
		showDelay: 150,

		// disable dropdowns
		delay: 50,
		showDelay: 10,

	},

	initialize: function(el, options) {
		this.setOptions(options);
		this.el = $(el);
		if(!this.el) return;


		this.menus = [];
		this.timer = null;

		this.el.getElements('.menuitem').each(function(m) {
			this.menus.push( new this.Menu(this, m) );
		}.bind(this));

		//this.debug = new Element('div').setStyles({ position: 'absolute', background:'white', top:3, left:3, padding:'3px 10px', border:'solid #eee 1px' }).inject($(document.body));
		//setInterval(function() { this.debug.set('text', this.countShown()); }.bind(this), 500);
	},
	countShown: function() {
		var c = 0;
		this.menus.each(function(m) {
			c += m.countShown();		
		});

		return c;
	},

	setTimer: function() {
		this.clearTimer();
		this.timer = setTimeout(function() {
			this.hideMenus();
		}.bind(this), this.options.delay);
	},

	clearTimer: function() {
		clearTimeout(this.timer);
		clearTimeout(this.showtimer);
	},

	hideMenus: function(curMenuId) {
		this.clearTimer();
		for(var i=0; i<this.menus.length; ++i) {
			if(this.menus[i].id != curMenuId) this.menus[i].hide();
		}
	},

	Menu: new Class({
		type: 'Menus.Menu',
		shown: false,

		initialize: function(parent, trigger) {
			this.trigger = $(trigger);
			this.id = this.trigger.getAttribute('menuid');
			this.menus = [];

			switch(parent.type) {
				case 'Menus':
					this.parent = parent;
					this.root = parent;
					break;
				case 'Menus.Menu':
					this.parent = parent;
					this.root = this.parent.root;
					break;
				default: return;
			}

			this.trigger.addEvent('mouseenter', function() {
				this.show();
			}.bind(this));

			this.trigger.addEvent('mouseleave', function() {
				this.root.setTimer();
			}.bind(this));

			this.el = $('submenu'+this.id);
			if(this.el) {
				this.el.addEvent('mouseenter', function() {
					//this.root.clearTimer();
				}.bind(this));
		
				this.el.addEvent('mouseleave', function() {
					//this.root.setTimer();
				}.bind(this));

				this.el.getElements('.submenuitem').each(function(m) {
					this.menus.push( new this.root.Menu(this, m) );
				}.bind(this));
			}
		},

		countShown: function() {
			if(this.shown && this.el && this.el.getStyle('display') == 'none') this.shown = false;
			if(this.shown) {
				var c = 1;
				this.menus.each(function(m) { c += m.countShown() });
				return c;
			} else return 0;	
		},

		show: function() {
			clearTimeout(this.root.showtimer);
			var delay = (this.root.countShown() > 0) ? 0 : this.root.options.showDelay;
			this.root.showtimer = setTimeout(function() {
				this.doshow();
			}.bind(this), delay);
		},
		doshow: function() {
			this.root.clearTimer();

			if(this.shown) return;
			else this.shown = true;

			var thisMenuId = this.id;
			p = this.parent;
			while(p.type == 'Menus.Menu') {
				thisMenuId = p.id;
				p = p.parent;
			}
			this.root.hideMenus(thisMenuId);
			if(this.parent.type == 'Menus.Menu') this.parent.hideMenus(this.id);


			this.trigger.addClass('hover');

			if(this.el && false) {

				this.el.setStyles({
					display: 'block',
					opacity: 0
				});

				var to = { };
				if(this.parent.type == 'Menus') {
					// this is a root submenu
					if(this.el.getWidth() < this.trigger.getWidth()) this.el.setStyle('width', this.trigger.getWidth());

					to.left = this.trigger.getLeft() + this.root.options.offsetX;
					to.top = this.trigger.getTop() + this.trigger.getHeight()  + this.root.options.offsetY;
				}
				else {
					// this is a sub-submenu
					to.left = this.trigger.getLeft() + this.trigger.getWidth() + this.root.options.subOffsetX;
					to.top = this.trigger.getTop() + this.root.options.subOffsetY;
				}

				this.el.setStyles({
					left: to.left,
					top: to.top
				});

				new Fx.Tween(this.el, {
					duration: this.root.options.showSpeed
				}).start('opacity', this.root.options.opacity);
			}
		},

		hide: function() {
			this.root.clearTimer();

			if(!this.shown) {
				this.trigger.removeClass('hover');
				return;
			}
			else this.shown = false;

			setTimeout(function() {
				this.trigger.removeClass('hover');
			}.bind(this), this.root.options.hideSpeed);

			if(this.el) {
				new Fx.Tween(this.el, {
					duration: this.root.options.hideSpeed,
					onComplete: function() {
						this.el.setStyle('display', 'none');
					}.bind(this)
				}).start('opacity', 0);
			}

			this.hideMenus();

		},

		hideMenus: function(curMenuId) {
			this.root.clearTimer();
			for(var i=0; i<this.menus.length; ++i) {
				if(this.menus[i].id != curMenuId) this.menus[i].hide();
			}
		}

	})


});