/**
*	Menu desplegable. Permite infinitas listas anidadas.
*	@param	string		id del menu principal
*	@param	object|null	opciones
*	@param	integer		velocidad de despliegue (efecto no funca ahora)
*/
function MenuBar(menuId, options, displaySpeed)
{
	var me = this;
	this.menu = menuId;
	this.opt = typeof options == 'object' ? options : {};
    this.cicleCount = (this.opt.displaySpeed) ? this.opt.displaySpeed : 15;
    this.currentList = null;
	
	this.init = function() {
		this.menu = get(this.menu);
		if (typeof this.menu != 'object') return;
		var items = getChildrenByTagName(this.menu, 'li');
		var lists = this.menu.getElementsByTagName('ul');
		var subItems, i, j;
		for (i=0;i<lists.length;i++)
		{
			lists[i].style.display = 'none';
			lists[i].style.visibility = 'hidden';
			lists[i].style.position = 'absolute';
		}
		for (i=0;i<items.length;i++)
		{
			items[i].onmouseover = function(e) {
				var evt = e ? e : window.event;
				me.showList(this, 1, evt);
			};
			items[i].onmouseout = function(e) {
				var evt = e ? e : window.event;
				me.hideList(this, evt);
			};
			subItems = items[i].getElementsByTagName('li');
			for (j=0;j<subItems.length;j++)
			{
				subItems[j].onmouseover = function(e) {
					var evt = e ? e : window.event;
					me.showList(this, 2, evt);
				};
				subItems[j].onmouseout = function(e) {
					var evt = e ? e : window.event;
					me.hideList(this, evt);
				};
			}
		}
	};
	
	this.showList = function(item, dir, e) {
		if (typeof me.opt.activeItemHandler == 'function')
			me.opt.activeItemHandler(item, e);
		var list = getChildrenByTagName(item, 'ul')[0];
		if (!list) return;
		var left, top;
		if (dir == 1)
		{
			left = item.offsetLeft + 'px';
			top = item.offsetTop + item.offsetHeight + 'px';
		}
		else
		{
			left = item.offsetLeft + item.offsetWidth + 'px';
			top = item.offsetTop + 'px';
		}
		me.currentList = list;
		list.style.display = 'block';
		list.style.visibility = 'visible';
		list.style.left = left;
		list.style.top = top;
		//me.resetClip();
		//me.clip();
	};
	
	this.hideList = function(item, e) {
		var lists = item.getElementsByTagName('ul');
		var target = e.relatedTarget ? e.relatedTarget : e.toElement;
		var targetParentList = getParent(target, 'ul');
		for (i=0;i<lists.length;i++)
			if (targetParentList == lists[i]) return;
		if (typeof me.opt.inactiveItemHandler == 'function')
			me.opt.inactiveItemHandler(item, e);
		for (i=0;i<lists.length;i++)
			lists[i].style.display = 'none';
	};
	
	this.clip = function() {
		var list = me.currentList;
		var rightClip = parseInt(list.getAttribute('rightClip'));
		var bottomClip = parseInt(list.getAttribute('bottomClip'));
		var rightClipRatio = parseInt(list.getAttribute('rightClipRatio'));
		var bottomClipRatio = parseInt(list.getAttribute('bottomClipRatio'));

		if (rightClip < list.offsetWidth) list.setAttribute('rightClip', rightClip + rightClipRatio);
		if (bottomClip < list.offsetHeight) list.setAttribute('bottomClip',  bottomClip + bottomClipRatio);
		list.style.clip = 'rect(0px ' + rightClip + 'px ' + bottomClip +'px 0px)';
		if (rightClip < list.offsetWidth || bottomClip < list.offsetHeight) setTimeout(me.clip, 10);
	};
	
	this.resetClip = function(list) {
		if (!list) var list = me.currentList;
		list.setAttribute('rightClip', 0);
		list.setAttribute('rightClipRatio', Math.round(list.offsetWidth/me.cicleCount));
		list.setAttribute('bottomClip', 0);
		list.setAttribute('bottomClipRatio', Math.round(list.offsetHeight/me.cicleCount));
		list.style.clip = 'rect(0px 0px 0px 0px)';
	};
}