//***************************************
// Variables globales
//***************************************

var DOM;
var IE;
var loaded = 0; // El menú esta cargado
var timeoutFlag; // Tiempo de apagado (delay menú)
var layersList = new Array(); // Lista con todos los layers
var layersLength = 0; // Total de menús. layaresList.length
var layersParent = new Array(); // Array con el valor del layer parent respecto del actual
var layerPoppedUp = ''; // Último menú mostrado
var toBeHidden = new Array(); // Layers para ocultar
var layersRef = new Array(); // Lista de submenus con los ref parent

// ********************************************************
// Control del Navegador
// ********************************************************

function getNavigatorInfo(){
	DOM = (document.getElementById) ? 1 : 0;
	IE = (navigator.userAgent.indexOf('MSIE') > -1) ? 1 : 0;
}

//***************************************
// Dimensiones de la Ventana
//***************************************

function getWindowWidth(){
	// Calcular el Ancho de la Ventana
	return (window.innerWidth);
}

function getWindowHeight(){
	// Calcular el alto de la Ventana
	var value = 0;
	if(DOM && !IE){
		value = window.innerHeight;
	}
	else{
		if(document.documentElement && document.documentElement.clientHeight){
			value = document.documentElement.clientHeight;
		}
		else if(document.body){
			value = document.body.clientHeight;
		}
	}
	return (value);
}

function getWindowXOffset(){
	// Calcular el ancho fuera de la ventana
	return (window.pageXOffset);
}

function getWindowYOffset(){
	// Calcular el xxx de la Ventana
	var value = 0;
	if(DOM && !IE){
		value = window.pageYOffset;
	}
	else{
		if(document.documentElement && document.documentElement.scrollTop){
			value = document.documentElement.scrollTop;
		}
		else if(document.body){
			value = document.body.scrollTop;
		}
	}
	return (value);
}

//***************************************
// Ubicación de los menús
//***************************************

function getOffsetTop(layer){
	// Calcular posición arriba
	var value = 0;
	var object = document.getElementById(layer);
	value = object.offsetTop;
	while(object.tagName != 'BODY' && object.offsetParent){
		object = object.offsetParent;
		value += object.offsetTop;
	}
	return(value);
}

function getOffsetLeft(layer){
	// Calcular posición izquierda
	var value = 0;
	object = document.getElementById(layer);
	value = object.offsetLeft;
	while(object.tagName != 'BODY' && object.offsetParent){
		object = object.offsetParent;
		value += object.offsetLeft;
	}
	return(value);
}

function getOffsetWidth(layer){
	// Calcular ancho del menú
	return (document.getElementById(layer).offsetWidth);
}

function getOffsetHeight(layer){
	// Calcular alto del menú
	return (document.getElementById(layer).offsetHeight);
}

function setTop(layer, y){
	// Posicionar arriba
	document.getElementById(layer).style.top = y + 'px';
}

function setLeft(layer, x){
	// Posicionar izquierda
	document.getElementById(layer).style.left = x + 'px';
}

function moveLayerY(menuName){
	// Mover un menú en Y ajustándolo a los bordes de la pantalla
	var newY = 0;
	var layerHeight = 0;
	var windowHeight = 0;
	var windowYOffset = 0;
	if(!loaded || (isVisible(menuName) && menuName != layerPoppedUp)){return};
	// Siempre ubico los menús a su posición original
	moveLayer(menuName);
	newY = getOffsetTop(menuName);
	layerHeight = getOffsetHeight(menuName);
	windowHeight = getWindowHeight();
	windowYOffset = getWindowYOffset();
	if(newY + layerHeight > windowHeight + windowYOffset){
		if(layerHeight > windowHeight){
			newY = windowYOffset;
		}
		else{
			newY = windowHeight + windowYOffset - layerHeight;
		}
	}
	if(Math.abs(getOffsetTop(menuName) - newY) > 1){
		setTop(menuName, newY);
	}
}

function moveLayer(layer){
	// Ubicar un menú a su posición X - Y
	setTop(layer, getOffsetTop(layersRef[layer]) - 2);
	setLeft(layer, getOffsetLeft(layersRef[layer]) + getOffsetWidth(layersRef[layer]) - 1);
}

//***************************************
// Delays menús y ocultaminto
//***************************************

function setLMTO(){
	timeoutFlag = setTimeout('shutdown()', 500);
}

function clearLMTO(){
	clearTimeout(timeoutFlag);
}

function shutdown(){
	for(i=0; i <layersLength; i++){
		LMPopUpL(layersList[i], false);
	}
	layerPoppedUp = '';
}

//***************************************
// Visualizar menús
//***************************************

function LMPopUpL(menuName, on){
	if(on && menuName != 'L0'){moveLayerY(menuName)};
	setVisibility(menuName, on);
}

function setVisibility(layer, on){
	if(on){document.getElementById(layer).style.visibility = 'visible'}
	else{document.getElementById(layer).style.visibility = 'hidden'}
}

function isVisible(layer){
	document.getElementById(layer).style.visibility == 'visible';
}

function LMPopUp(menuName, isCurrent){
	if(!loaded || menuName == layerPoppedUp || (isVisible(menuName) && !isCurrent)){return}
	if(menuName == layersParent[layerPoppedUp]){
		LMPopUpL(layerPoppedUp, false);
	}
	else if(layersParent[menuName] == layerPoppedUp){
		LMPopUpL(menuName, true);
		seeThroughWorkaround(menuName, true);
	}
	else{
		shutdown();
		foobar = menuName;
		do{
			LMPopUpL(foobar, true);
			seeThroughWorkaround(foobar, true);
			foobar = layersParent[foobar];
		}
		while(foobar != '');
	}
	layerPoppedUp = menuName;
}

function seeThroughWorkaround(menuName, on){
	for(i=0; i <toBeHidden.length; i++){
		if(layersOverlap(menuName, i)){
			if (on){
				toBeHidden[i].style.visibility = 'hidden';
			}
			else{
				toBeHidden[i].style.visibility = 'visible';
			}
		}
	}
}

function layersOverlap(layer, i){
	xa1 = layerLeft[layer];
	xa2 = xa1 + getOffsetWidth(layer);
	ya1 = layerTop[layer];
	ya2 = ya1 + getOffsetHeight(layer);
	xb1 = toBeHiddenLeft[i];
	xb2 = xb1 + toBeHidden[i].offsetWidth;
	yb1 = toBeHiddenTop[i];
	yb2 = yb1 + toBeHidden[i].offsetHeight;
	if(xb1>xa1) xa1=xb1; if(xb2 <xa2) xa2=xb2;
	if(yb1>ya1) ya1=yb1; if(yb2 <ya2) ya2=yb2;
	return (xa2>xa1 && ya2>ya1);
}


//***************************************
// Inicializar menú
//***************************************

function initMenu(){
	loaded = 1;
	getNavigatorInfo();
	// Lista de menús
	layersList = ['L0','L1','L2','L3','L4','L5','L6','L7'];
	layersLength = layersList.length;
	// Arbol de menús
	layersParent['L0'] = '';
	layersParent['L1'] = '';
	layersParent['L2'] = '';
	layersParent['L3'] = '';
	layersParent['L4'] = '';
	layersParent['L5'] = 'L1';
	layersParent['L6'] = 'L1';
	layersParent['L7'] = 'L2';
	// Parent Ref de un Submenú
	layersRef['L1'] = 'M1';
	layersRef['L2'] = 'M2';
	layersRef['L3'] = 'M3';
	layersRef['L4'] = 'M4';
	layersRef['L5'] = 'M5';
	layersRef['L6'] = 'M6';
	layersRef['L7'] = 'M7';
}
