var xhr = null; 

function getXhr(){
  if(window.XMLHttpRequest) // Firefox et autres
     xhr = new XMLHttpRequest(); 
  else if(window.ActiveXObject){ // Internet Explorer 
     try {
                xhr = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
  }
  else { // XMLHttpRequest non supporté par le navigateur 
     alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
     xhr = false; 
  } 
}

/**
* Méthode qui sera appelée lors d'un choix sur une select box de choix d'horaires
*/
function go(fName,fType){
	var tdHeader, tdContent;
	
	tdHeader = document.getElementById("tdreschoixannee"+fType+"header");

	if (tdHeader) {
	// Si on a trouvé tdHeader, c'est qu'on se trouve dans un cas où on a déjà une réponse d'horaire affiché
	// On va effacer les 2 tds et créer un td colspan = 2 vide
	  document.getElementById("trreschoixannee"+fType).removeChild(tdHeader); 
	
		tdContent = document.getElementById("tdreschoixannee"+fType);
	  document.getElementById("trreschoixannee"+fType).removeChild(tdContent); 
	
		tdContent = document.createElement('td'); 
		tdContent.setAttribute ('id','tdreschoixannee'+fType);
		tdContent.colSpan = 2;
	
		document.getElementById("trreschoixannee"+fType).appendChild(tdContent); 
	}
	
	getXhr();

  // On définit ce qu'on va faire quand on aura la réponse
  xhr.onreadystatechange = function(){
	
		// On va vider les td Header, si il existe, et le td Content (qui existe toujours) 		
		tdHeader = document.getElementById("tdreschoix"+fName+fType+'header');
		if (tdHeader) {
			document.getElementById("trreschoix"+fName+fType).removeChild(tdHeader);
		}
			
		tdContent = document.getElementById("tdreschoix"+fName+fType);
		if (tdContent) {
			document.getElementById("trreschoix"+fName+fType).removeChild(tdContent);
			
			// On crée un td spécifique qui informe que on est en attente de réponse du serveur
			tdContent = document.createElement('td'); 
			tdContent.setAttribute ('id','tdreschoix'+fName+fType);
			tdContent.colSpan = 2;
			tdContent.innerHTML = "--- attente de la réponse du serveur ---";

			document.getElementById("trreschoix"+fName+fType).appendChild(tdContent); 
		}

    // On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    if(xhr.readyState == 4 && xhr.status == 200){
			// On prend le premier td (qui est censé contenir le message d'attente)
			tdHeader = document.getElementById("tdreschoix"+fName+fType);

			// On se crée un td qui va contenir le résultat (une select box ou le fichier à télécharger)
			tdContent = document.createElement('td'); 
			tdContent.setAttribute ('id','tdreschoix'+fName+fType);
			// On se sert de innerHTML pour rajouter les options a la liste	
			tdContent.innerHTML = xhr.responseText;

			if (tdContent.innerHTML) {
			// Si on a reçu du contenu, on va afficher 2 tds (header + content)
			// en tenant compte des "ids"

				// On efface l'ancien header
			  document.getElementById("trreschoix"+fName+fType).removeChild(tdHeader); 
		
				// On se crée une td avec l'entête correspondant (Année: ou Horaire:)
				tdHeader = document.createElement('td'); 
				tdHeader.setAttribute ('id','tdreschoix'+fName+fType+'header');
				switch (fName) {
					case "programme": tdHeader.innerHTML = "Année:";
					break;
					case "annee": tdHeader.innerHTML = "Horaire:";
					break;
				}
				document.getElementById("trreschoix"+fName+fType).appendChild(tdHeader); 
				document.getElementById("trreschoix"+fName+fType).appendChild(tdContent); 
			}
			else {
			// On a choisi l'option "Choisissez"
			// L'id du td est du type "tdreschoix"+fName+fType
			// L'attribut Colspan vaut "2"
				tdHeader.innerHTML = "";
			}
    }
  }

  // Ici on va voir comment faire du post
  xhr.open("POST","/display_horaire.php",true);
	
  // ne pas oublier ça pour le post
  xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
  // ne pas oublier de poster les arguments
  sel = document.getElementById(fName + fType);
  type = sel.options[sel.selectedIndex].value;
	xhr.send(fName+"="+type+"&type="+fType);
}

