// actualiza el tooltip con el valor que tiene withElement
// y si está en blanco le pone el valor original
function updateBalloon(balloonElement, withElement){
	if ($(withElement).val() != ""){
		$(balloonElement).hide();
	} else {
		$(balloonElement + " .balloonText").text(
				$(balloonElement + " .balloonText").data("original")
		);
	}
}

function redrawBalloon(balloonElement){
	if ($(balloonElement).hasClass("inputHover") || $(balloonElement).hasClass("labelHover")
			|| $(balloonElement).hasClass("focused")){
		// ocultar otros tooltips
		$(".balloon").not(balloonElement).hide();
		$(balloonElement).show();
	} else {
		// ocultar
		$(balloonElement).hide();
	}
}

/* Función que crea un tooltip para el input element a partir del texto contenido en balloonElement
 * Al elemento balloonElement hay que definirle la posición tomando como referencia la esquina
 * inferior izquierda, para que pueda crecer libremente hacia la derecha y hacia abajo (en caso
 * que se le haya limitado el ancho al balloonElement) 
 */
function balloon (element, balloonElement){
	// dar estilo al balloon
	var txt = $(balloonElement).text();
	$(balloonElement).addClass("balloon");
	$(balloonElement).text("");
	$(balloonElement).append("<div class='balloonText'>"+($(element).val()==""?txt:$(element).val())+"</div>"+
		"<div class='tlBalloon'></div><div class='trBalloon'></div><div class='blBalloon'></div><div class='brBalloon'></div><div class='sayBalloon'></div>"+
		"<div class='rightBalloon'></div><div class='leftBalloon'></div><div class='topBalloon'></div><div class='bottomBalloon'></div>");
	$(balloonElement + " .balloonText").data("original", txt);

	// mostrar el tooltip al pasar por encima con el mouse y ocultarlo al salir
	$(element).mouseout(function(){
		var cantidad_car = parseInt($(this).val().length);
		if(cantidad_car < 1){
			$(balloonElement).removeClass("inputHover");
			updateBalloon(balloonElement, '');
			redrawBalloon(balloonElement);
		}
	}).mouseover(function(){
		var cantidad_car = parseInt($(this).val().length);
		if(cantidad_car < 1){
			$(balloonElement).addClass("inputHover");
			updateBalloon(balloonElement, '');
			redrawBalloon(balloonElement);
			if(balloonElement==".keywordBalloon"){
				$("#tooltipKeyword").css("visibility","visible");
			}
			if(balloonElement==".localityBalloon"){
				$("#tooltipLocality").css("visibility","visible");
			}
		}else{
			if(balloonElement==".keywordBalloon"){
				$("#tooltipKeyword").css("visibility","hidden");
			}
			if(balloonElement==".localityBalloon"){
				$("#tooltipLocality").css("visibility","hidden");
			}
			
		}
	});
	
	// mostrar el tooltip al entrar en el elemento y ocultarlo al salir
	$(element).focus(function(){
		var cantidad_car = parseInt($(this).val().length);
		if(cantidad_car < 1){
			updateBalloon(balloonElement, element);
			$(balloonElement).addClass("focused");
			redrawBalloon(balloonElement);
			// este es un fix para ocultar el label de localidad cuando se borra el
			// texto de localidad luego de hacer una búsqueda por localidad
			if ($(element).prev().is("label") && $(element).val() == ""){
				$(element).prev().hide();
			}
		}
	});
	$(element).blur(function(){ 
		var cantidad_car = parseInt($(this).val().length);
		if(cantidad_car < 1){
			$(balloonElement).removeClass("focused");
			redrawBalloon(balloonElement);
			// este es un fix para mostrar el label de localidad cuando se borra el
			// texto de localidad luego de hacer una búsqueda por localidad
			if ($(element).prev().is("label") && $(element).val() == ""){
				$(element).prev().show();
			}
		}
	});
	
	// mostrarlo cuando se pasa sobre el label (porque se ubica sobre el input)
	if ($(element).prev().is("label")){
		$(element).prev().mouseout(function(){
			$(balloonElement).removeClass("labelHover");
			redrawBalloon(balloonElement);
		}).mouseover(function(){
			$(balloonElement).addClass("labelHover");
			redrawBalloon(balloonElement);
		});
	}
	
	// actualizar el valor del tooltip al tipear
	$(element).keyup(function(){ updateBalloon(balloonElement, element) });
}

$(document).ready(function(){
	$("#rdPorPalabra").click(function(){
		$("#keyword").css("display","inline");
		$("#keyword").css("visibility","visible");
		$("#keyword").focus();
		$("#labelKeyword").css("display","");
		$("#alojamientos").css("display","none");
		$("#category").attr("value","");
	});
	$("#rdPorCategoria").click(function(){		
		prenderCategorias();
	});
	$("#alojamientos").click(function(){
		var valueSelected = $(this).attr("value");
		$("#category").attr("value",valueSelected);		
	});

	/* setup search type */
	if ($("#searchType").val() == ""){
		$("#searchType").val(1);
	}
	/* end setup search type */
	
	/* asegurarse que cuando el usuario escribe o modifica algo en el campo keyword
	 * el tipo de búsqueda sea seteado a keyword (1) */
	$("#keyword").one("keydown", function(event){
		if (event.keyCode != 13) {
			$("#searchType").val(1);
		}
	});

	if($("#rdPorCategoria").attr("checked")){
		prenderCategorias();
	}
	
	/* Tooltips del cajón de búsqueda */
	balloon('#keyword', '.keywordBalloon');
	balloon('#locality', '.localityBalloon');
});

function prenderCategorias(){
	$("#keyword").attr("value","");
	/*$("#keyword").css("display","none");*/
	$("#labelKeyword").css("display","none");
	$("#alojamientos").css("display","inline");
}