$(document).ready(function(){
	
	array_campos = $("#form_mail label");
	array_sexo = $("#datos_sexo label");
	var aviso_sexo = true;
	var errores_validacion = false;
	
	$("#form_mail input, #form_mail select, #form_mail textarea")
		.blur(function (event) {
        	 comprobar_campo($(this), array_campos, array_sexo, false);
			 event.preventDefault();
    });
		
	$("#envio")	
		.click(function (event) {
         	var errores_validacion = comprobar_campo($(this), array_campos, array_sexo, true);
			if(errores_validacion)
				event.preventDefault();
	});

    function comprobar_campo(campo, array_campos, array_sexo, enviar){
		
		if(enviar)
			var orden = $(array_campos).length - 1;
		else	
			var orden = campo.attr("tabindex");
		var j = 0;
		
		
		for(i=0; i < orden; i++)
		{
			var valor = $(array_campos[i]).children().attr("value");
			var nombre_campo = $(array_campos[i]).children().attr("name");
			var tipo = $(array_campos[i]).children().attr("class");
			
			if(valor == undefined)
			{				
				if(tipo == "obligatorio" || tipo == "obligatorio marcado")
					form_error($(array_campos[i]).children(), "vacio")
				else
					form_aviso($(array_campos[i]).children(), "vacio")									
			}
			else{
				if(nombre_campo == "apellidos")
					comprobar_apellidos($(array_campos[i]).children())
					
				else if(nombre_campo == "telefono")
					comprobar_telefono($(array_campos[i]).children())
			
				else if(nombre_campo == "mail")
					comprobar_email($(array_campos[i]).children())
				
				else{
					var estado_campo = $(array_campos[i]).children().attr("class")
					if(estado_campo == "obligatorio marcado" || estado_campo == "marcado" )
					{
						$(array_campos[i]).children().removeClass("marcado")	
						form_correcto($(array_campos[i]).children(), tipo)
					}
				}
			}
						
			if(nombre_campo == "sexo")
			{					
				var marcado_sexo = $(array_sexo[j]).children().attr("checked");
				if(marcado_sexo)
					aviso_sexo = false;
				j++;				
			}			
		}
		if(aviso_sexo && j==2)
		{
			form_error($(array_campos[5]).children(), "sexo")
		}
		if($("#listado_errores ol li.error").length == 0)
			return false
		else
			return true
		
	}
	
	function comprobar_apellidos(apellidos){
		$("#e_apellidos").remove();
		
		v_apellidos = $(apellidos).attr("value");
		var er_apellidos = / /
		 if(!er_apellidos.test(v_apellidos))
		 	form_aviso(apellidos, "apellidos")	
		 else
		 {
			var estado_campo = $(apellidos).attr("class") 
			if(estado_campo == "obligatorio marcado" || estado_campo == "marcado" )
			{
				$(apellidos).removeClass("marcado")
		 		form_correcto(apellidos, "apellidos")
			}
		 }
	}
	
	function comprobar_telefono(telefono){
		$("#a_telefono").remove();
		
		v_telefono = $(telefono).attr("value");
		var er_tlfono = /^([0-9\s\+\-])+$/
		 var num_telefono = v_telefono.length
		 if(!er_tlfono.test(v_telefono))
		 	form_aviso(telefono, "no-num")
		 else if(num_telefono < 9)
		 	form_aviso(telefono, "corto")
		 else
		 {
		 	var estado_campo = $(telefono).attr("class") 
			if(estado_campo == "obligatorio marcado" || estado_campo == "marcado" )
			{
				$(telefono).removeClass("marcado")
		 		form_correcto(telefono)
			}
		 }
	}
	
	function comprobar_email(email){
		 $("#e_mail").remove();
		 
		 v_email = $(email).attr("value");
		 var er_email =/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/
		 if(!er_email.test(v_email))
		 	form_error(email, "email")
		else
		{
			var estado_campo = $(email).attr("class") 
			if(estado_campo == "obligatorio marcado" || estado_campo == "marcado" )
			{
				$(email).removeClass("marcado")
		 		form_correcto(email)
			}
		}
	}
	
	function form_error(campo, error)
	{	
	    $(campo).animate({ 
  			backgroundColor: "#FFE8E8",
			color: "#000"
        }, 1500 );
		
		$(campo).addClass("marcado")
		var id_error = "#e_" + $(campo).attr("name")
		
		switch(error)
		{
		case "vacio": 
			
			if($(id_error).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='e_" + $(campo).attr("name") + "' class='error'><span>El campo obligatorio <strong>" + $(campo).attr("name") + "</strong> se encuentra vacio</span></a></li>")
			}
		break;
			
		case "email": 
			if($(id_error).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='e_" + $(campo).attr("name") + "' class='error'><span>El <strong>e-mail</strong> introducido es incorrecto</span></a></li>")
			}
		break;
		
		case "sexo": 
			
			if($(id_error).attr("class") == undefined)
			{	
				$("#listado_errores ol").append("<li id='e_" + $(campo).attr("name") + "' class='error'><span>Debe seleccionar su <strong>sexo</strong>: Mujer, Hombre</a></li>")
			}
		break;
		}		
	}
	
	function form_aviso(campo, aviso)
	{		
		$(campo).animate({ 
  			backgroundColor: "#FFFFD9",
			color: "#000"
        }, 1500 );
		
		$(campo).addClass("marcado")
		
		var id_aviso = "#a_" + $(campo).attr("name")
		
		switch(aviso)
		{
		case "vacio": 
			
			if($(id_aviso).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='a_" + $(campo).attr("name") + "' class='aviso'><span>Aviso: El campo  <strong>" + $(campo).attr("name") + "</strong> se encuentra vacio</span></a></li>")
			}
		break;
		
		case "no-num": 
			if($(id_aviso).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='a_" + $(campo).attr("name") + "' class='aviso'><span>Aviso: El <strong>numero de telefono</strong> introducido es incorrecto (Utilizar solo números o los siguientes simbolos : +, -)</span></a></li>")
			}
		break;
		
		case "corto": 
			if($(id_aviso).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='a_" + $(campo).attr("name") + "' class='aviso'><span>Aviso: El <strong>numero de telefono</strong> introducido es demasiado corto</span></a></li>")
			}
		break;
		
		case "apellidos": 
			if($(id_aviso).attr("class") == undefined)
			{
				$("#listado_errores ol").append("<li id='a_" + $(campo).attr("name") + "' class='aviso'><span>Aviso: Solo has introducido un <strong>apellido</strong></span></a></li>")
			}
		break;
				
		}		
		
	}	
	
	function form_correcto(campo, tipo)
	{		
		$(campo).removeClass("marcado")	
		
		c_correcto = $(campo).attr("name");
				
		if(tipo == "obligatorio" || tipo == "obligatorio marcado")
		{
			e_correcto = "#e_" + c_correcto;
			$(e_correcto).remove();			
		}
		else
		{
			a_correcto = "#a_" + c_correcto;
			$(a_correcto).remove();			
		}
		$(campo).animate({ 
  			backgroundColor: "#CDEFB4",
			color: "#000"
        }, 800 );
		
		$(campo).animate({ 
  			backgroundColor: "#FFF",
			color: "#999"
        }, 800 );
	}	
});


