/**
 * @author fabi
 */
var httpArticulos = getAjax();
function listarArticulos()
{
	document.getElementById('contenido').innerHTML = '';
	var myURL2 = '../pagina/getArticulos.php?tema=' + this.id;
	if (httpArticulos)
	{    	
		if (httpArticulos.readyState == 4 || httpArticulos.readyState == 0) 
     	{    
       	// hace una petición al servidor para validar los datos extraídos
     	  	httpArticulos.open("GET",myURL2, true);        		
     		httpArticulos.onreadystatechange = respuestaAjaxArticulo;
     		httpArticulos.send(null);
     	}    
  	}
}

var articulo = null;
function respuestaAjaxArticulo()
{
	if (httpArticulos.readyState == 4 && httpArticulos.status == 200)
	{
		articulo = eval("(" + httpArticulos.responseText + ")");
		ponerArticulosConJson(articulo);
	}
}
function ponerArticulosConJson(datos)
{
	document.getElementById('tituloContenido').innerHTML = 'Listado de Artículos';
	document.getElementById('tituloContenido').className = 'tituloArticulos'; //le asgino la clase para dar estilo
	for (var i = 0 ; i < datos.id.length; i++)
	{	
		var caja = document.createElement('div');  // creo la caja que mostrara el articulo parcialmente
		caja.id = datos.id[i]; // coloco el id del articulo en la caja.
		caja.className = 'cajaArticulo'; // le asigno la clase para dar el estilo
		
		var titulo = document.createElement('h3'); titulo.className = 'tituloArticulo'; // creo y doy estilo a titulo
		var textoTitulo = document.createTextNode(datos.titulo[i]); // creo el texto del titulo
		titulo.appendChild(textoTitulo); // agregamos el texto al titulo
		
		var descripcion = document.createElement('h5'); descripcion.className = 'descripcion'; //creo y doy estilo a descripcion
		var textoDescripcion = document.createTextNode(datos.descripcion[i]); // asigno texto descriptivo
		descripcion.appendChild(textoDescripcion);		 					
		
		/* armamos el pie de articulo */					
		var pie = document.createElement('div');	pie.className = 'pieArticulo';
		
		var fecha = document.createElement('h5'); fecha.className = 'fecha';
		fecha.appendChild(document.createTextNode(datos.fecha[i]));
		
		var autor = document.createElement('h5');	autor.className = 'autor';
		autor.appendChild(document.createTextNode(datos.autor[i]));
		
		pie.appendChild(fecha); pie.appendChild(autor);
		/* fin de configuracion de  pie de articulo */
		var parrafo = document.createElement('p'); parrafo.className = 'texto';			
		parrafo.innerHTML = datos.contenido[i] + '...';
		
		caja.onclick = presentarArticulo;
		
		caja.appendChild(titulo);
		caja.appendChild(descripcion);
		caja.appendChild(parrafo);
		caja.appendChild(pie);
		document.getElementById('contenido').appendChild(caja);
	}
}

var idArticulo = null;
function presentarArticulo()
{
	document.getElementById('segundoTitulo').style.visibility = 'hidden'; // ocultamos el titulo de temas
	document.getElementById('panel2').style.visibility = 'hidden'; // ocultamos el panel2 de temas
	
	idArticulo = this.id;	
	document.getElementById('primerTitulo').innerHTML = 'Artículos';
	document.getElementById('lista1').innerHTML = ''; // borra la lista1 
	for (var i = 0; i < articulo.id.length; i++) 
	{   
	   	var p = document.createElement('p'); // creo el parrafo que sera agregado a la lista lateral
   		var li = document.createElement('li'); 
   		if (i == 0) 
   			li.className = 'primero';
   	
   		var myLink = document.createElement('h4'); // creamos el enlace de articulos
   		myLink.id = articulo.id[i]; // le asignamos el id al enlace
   		myLink.innerHTML = articulo.titulo[i];
		 
		myLink.onclick = presentarArticulo; // asignamos el evento al enlace
		myLink.onmouseover = efectoSeleccion; 
		myLink.onmouseout = efectoDeseleccion;
		
		if (idArticulo == myLink.id)
			document.getElementById('tituloContenido').innerHTML = articulo.titulo[i]; // Titulo del Articulo en contenido
			
		li.appendChild(myLink); // agregamos enlace al 'li'
		p.appendChild(li); // agrego li al parrafo
		document.getElementById('lista1').appendChild(p); // agregamos el parrafo a la lista
	}
	getContenido('../pagina/getContenidoArticulo.php'); // accedemos al contenido y lo mostramos
}

var peticionTEXT = getAjax();
function getContenido(url)
{
	var id = idArticulo; // id del articulo al cual accedimos en ese instante
	var paquete;
	if (peticionTEXT && id)
	{
    	id = encodeURIComponent(id); // encodeo el id para ser enviado por post
		paquete = 'id=' + id; // y lo asigno al paquete a enviar
	}
				
	if (peticionTEXT.readyState == 4 || peticionTEXT.readyState == 0) 
  	{    
  	  	peticionTEXT.open('POST',url, true);
		peticionTEXT.setRequestHeader("Content-Type","application/x-www-form-urlencoded");        		
  		peticionTEXT.onreadystatechange = respuestaAjaxTEXT;
  		peticionTEXT.send(paquete);
  	}
}

function respuestaAjaxTEXT()
{
	if (peticionTEXT.readyState == 4 && peticionTEXT.status == 200) 
	{
		document.getElementById('contenido').innerHTML = peticionTEXT.responseText; // asigno la respuesta al div contenido
   	}   
}