var Menu = new Class({
	menu: null,
	subMenus: null,
	
	initialize: function() {
		this.menu = $('menu');
		this.subMenus = new Array();
		var subItems = this.menu.getChildren('li'),
			subItem,
			subMenu,
			i;
		for(i = 0; i < subItems.length; i++) {
			subItem = subItems[i];
			if(subItem.getChildren('table').length > 0)
				this.subMenus[this.subMenus.length] = new Menu.subMenu(subItem, i);
		}
		this.menu.getParent().getParent().addEvent('dblclick', this.reset.bindWithEvent(this));
	},
	
	reset: function(event) {
		for(var i = 0; i < this.subMenus.length; i++)
			this.subMenus[i].tweenReset(event)
	}
});

Menu.subMenu = new Class({
	menu: null,
	link: null,
	positionProps: null,
	cookieName: null,
		
	initialize: function(item, nr) {
		this.menu = item.getElement('table');
		this.menu.setStyles({
			opacity: 0
		});
		this.link = item.getElement('a');
		
		this.menu.set('tween', {
			duration: 200
		});
		this.link.addEvent('mouseover', this.show.bindWithEvent(this));
		this.link.addEvent('mouseout', this.hide.bindWithEvent(this));
		this.menu.addEvent('mouseover', this.show.bindWithEvent(this));
		this.menu.addEvent('mouseout', this.hide.bindWithEvent(this));
		
		this.cookieName = 'menu'+this.link.get('text')+nr;
		this.positionProps = new Hash.Cookie(this.cookieName, {
			duration: 365
		});
		if(this.positionProps.get('dragged')) {
			this.setPosition();
			this.hide($empty);
			this.menu.addEvent('dblclick', this.tweenReset.bindWithEvent(this));
		} else
			this.positionProps.set('dragged', false);
		
//		this.menu.makeDraggable({
//			onStart: this.startDrag.bindWithEvent(this),
//			onComplete: this.dragComplete.bindWithEvent(this)
//		});
		
		var links = this.menu.getElements('a');
		for(var i = 0; i < links.length; i++)
			links[i].addEvent('mousedown', this.blockDrag.bindWithEvent(this));
	},
	
	recalcPosition: function() {
		var linkCoords = this.link.getCoordinates(),
			menuCoords = this.menu.getCoordinates(),
			deltaLeftLinkMenu = Math.abs((linkCoords.width - menuCoords.width) / 2);
		this.positionProps.set('left', Math.round(linkCoords.left - deltaLeftLinkMenu - document.getElement('div.content').getPosition().x))
		this.positionProps.set('top', Math.round(linkCoords.top - 20));
	},
	
	setPosition: function(event, morph) {
		if(!$chk(morph))
			morph = false;
		if(!morph) {
			this.menu.setStyles({
				left: this.positionProps.get('left')+'px',
				top: this.positionProps.get('top')+'px'
			});
		} else {
			this.menu.set('morph', {
				duration: 1500,
				transition: Fx.Transitions.Elastic.easeOut,
				onComplete: this.tweenResetComplete.bindWithEvent(this)
			});
			this.menu.morph({
				left: this.positionProps.get('left')+'px',
				top: this.positionProps.get('top')+'px'
			});
		}
		this.dragged = false;
	},
	
	startDrag: function(element) {
		this.positionProps.set('dragged', true);
		this.menu.addEvent('dblclick', this.tweenReset.bindWithEvent(this));
	},
	
	dragComplete: function(element) {
		this.positionProps.set('top', element.getStyle('top').toInt());
		this.positionProps.set('left', element.getStyle('left').toInt());
	},
	
	tweenReset: function(event) {
		event.stop();
		this.recalcPosition();
		this.setPosition(event, true);
	},
	
	tweenResetComplete: function(event) {
		this.positionProps.set('dragged', false);
		this.hide();
	},
	
	blockDrag: function(event) {
		event.stop();
	},
	
	show: function(event) {
		if(!this.positionProps.get('dragged')) {
			this.recalcPosition();
			this.setPosition(event);
		}
		this.menu.tween('opacity', 1);
	},
	
	hide: function(event) {
		if(this.positionProps.get('dragged'))
			this.menu.tween('opacity', 0.5);
		else
			this.menu.tween('opacity', 0);
	}
});
window.addEvent('domready', function() {
	var menu = new Menu();
});