var instalacion_seleccionada = null;
var foto_seleccionada = null;

$(document).ready(function(){
	cargarInstalaciones();
	seleccionarInstalacion(0);

	$("#foto-anterior").click(function(){
		if (instalacion_seleccionada==null || foto_seleccionada==null)
			return false;

		var anterior = instalaciones[instalacion_seleccionada].fotos.length - 1;

		if (foto_seleccionada > 0)
			anterior = foto_seleccionada - 1;

		mostrarFoto(instalaciones[instalacion_seleccionada], anterior);
	});

	$("#foto-siguiente").click(function(){
		if (instalacion_seleccionada==null || foto_seleccionada==null)
			return false;

		var siguiente = 0;

		if (foto_seleccionada < instalaciones[instalacion_seleccionada].fotos.length - 1)
			siguiente = foto_seleccionada + 1;

		mostrarFoto(instalaciones[instalacion_seleccionada], siguiente);
	});
});

function cargarInstalaciones(){
	$("#galeria").empty();

	$(instalaciones).each(function(){
		$("<li><a href=\"#\"><img src=\"" + this.fotos[0] + "\" alt=\"instalaciones\"/></a></li>")
			.appendTo("#galeria");
	});

	$("#galeria li").hover(
		function(){
			$(this).css({
				borderStyle: "solid",
				marginTop: "0px",
				marginBottom: "0px",
				marginLeft: "-3px",
				marginRight: "4px"
			});
		},
		function(){

			if ($(this).index() != instalacion_seleccionada){

				$(this).css({
					borderStyle: "none",
					marginTop: "3px",
					marginBottom: "3px",
					marginLeft: "0px",
					marginRight: "7px"
				});

			}
		}
	);

	$("#galeria a").click(function(){
		seleccionarInstalacion($(this).parent().index());
		return false;
	});
}

function seleccionarInstalacion(i){
	instalacion_seleccionada = i;

	$("#galeria li:eq(" + i + ")").css({
		borderStyle: "solid",
		marginTop: "0px",
		marginBottom: "0px",
		marginLeft: "-3px",
		marginRight: "4px"
	});

	$("#galeria li:not(:eq(" + i + "))").css({
		borderStyle: "none",
		marginTop: "3px",
		marginBottom: "3px",
		marginLeft: "0px",
		marginRight: "7px"
	});

        mostrarDescripcion(instalaciones[i])
	mostrarFoto(instalaciones[i], 0);
}

function mostrarDescripcion(instalacion){
    $("#instalacion-descripcion").html(instalacion.descripcion[idioma]);
}

function mostrarFoto(instalacion, i){
	$("#foto-anterior, #foto-siguiente").attr("disabled", true);

	foto_seleccionada = i;

	$("#foto").css("backgroundImage", "url(" + instalacion.fotos[i] + ")");

	$("#foto-anterior, #foto-siguiente").attr("disabled", false);
}