//Variables usada para el intercambio de layers
var lastLayer0;
var lastVisibleLayer0;
var lastLayer1;
var lastVisibleLayer1;
var ItemMetainfoArray;
var stateMove=0;

//Antiguo Zoom seleccionado
var lastZoomSelect;
//Antiguo enlace de zoom seleccionado
var lastLinkZoomSelect;

//Captura de eventos desabilitada por defecto
var captura=0;

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES SHOW/HIDE... MOSTRAR OCULTAR CONTENIDO
//DOS TIPOS, ANIMADAS E INANIMADAS
//*******************************************************************************************************************//
//*******************************************************************************************************************//

	//Funcion para la animacion con jsquery
	//Se juega con el display con none y con hide o slideup,down
	function viewAnimate(op,layer){
		//estado actual del layer
		var state=$(layer).css("display");
		switch (op){
			//Informacion de un icono
			case "iteminfo": 
				if (state=='block') {
					$(layer).hide("fast");
				} else {
					$(layer).show("fast");
				}
			break;
			//Informacion de una entrada de menu
			case "menuEntry":
				linklayer=layer+'links';
				if (state=='block') {
					$(layer).slideUp("fast");
					$(layer).css("display","none");
					$(linklayer).background("url('images/default/menu_noactive.png') no-repeat top left;");
				
				} else {
					$(layer).slideDown("fast");
					$(layer).css("display","block");
					$(linklayer).background("url('images/default/menu_active.png') no-repeat top left;");
				}
			break;
		}	
	}
	
	//Función sin animacion para mostrar o ocultar cosas
	function viewUnanimate(op,layer){
		switch (op){
			//Muestra de una entrada del menu de operaciones
			case "linkmenushow":
				var changeLayer=document.getElementById(layer);
				changeLayer.style.display = "block";
			break;
			//Se oculta una entra del menu de operaciones
			case "linkmenuhide":
				var changeLayer=document.getElementById(layer);
				changeLayer.style.display = "none";
			break;
			case "itemshow":
				var changeLayer=document.getElementById(layer);
				changeLayer.style.zIndex = 4;
				layermore = layer + "more";
				changeLayerMore = document.getElementById(layermore);
				changeLayerMore.style.display = "block";
			break;
			//Se oculta una entra del menu de operaciones
			case "itemshidden":
				var changeLayer=document.getElementById(layer);
				changeLayer.style.zIndex = 3;
				layermore = layer + "more";
				changeLayerMore = document.getElementById(layermore);
				changeLayerMore.style.display = "none";
			break;
			case "category":
				totalItems=layer.length;
				for (var i = 1; i <= (totalItems-1); i++) {
					var hideLayer = document.getElementById(layer[i]);
					var stateViewLayer = hideLayer.style.display;
						if (!stateViewLayer) {
							hideLayer.style.display = "none";
							decoration= "line-through";
						} 
						if ( stateViewLayer == 'block') {
							hideLayer.style.display = "none";
							decoration= "line-through";
						}
			
						if (stateViewLayer == 'none' ) {
							hideLayer.style.display = "block";
							decoration= "none";
						}
				}
				var menuLink='menu' + layer[0];
				var MenuRef = document.getElementById(menuLink);
				MenuRef.style.textDecoration= decoration;
			break;
			case "adminop0":
				var refLayer0 = document.getElementById(layer);
				if (lastVisibleLayer0) {
					lastVisibleLayer0.style.display = 'none';
					lastNameLink0=(lastLayer0+'menu');
					lastLink0 = document.getElementById(lastNameLink0);
					lastLink0.style.color='white';
					refLink0.style.background='#f4c601';
				}
		
				refLayer0.style.display = 'block';
				refNameLink0=(layer+'menu');
				refLink0 = document.getElementById(refNameLink0);
				refLink0.style.color='black';
				refLink0.style.background='#FFF8B9';


				lastVisibleLayer0 = refLayer0;
				lastLayer0=layer;
				
				
			break;
			case "adminop1":
				var refLayer1 = document.getElementById(layer);
				if (lastVisibleLayer1) {
					lastVisibleLayer1.style.display = 'none';
					lastNameLink1=(lastLayer1+'menu');
					lastLink1 = document.getElementById(lastNameLink1);
					lastLink1.style.color='white';
					refLink1.style.background='#f4c601';
				}
		
				refLayer1.style.display = 'block';
				refNameLink1=(layer+'menu');
				refLink1 = document.getElementById(refNameLink1);
				refLink1.style.color='black';
				refLink1.style.background='#FFF8B9';


				lastVisibleLayer1 = refLayer1;
				lastLayer1=layer;
				
				
			break;

			
				
		}	
	}

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES DE MOVIMIENTO PARA EL MAPA
//*******************************************************************************************************************//
//*******************************************************************************************************************//

	//Función para poner el estado en movimiento o no de los diferentes movimientos y ejecutar la función de movimiento
	function setStateMove(state,op,numeric) {
		stateMove=state;
		//Discrinamos si es zoom o move
			if ((op == 'in') || (op == 'out')) {
			//es zoom
				makeZoom(op);
			} else {
			//es move
				makeMove(op,numeric);
			}
		
	}

	//Función que comprueba el estado del movimiento y si es cierto se vuelve a llamar a si misma para moverse
	function makeMove(direction,numeric) {
		moveCommand="makeMove('"+direction+"','"+numeric+"')";
		if (stateMove==1) {
			move(direction,numeric);
			setTimeout(moveCommand, 100);	
		}
		
	}

	//Función que comprueba el estado del movimiento y si es cierto se vuelve a llamar a si misma para aumentar zoom
	function makeZoom(direction) {
		moveCommand="makeZoom('"+direction+"')";
		if (stateMove==1) {
			zoom(direction);
			setTimeout(moveCommand, 100);	
		}
		
	}

	//Función para mover el mapa
	function move(direction,numeric){
		//Layer a mover
		var moveLayer = document.getElementById('Movil');
		//Colocacion inicial arriba
		var originTopPX = moveLayer.style.top;
		//Colocacion inicial izquierda
		var originLeftPX = moveLayer.style.left;
		//Pasamos a número los datos
		var originTopN = parseInt(originTopPX);
		var originLeftN = parseInt(originLeftPX);

		switch (direction){
			//abajo
			case "down":
				var newTopN = parseInt(originTopN) - parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
			break;
			//arriba
			case "up":
				var newTopN = parseInt(originTopN) + parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
			break;
			//derecha
			case "right":
				var newLeftN = parseInt(originLeftN) - parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;
			//izquierda
			case "left":
				var newLeftN = parseInt(originLeftN) + parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;
			//abajo derecha
			case "downright":
				var newTopN = parseInt(originTopN) - parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
				var newLeftN = parseInt(originLeftN) - parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;
			//abajo izquierda
			case "downleft":
				var newTopN = parseInt(originTopN) - parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
				var newLeftN = parseInt(originLeftN) + parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;
			//arriba derecha
			case "upright":
				var newTopN = parseInt(originTopN) + parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
				var newLeftN = parseInt(originLeftN) - parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;
			//arriba izquierda
			case "upleft":
				var newTopN = parseInt(originTopN) + parseInt(numeric);
				moveLayer.style.top = newTopN + "px";
				var newLeftN = parseInt(originLeftN) + parseInt(numeric);
				moveLayer.style.left = newLeftN + "px";
			break;	
		}	
	}

	//Función para el zoom del mapa
	function zoom(op) {
		switch (op) {
			//ampliar
			case "in":
			var factor=(80)
			break;
			//alejar
			case "out":
			var factor=(-80)
			break;
	
		}
		for (var i = 0; i <= totalimagesAll; i++) {
			var myImage = document.getElementById(imagesAll[i]);
			var ImageWidht = myImage.width;
			var ImageHeight = myImage.height;
			var newImageWidth = ImageWidht + parseInt(factor);
			var newImageHeight = ImageHeight + parseInt(factor);
			myImage.width = newImageWidth;
			myImage.height = newImageHeight;

		}

		//Aumentamos tambien los valores del div movil
		var layerMovil = document.getElementById('Movil');
			layerMovil.style.minwidth = newImageWidth + 'px';
			layerMovil.style.width = newImageWidth + 'px';
			layerMovil.style.maxwidth = newImageWidth + 'px';
			layerMovil.style.minheight = newImageHeight + 'px';
			layerMovil.style.height = newImageHeight + 'px';
			layerMovil.style.maxheight = newImageHeight + 'px';
	
		var newFactorWidth = (parseInt(originTotalLong) / parseInt(newImageWidth));
		var newFactorHeight = (parseInt(originTotalLat) / parseInt(newImageHeight));
		
			for (var i = 1; i <= totalItems; i++) {
				var newWidth = ((parseInt(minLong)-longValue[i]) / newFactorWidth);
				var newHeight = ((parseInt(maxLat)-latValue[i]) / newFactorHeight);
				if (newWidth < 0 ) { newWidth=-newWidth; }
				if (newHeight < 0 ) { newHeight=-newHeight; }
				var moveLayer = document.getElementById(layerAll[i]);
				moveLayer.style.left = parseInt(newWidth) + "px";
				moveLayer.style.top = parseInt(newHeight) + "px";
				var LayerMore = (layerAll[i] + "more");
				var moveLayerMore = document.getElementById(LayerMore);
				moveLayerMore.style.left = (parseInt(newWidth) - 30) + "px";
				moveLayerMore.style.top = (parseInt(newHeight) + 30) + "px";
			}
			
		
		
	}

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA LA SELECCION
//*******************************************************************************************************************//
//*******************************************************************************************************************//
	 function openSelection(what,pathAdmin) {
		switch (what) {
			//seleccionar iconos para metainfo
			case "metainfo":
			var url='/showicons.php/metainfo';
			var urlName='Icons Metainfo';
			break;
			//seleccionar iconos para el item
			case "item":
			var url='/showicons.php/item';
			var urlName='Icons Item';
			break;
			//Seleccionar metainfos para el item
			case "item_metainfo":
			var url='/item_metainfo.php';
			var urlName='Items Metainfo';
			break;
			//Seleccionar tipo item
			case "type":
			var url='/showtypes.php';
			var urlName='Item Types';
			break;
	
		}
		totalUrl=pathAdmin+url;
    		openWindow = window.open(totalUrl, urlName, 'width=200,height=300,scrollbars=yes');
	}


	function closeSelection(what,wreturn) {
		switch (what) {
			//seleccionar iconos
			case "metainfo":
			var idForm='new_metainfo';
			iconReturn = opener.document.getElementById(idForm);
			iconReturn.icon_metainfo.value = wreturn;
			break;
			//alejar
			case "item":
			var idForm='item';
			iconReturn = opener.document.getElementById(idForm);
			iconReturn.icon_item.value = wreturn;
			break;
			case "item":
			var idForm='item';
			iconReturn = opener.document.getElementById(idForm);
			iconReturn.icon_item.value = wreturn;
			break;
			case "type":
			var idForm='item';
			typeReturn = opener.document.getElementById(idForm);
			typeReturn.type_item.value = wreturn;
			break;
		}
		
		close();
	}


	function itemMetainfoSelection() {
		var metainfoName = '';
		var metainfoId = '';
		var firstMetainfo = 0;
		for (var i = 0; i < document.item_metainfo.elements.length; i++) {
			if (document.item_metainfo.elements[i].checked == true) {
				if (firstMetainfo == 0 ) { 
					sep = '';
					firstMetainfo = 1;
				} else {
					sep = ',';
				}
			metainfoName = metainfoName + sep + document.item_metainfo.elements[i].name;
			metainfoId = metainfoId + sep + document.item_metainfo.elements[i].value;
			}
		}

		metainfoReturn = opener.document.getElementById('item');
		metainfoReturn.metainfo_item.value = metainfoName;
		metainfoReturn.metainfoId_item.value = metainfoId;
		close();
	}

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA LINKS
//*******************************************************************************************************************//
//*******************************************************************************************************************//

	function noOperative (msj) {
	alert(msj);
	}

	function confirmOp(msj,reference) {
		if (confirm(msj)) {
		location.href = reference;
		}

}



//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA POSICION DEL MAPA E ITEMS
//*******************************************************************************************************************//
//*******************************************************************************************************************//

	//Funcion para el cálculo del CSS
	function buildMapStructure() {
		var windowHeight = window.screen.height;
		var windowWidth = window.screen.width;

		var navigatorHeight = windowHeight -320;
		var navigatorWidth = windowWidth -50;

		//Algunas variables estáticas
			//ContentTopMargin
			var contentTopMargin=90;
			//ColDerWidth
			var colderWidth=260;
			//ArrowsWidth
			var arrowsWidth=20;
			//ArrowsHeight
			var arrowsHeight=20;
			//Images CSS Directory
			var imageDirectoryDefault='images/default';
			//Border Column Right
			var borderColder=9;

		//Construimos variables dinámicas

	
			//VisualWidth is NavigatorWidth - ColderWidth - 10 for padding
			var visualWidth=((navigatorWidth - colderWidth) - 10);
			//VisualHeight is NavigatorHeight - 20px for footer 
			var visualHeight=(navigatorHeight - 20);
			//Visual Top Position is ContentTopMargin + ArrowsHeight
			var visualTopPosition=(contentTopMargin + arrowsHeight);
			//Visual Left Position is + $ArrowsWidth
			var visualLeftPosition=arrowsWidth;
			//ColderTopPosition is only $ContentTopMargin position
			var colderTopPosition=contentTopMargin;
			//ColderLeftPosition is arrowsWidth * 2 + $VisualWidth + 10 for padding
			var colderLeftPosition=((arrowsWidth * 2) + visualWidth + 1);
			//ColderHeight is 
			var colderHeight=((arrowsHeight * 2) + visualHeight -(borderColder * 2));
			//OverVisualWidth is VisualWidth + ($ArrowsWidth * 2)
			var overVisualWidth=((arrowsWidth) + visualWidth);
			//LeftVisualTopPosition
			var leftVisualTopPosition=(contentTopMargin + arrowsHeight);
			//UnderVisualWidth is equal as $OverVisualWidth
			var underVisualWidth=overVisualWidth;
			//UnderVisualPosition 
			var underVisualTopPosition=(contentTopMargin + arrowsHeight + visualHeight);
			//RightVisualTopPosition is equal as $LeftVisualTopPosition
			var rightVisualTopPosition=leftVisualTopPosition;
			//RightVisualLeftPosition
			var rightVisualLeftPosition=(overVisualWidth);

		//ARROWS POSITION
			//UpLeftArrow
			var upLeftArrowTop=contentTopMargin;
			var upLeftArrowLeft=0;
			//UpArrow
			var upArrowTop=contentTopMargin;
			var upArrowLeft=((visualWidth / 2) + 30);
			//UpRightArrow
			var upRightArrowTop=contentTopMargin;
			var upRigthArrowLeft=(visualWidth  + arrowsHeight);
			
			//Left Arrow
			var leftArrowTop=((visualHeight /2) + contentTopMargin);
			var leftArrowLeft=0;

			//RigthArrow
			var rightArrowTop=leftArrowTop;
			var rightArrowLeft=(visualWidth + arrowsHeight);
			//DownLeftArrow
			var downLeftArrowTop=(contentTopMargin + arrowsHeight + visualHeight);
			var downLeftArrowLeft=0;
			//Down
			var downArrowTop=(contentTopMargin + arrowsHeight + visualHeight);
			var downArrowLeft=((visualWidth / 2) + 30);
			//DownRightArrow
			var downRightArrowTop=(contentTopMargin + arrowsHeight + visualHeight);
			var downRightArrowLeft=(visualWidth + arrowsHeight);
	
	
		//Ejecutamos el CSS STYLE
			//z-index levels
			//1: movil map layer 
			//2: layers
			//3: items
			//4: itemsmore
			//5: visual
			//6: arrows

			//ColDer
			var layerColDer = document.getElementById('colder');
				layerColDer.style.top = colderTopPosition + 'px';
				layerColDer.style.right = 0 + 'px';
				layerColDer.style.minwidth = colderWidth + 'px';
				layerColDer.style.width = colderWidth + 'px';
				layerColDer.style.maxwidth = colderWidth + 'px';
				layerColDer.style.minheight = colderHeight + 'px';
				layerColDer.style.height = colderHeight + 'px';
				layerColDer.style.maxheight = colderHeight + 'px';
		
			//OverVisual
			var layerOverVisual = document.getElementById('overvisual');
				layerOverVisual.style.top = contentTopMargin + 'px';
				layerOverVisual.style.left = arrowsWidth + 'px';
				layerOverVisual.style.minwidth = overVisualWidth + 'px';
				layerOverVisual.style.width = overVisualWidth + 'px';
				layerOverVisual.style.maxwidth = overVisualWidth + 'px';
				layerOverVisual.style.minheight = arrowsHeight + 'px';
				layerOverVisual.style.height = arrowsHeight + 'px';
				layerOverVisual.style.maxheight = arrowsHeight + 'px';

	
			//LeftVisual
			var layerLeftVisual = document.getElementById('leftvisual');
				layerLeftVisual.style.top = leftVisualTopPosition + 'px';
				layerLeftVisual.style.left = 0 + 'px';
				layerLeftVisual.style.minwidth = arrowsWidth + 'px';
				layerLeftVisual.style.width = arrowsWidth + 'px';
				layerLeftVisual.style.maxwidth = arrowsWidth + 'px';
				layerLeftVisual.style.minheight = visualHeight + 'px';
				layerLeftVisual.style.height = visualHeight + 'px';
				layerLeftVisual.style.maxheight = visualHeight + 'px';

			//UnderVisual
			var layerUnderVisual = document.getElementById('undervisual');
				layerUnderVisual.style.top = underVisualTopPosition + 'px';
				layerUnderVisual.style.left = arrowsHeight + 'px';
				layerUnderVisual.style.minwidth = underVisualWidth + 'px';
				layerUnderVisual.style.width = underVisualWidth + 'px';
				layerUnderVisual.style.maxwidth = underVisualWidth + 'px';
				layerUnderVisual.style.minheight = arrowsHeight + 'px';
				layerUnderVisual.style.height = arrowsHeight + 'px';
				layerUnderVisual.style.maxheight = arrowsHeight + 'px';
	
			//RightVisual
			var layerRightVisual = document.getElementById('rightvisual');
				layerRightVisual.style.top = rightVisualTopPosition + 'px';
				layerRightVisual.style.left = rightVisualLeftPosition + 'px';
				layerRightVisual.style.minwidth = arrowsWidth + 'px';
				layerRightVisual.style.width = arrowsWidth + 'px';
				layerRightVisual.style.maxwidth = arrowsWidth + 'px';
				layerRightVisual.style.minheight = visualHeight + 'px';
				layerRightVisual.style.height = visualHeight + 'px';
				layerRightVisual.style.maxheight = visualHeight + 'px';
	
			//Visual
			var layerVisual = document.getElementById('visual');
				layerVisual.style.top = visualTopPosition + 'px';
				layerVisual.style.left = visualLeftPosition + 'px';
				layerVisual.style.minwidth = visualWidth + 'px';
				layerVisual.style.width = visualWidth + 'px';
				layerVisual.style.minheight = visualHeight + 'px';
				layerVisual.style.height = visualHeight + 'px';
				
			//Arrowupleft
			var layerArrowUpLeft = document.getElementById('arrowupleft');
				layerArrowUpLeft.style.top = upLeftArrowTop + 'px';
				layerArrowUpLeft.style.left = upLeftArrowLeft + 'px';

			//Arrowup
			var layerArrowUp = document.getElementById('arrowup');
				layerArrowUp.style.top = upArrowTop + 'px';
				layerArrowUp.style.left = upArrowLeft + 'px';

			//Arrowupright
			var layerArrowUpRight = document.getElementById('arrowupright');
				layerArrowUpRight.style.top = upRightArrowTop + 'px';
				layerArrowUpRight.style.left = upRigthArrowLeft + 'px';

			//Arrowleft
			var layerArrowLeft = document.getElementById('arrowleft');
				layerArrowLeft.style.top = leftArrowTop + 'px';
				layerArrowLeft.style.left = leftArrowLeft + 'px';

			//Arrowright
			var layerArrowRight = document.getElementById('arrowright');
				layerArrowRight.style.top = rightArrowTop + 'px';
				layerArrowRight.style.left = rightArrowLeft + 'px';

			//Arrowdownleft
			var layerArrowDownLeft = document.getElementById('arrowdownleft');
				layerArrowDownLeft.style.top = downLeftArrowTop + 'px';
				layerArrowDownLeft.style.left = downLeftArrowLeft + 'px';

			//Arrowdown
			var layerArrowDown = document.getElementById('arrowdown');
				layerArrowDown.style.top = downArrowTop + 'px';
				layerArrowDown.style.left = downArrowLeft + 'px';

			//Arrowdownright
			var layerArrowDownRight = document.getElementById('arrowdownright');
				layerArrowDownRight.style.top = downRightArrowTop + 'px';
				layerArrowDownRight.style.left = downRightArrowLeft + 'px';

			//Movil
			//Este es especial, ya que calcularemos sus dimensiones para establecer la altura en funcion de la resolucion del mapa
			var movilHeight=visualHeight;
			var movilWidth=parseInt((originImageWidth * visualHeight)/originImageHeight);
			var layerMovil = document.getElementById('Movil');
				layerMovil.style.minwidth = movilWidth + 'px';
				layerMovil.style.width = movilWidth + 'px';
				layerMovil.style.minheight = movilHeight + 'px';
				layerMovil.style.height = movilHeight + 'px';
			
	//Hacemos la llamada para situar los items con las dimensiones del movil

	setItemsPositions(movilWidth,movilHeight);
	}

	function setItemsPositions (newImageWidth,newImageHeight) {
	
		//Situamos las imágenes a su proporción
		for (var i = 0; i <= totalimagesAll; i++) {
			var myImage = document.getElementById(imagesAll[i]);
			myImage.width = newImageWidth;
			myImage.height = newImageHeight;

		}

		var newFactorWidth = (parseInt(originTotalLong) / parseInt(newImageWidth));
		var newFactorHeight = (parseInt(originTotalLat) / parseInt(newImageHeight));
		
			for (var i = 1; i <= totalItems; i++) {
				var newWidth = ((parseInt(minLong)-longValue[i]) / newFactorWidth);
				var newHeight = ((parseInt(maxLat)-latValue[i]) / newFactorHeight);
				if (newWidth < 0 ) { newWidth=-newWidth; }
				if (newHeight < 0 ) { newHeight=-newHeight; }
				var moveLayer = document.getElementById(layerAll[i]);
				moveLayer.style.left = parseInt(newWidth) + "px";
				moveLayer.style.top = parseInt(newHeight) + "px";
				var LayerMore = (layerAll[i] + "more");
				var moveLayerMore = document.getElementById(LayerMore);
				moveLayerMore.style.left = (parseInt(newWidth) - 30) + "px";
				moveLayerMore.style.top = (parseInt(newHeight) + 30) + "px";
			}
			
		
	}

	function setItemsColors () {
		for (var i = 1; i <= totalItems; i++) {
		var layerSpan = (layerAll[i] + "s");
		var colorLayerSpan = document.getElementById(layerSpan);
		colorLayerSpan.style.background= colorValue[i];
		var layerMore = (layerAll[i] + "more");
		borderColor = "2px " + colorValue[i] + " solid";
		var colorLayerMore = document.getElementById(layerMore);
		colorLayerMore.style.borderStyle= "solid";
		colorLayerMore.style.borderColor= colorValue[i];
		colorLayerMore.style.borderWidths= "2px";
		}
	//Y establecemos el color de fondo para el layer principal
	var colorLayer = document.getElementById('visual');
	colorLayer.style.background= backgroundColor;
	}

	function backOrigin() {
		var myImage = document.getElementById("backgroundimage");
			var windowHeight = window.screen.height;
			var visualHeight = windowHeight -340;
			var movilHeight=visualHeight;
		var movilWidth=parseInt((originImageWidth * visualHeight)/originImageHeight);
		myImage.width = movilWidth;
		myImage.height = movilHeight;
		setItemsPositions(movilWidth,movilHeight);
	}

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA CONTROL DE EVENTOS EN EL MAPA
//*******************************************************************************************************************//
//*******************************************************************************************************************//

	function capture() {
		//cambiamos valor de captura
		captura=1;
		//Ocultar mensaje a&#241;uda
		var changeLayer=document.getElementById('helpadditem');
		changeLayer.style.display = "none";

		//Mostrar mensaje a&#241;adir item
		var changeLayer=document.getElementById('nowadditem');
		changeLayer.style.display = "inline";
		
		//Cambiamos el cursor
		var moveLayer = document.getElementById('Movil');
		moveLayer.style.cursor = "crosshair";
	}

	function addItem(evnt) {
		if (captura==1) {
			//Calculamos la posición en latitud y longitud del click
			

			//-------------------------------------------------------------------------------------------------
			///OLD -> CHANGE
			// Cuando usábamos las funciones de waz'n se tenía restar eso, pero ahora mismo no....
			//El event.LayerY e X dan la posición exclusiva dentro del layer que esta siendo movido... no hace
			//falta calcular posición... 

			//Posicion de la imagen
			//var layerMovil = document.getElementById('Movil');
			//ImageTopPosition=parseInt(layerMovil.style.top);
			//ImageLeftPosition=parseInt(layerMovil.style.left);


			//Restamos a la posicion del evento la distancia de margen de la imagen
			//realTopClick=(evnt.layerY-ImageTopPosition);
			//realLeftClick=(evnt.layerX-ImageLeftPosition);

			//-------------------------------------------------------------------------------------------------

			//Posición del click
			realTopClick = evnt.layerY;
			realLeftClick = evnt.layerX;

			//Ancho y Alto de la imagen
			var myImage = document.getElementById('backgroundimage');
			ImageWidth = myImage.width;
			ImageHeight = myImage.height;

			//Calculamos entonces su posicion ahora de latitud y longitud
			relativeLongItem=parseInt((realLeftClick*originTotalLong)/ImageWidth);
			relativeLatItem=parseInt((realTopClick*originTotalLat)/ImageHeight);

			realLongItem=minLong+relativeLongItem;
			realLatItem=maxLat-relativeLatItem;
			

			newItemFormatUrl=urlNewItem+'?lat='+realLatItem+'&long='+realLongItem;
			location.href = newItemFormatUrl;
			
		}
	}

	
//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA La CARGA DE LA PÁGINA
//*******************************************************************************************************************//
//*******************************************************************************************************************//	

	function onCharge() {
		//Construimos el dise&#241;o CSS
		buildMapStructure();
		setItemsColors();
	}

//*******************************************************************************************************************//
//*******************************************************************************************************************//
//FUNCIONES PARA LA PREVISUALIZACION DEL ZOOM
//*******************************************************************************************************************//
//*******************************************************************************************************************//	

	function selectZoom(num) {
		if (lastZoomSelect) {
		lastZoomSelect.style.display = 'none';
		lastLinkZoomSelect.style.color = '#099273';
		lastLinkZoomSelect.style.backgroundcolor = 'white';
		}
	nameZoom = "tablezoom" + num;
	var zoomSelect = document.getElementById(nameZoom);
	zoomSelect.style.display = 'block';

	nameLinkZoom = "linktablezoom" + num;
	var linkZoomSelect = document.getElementById(nameLinkZoom);
	linkZoomSelect.style.color = '#d3d3d3';
	linkZoomSelect.style.backgroundcolor = 'white';

	lastZoomSelect = zoomSelect;
	lastLinkZoomSelect = linkZoomSelect;
	}

