//Código Asynchronous Javascript And XML
//Permite el envío de datos al servidor manteniendo la página cargada
//los datos viajan como XML
//
//©2006 DCH, inspirado por: http://www.ajax.com.es/
//Métodos y propiedades del objeto en http://www.ajax.com.es/index.php?title=XMLHttpRequest
//Documentación adicional:  http://www.drakware.com/articles/multijax.php
//                          http://www-128.ibm.com/developerworks/web/library/wa-ajaxintro1.html
//

//el primer paso es crear el objeto XMLHttpRequest 'peticion', dependiendo del navegador...
var peticion = false;

//ahora establezco la interfaz de intercabio, esto puede ir en procesacambios() pero lo hago global para poder cambiar el lugar de la respuesta dinámicamente
var respuesta; //el objeto 'respuesta' se refiere a un div, el cual se usa para mostrar resultado de interacción

function envia(url,datos) {

try { //window.XMLHttpRequest==TRUE si usamos Mozilla, Safari, Opera, Konqueror...
	peticion = new XMLHttpRequest(); //llamamos al constructor
} catch (e) {
	try { //window.ActiveXObject==TRUE si usamos IE
	     //en IE este objeto es parte de ActiveX
    peticion = new ActiveXObject("Msxml2.XMLHTTP"); //IE 5 o anterior
    } catch (e) {
      try {
        peticion = new ActiveXObject("Microsoft.XMLHTTP"); //IE 5 o posterior
        } catch (e) {
          peticion = false; alert("¡Error creando objeto!");
        }
    }
}
    //alert(peticion.readyState); //esperamos a que finalice una petición anterior: una petición es asíncrona, dos seguidas, no (ya que usan el mismo objeto, dá fallos)
    if (peticion) {
    	//document.getElementById("procesando").style.display = 'block;' //Linea de prueba
    	
        peticion.onreadystatechange = procesacambios;
        peticion.open("POST", url, true); //POST no tiene el límite de GET de 512 bytes, hacemos la petición asíncronamente (true)
        peticion.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;');
        peticion.send(datos); //'datos' contiene los campos variable=valor
                              //usar como 'valor' encodeURIComponent(campo.value) para aseguramos que la URI formada sea válida
    }
}

function procesacambios() { //procesamos los cambios de estado del objeto XMLHttpRequest 'peticion'
    //var respuesta = document.getElementById("respuesta"); //el objeto 'respuesta' se refiere al div 'respuesta' del código, el cual se usa para mostrar resultado de interacción
    var semaforo = document.getElementById("semaforo"); //el objeto 'semaforo' se refiere al div 'semaforo', indica la disponibilidad del servidor
    switch (peticion.readyState) { //comprobamos el estado de la petición
	  case 1:
	  		aparecer();
	  		break;
      case 4: //finalizada
        if (peticion.status == 200) { //si recibimos una respuesta HTML/1.1 OK
           //respuesta.innerHTML = peticion.responseText; //accedemos a la respuesta enviada a través de la propiedad responseText
       	//document.getElementById("procesando").style.display = 'none;' //Linea de prueba 
		setTimeout(desvanecer,1500);
	    SetContainerHTML(respuesta.id, peticion.responseText, true);
            //semaforo.innerHTML = "<span class='bajo'>&nbsp;Listo&nbsp;</span>";
        } else {semaforo.innerHTML = "<span class='alto'>&nbsp;Error XML&nbsp;</span>";} //o en caso negativo
      break;
      default: //no finalizada
        //semaforo.innerHTML = "<span class='medio'>&nbsp;Procesando...&nbsp;</span>";
    }
}

//Ejecucion de javascript llamado desde AJAX
function SetContainerHTML(id,html,processScripts)
{
mydiv = document.getElementById(id);
mydiv.innerHTML = html;
	if(processScripts!=false)
	{
	var elementos = mydiv.getElementsByTagName('script');
		for(i=0;i<elementos.length;i++) 
		{
			var elemento = elementos[ i ];
			nuevoScript = document.createElement('script');
			nuevoScript.text = elemento.innerHTML;
			nuevoScript.type = 'text/javascript';
			
			if(elemento.src!=null && elemento.src.length>0)
				nuevoScript.src = elemento.src;
				
			elemento.parentNode.replaceChild(nuevoScript,elemento);
		}
	}
}