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