// Document JavaScript

var objXML;
var indicador = false;

function CreaXHR()
{
	var ref = false;
	
	try
	  	{ // Procediment per a crear un objecte XMLHttpRequest compatible entre diversos
		ref = new ActiveXObject('Msxml2.XMLHTTP');
		}
	catch (e1) // navegadore Web
		{
		try {ref = 	new ActiveXObject('Microsoft.XMLHTTP');}
		catch (e2) {objXML = false;}
		}

	if (!ref && (typeof XMLHttpRequest != 'undefined' || window.XMLHttpRequest)) ref = new XMLHttpRequest();  
	return ref;
}

// Aquesta funció carregarà les pàgines
function llamarasincrono_repertori(lletra, numero, id_contenedor)
{
	var titol= new Array (
		"Cançons de nadal i cançons de bressol",
		"Cançons populars i tradicionals dels Paísos Catalans",
		"Temes de pel·lícules, gospel, negro spirituals i música del segle XX",
		"Música antiga, música religiosa, cançó d'autor fins al segle XIX",
		"Cançons populars d'arreu del món");
	var URL='repertori.php' + '?grup=' + lletra + '&titol=' + titol[numero -1];

	objXML = CreaXHR();
	objXML.onreadystatechange = function(){cargarpagina(objXML, id_contenedor)}
	objXML.open('GET', URL, true); // assignem els mètodes open y send
	objXML.send(null);
}

// tot és correcte i ha arribat el moment de posar la informació requerida
// en el seu lloc a la pàgina xhtml
function cargarpagina(objXML, id_contenedor)
{
	if (objXML.readyState == 4 && (objXML.status==200 || window.location.href.indexOf("http")==-1))
		{
			document.getElementById(id_contenedor).innerHTML = objXML.responseText;
			document.getElementsByTagName('body')[0].removeChild(indicador);
			indicador = false; // variables nul·les
		}
	else // si comencem a rebre resposta
		if(objXML.readyState == 3)
			{
				document.getElementById(id_contenedor).innerHTML = '';
	
				// Creem una secció dinàmica
				indicador = document.createElement('div');
				// y l'afegim al document
				document.getElementById(id_contenedor).appendChild(indicador);
			
				// Mostrem una indicació en forma de finestra flotant
				indicador.style.width = '200px';
				indicador.style.height= "50px";
				indicador.style.margin = '50px';
				indicador.style.backgroundColor = 'ffffcc';
				indicador.style.color = 'black';
				indicador.style.border = '1px solid #a51133';
				indicador.style.padding = '5px';
				indicador.innerHTML = '<p>Carregant la informació</p>';
			}

}