var mapaItem = '.Animation .AreaMap .ItemMap';
var mapaTitulo = '.Animation .AreaMap .TituloMap';
var btnMapa = '.MenuMapa .MenuItemM';
var locMapaContent = '.Animation .AreaMap .Localizadores';
var locMapaItem = '.Animation .AreaMap .Localizadores .ItemLoc';
var locMapaInfo = '.Animation .AreaMap .Localizadores .DotsInfo .ItemDot';
var highwaysContent = '.Animation .AreaMap .Highways';
var highwaysItem = '.Animation .AreaMap .Highways .ItemHW';
//POSICIONES MAPA
var mapaPosXGrande = -200;
var mapaPosYGrande = -720;
var mapaPosXChico = 50;
var mapaPosYChico = -200;
//POSICIONES LOCALIZADORES IN
var locX1 = [257, 236, 257, 225];
var locY1 = [124, 161, 168, 206];
//POSICIONES LOCALIZADORES OUT
var locX2 = [257, -236, 1257, 225];
var locY2 = [-124, 161, 168, 706];

//TAMAÑOS MAPA
var mapaAnchoGrande = 903;
var mapaAltoGrande = 1051;
var mapaAnchoChico = mapaAnchoGrande*0.5;
var mapaAltoChico = mapaAltoGrande*0.5;
//IMAGENES DEL MENU
var btnMapaSrcAct = [
	'img/btn-coverage1-act.gif',
	'img/btn-coverage2-act.gif',
	'img/btn-coverage3-act.gif',
	'img/btn-coverage4-act.gif'
];
btnMapaSrcDes = [
	'img/btn-coverage1-des.gif',
	'img/btn-coverage2-des.gif',
	'img/btn-coverage3-des.gif',
	'img/btn-coverage4-des.gif'
];
MapaTituloSrc = [
	'img/map/titulo1.png',
	'img/map/titulo2.png',
	'img/map/titulo3.png',
	'img/map/titulo4.png'
];


$(document).ready(function(){
	AnimarMapa("chico");
	$('.Animation .AreaMap .InfoCoverage .DotsInfo .ItemDot').animate({'opacity': 0.9}, 1000);
	
	$(btnMapa).click(function(){
		var index = $(btnMapa).index(this);
		
		ActualizarImagenBoton(index);
		
		if (index == 2 || index == 3 || index == 0){
			AnimarMapa("chico");
			$(highwaysContent).css('display', 'block');
			if (index == 2){
				$(highwaysItem).eq(0).css('display', 'block');
				$(highwaysItem).eq(1).css('display', 'none');
				$(highwaysItem).eq(0).css({'height': 0, 'top': 180});
				$(highwaysItem).eq(0).animate({'height': 328, 'top': -13}, 1000);
				$('.Animation .AreaMap .InfoCoverage .DotsInfo .ItemDot').animate({'opacity': 0}, 1000);
			} else if (index == 3){
				$(highwaysItem).eq(0).css('display', 'none');
				$(highwaysItem).eq(1).css('display', 'block');
				$(highwaysItem).eq(1).css({'height': 0, 'top': 180});
				$(highwaysItem).eq(1).animate({'height': 307, 'top': 0}, 1000);
				$('.Animation .AreaMap .InfoCoverage .DotsInfo .ItemDot').animate({'opacity': 0}, 1000);
			} else if (index == 0){
				$(highwaysItem).eq(0).css('display', 'none');
				$(highwaysItem).eq(1).css('display', 'none');
				$('.Animation .AreaMap .InfoCoverage .DotsInfo .ItemDot').animate({'opacity': 0.9}, 1000);
			}
		} else {
			AnimarMapa("grande");
			$(highwaysContent).css('display', 'none');
			$('.Animation .AreaMap .InfoCoverage .DotsInfo .ItemDot').animate({'opacity': 0}, 1000);
		}
		if (index == 1){
			$(locMapaInfo).stop().css({'opacity': 0});
			$(locMapaContent).css('display', 'block');
			for (var a = 0; a < $(locMapaItem).length; a++){
				$(locMapaItem).eq(a).animate({
					'left': locX1[a],
					'top': locY1[a]
				}, 1000);
			}
			$(locMapaItem).hover(function(){
				var indexI = $(locMapaItem).index(this);
				for (var b = 0; b < $(locMapaInfo).length; b++){
					if (b == indexI){
						$(locMapaInfo).eq(b).stop().animate({'opacity': 0.9}, 500);
					} else {
						$(locMapaInfo).eq(b).stop().animate({'opacity': 0}, 400);
					}
				}
			}, function(){
				var indexI = $(locMapaItem).index(this);
				for (var b = 0; b < $(locMapaInfo).length; b++){
					$(locMapaInfo).eq(b).stop().animate({'opacity': 0}, 400);
				}
			});
		} else {
			$(locMapaContent).css('display', 'none');
			for (var a = 0; a < $(locMapaItem).length; a++){
				$(locMapaItem).eq(a).animate({
					'left': locX2[a],
					'top': locY2[a]
				}, 300);
			}
		}
	});
});

function ActualizarImagenBoton(index){
	for (var i = 0; i < $(btnMapa).length; i++){
		if (i == index){
			$(btnMapa).eq(i).attr('src', btnMapaSrcAct[i]);
			$(mapaTitulo).attr('src', MapaTituloSrc[i]);
		} else {
			$(btnMapa).eq(i).attr('src', btnMapaSrcDes[i]);
		}
	}
}

function AnimarMapa(tamano){
	if (tamano == "chico"){
		$(mapaItem).stop().animate({
			'width': mapaAnchoChico,
			'height': mapaAltoChico,
			'top': mapaPosYChico,
			'left': mapaPosXChico
		}, 1000);
	} else if(tamano == "grande"){
		$(mapaItem).stop().animate({
			'width': mapaAnchoGrande,
			'height': mapaAltoGrande,
			'top': mapaPosYGrande,
			'left': mapaPosXGrande
		}, 1000);
	}
}