elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Los 10 CVE más críticos (peligrosos) de 2020


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Leer xml por javascript en Joomla		0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Leer xml por javascript en Joomla  (Leído 4,555 veces)
bettu


Desconectado Desconectado

Mensajes: 923


Ver Perfil
Leer xml por javascript en Joomla
« en: 27 Noviembre 2011, 22:55 pm »
Hola!

No tengo ni idea de páginas webs, he estado mirando por Internet y la verdad es que no entiendo nada. Me gustaría que me ayudarais sobre este tema. Vereis, tal y como dice el titulo quiero mostrar el contenido de varios xml en una pagina web hecha en Joomla con el editor JCE. Parece ser que podria ser posible con javascript, pero no entiendo ni fabaaa.

Estos archivos xml son los siguientes: AirPlayHistory.xml, AirPlayNext.xml y NowOnAir.xml. Los tres archivos me los genera automaticamente Jazler, lo único que quiero es mostrar estos archivos con la hora de emisión, nombre de artista y canción.

Adjunto el código que genera los tres archivos:

AirPlayHistory
Citar
<?xml version="1.0" encoding="utf-8"?>
 <Event status="happened">
  <Song title="Physical">
   <Artist name="Olivia Newton John" ID="338221">
   </Artist>
    <Info StartTime="21:44:11" JazlerID="4806" PlayListerID="" />
  </Song>
  <Song title="Be My Baby">
   <Artist name="Vanessa Paradis" ID="336452">
   </Artist>
    <Info StartTime="21:47:47" JazlerID="1007" PlayListerID="" />
  </Song>
  <Song title="Can't Fight The Moonlight ">
   <Artist name="Leann Rimes" ID="335842">
   </Artist>
    <Info StartTime="22:00:13" JazlerID="4624" PlayListerID="" />
  </Song>
  <Song title="I Love To Love">
   <Artist name="Tina Charles" ID="336728">
   </Artist>
    <Info StartTime="22:11:09" JazlerID="1611" PlayListerID="" />
  </Song>
  <Song title="Da Ya Think I'm Sexy">
   <Artist name="Rod Stewart" ID="336390">
   </Artist>
    <Info StartTime="22:25:06" JazlerID="1663" PlayListerID="" />
  </Song>
 </Event>

AirPlayNext
Citar
<?xml version="1.0" encoding="utf-8"?>
 <Event status="coming up">
  <Song title="Llàgrimes al Cel (Tears in Heaven)">
   <Artist name="Jofre Bardagí + La Puerta de los Sueños" >
   </Artist>
    <Info StartTime="22:47:53" JazlerID="3243"  />
  </Song>

  <Song title="Stand!">
   <Artist name="Sly + The Family Stone" >
   </Artist>
    <Info StartTime="22:52:20" JazlerID="2737"  />
  </Song>

  <Song title="Ruido">
   <Artist name="Despistaos" >
   </Artist>
    <Info StartTime="22:59:36" JazlerID="3846"  />
  </Song>

 </Event>

NowOnAir
Citar
<?xml version="1.0" encoding="utf-8"?>
<Schedule System="Jazler">
 <Event status="happening" startTime="22:44:06" eventType="song">
    <Announcement Display=""/>
  <Song title="Nadie">
   <Artist name="Malú">
   </Artist>
    <Jazler ID="2932"/>
    <PlayLister ID=""/>
    <Media runTime="00:03:37"/>
    <Expire Time="22:47:43"/>
  </Song>
 </Event>
</Schedule>

Gracias por leer! :D
En línea
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Leer xml por javascript en Joomla
« Respuesta #1 en: 29 Noviembre 2011, 00:27 am »
Cita de: bettu en 27 Noviembre 2011, 22:55 pm
No tengo ni idea de páginas webs, he estado mirando por Internet y la verdad es que no entiendo nada.

Necesitas tener una idea de lo que estas haciendo, te dejo un ejemplo, lo hice con jquery y lee el archivo AirPlayHistory.xml mostrando por pantalla las canciones con el autor.

Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<script src="http://code.jquery.com/jquery-latest.js"></script>
  5. 	<style type="text/css">
  6. 	p{
  7. 		background-color:#FFFBDB;
  8. 		padding:5px;
  9. 	}
  10. 	</style>
  11. 	<script type="text/javascript">
  12. 	$(document).ready(function(){
  13. 		/*  Busca el archivo AirPlayHistory.xml */
  14. 		$.ajax({
  15. 			type: "GET",
  16. 			url: "AirPlayHistory.xml",
  17. 			dataType: "xml",
  18. 			success: function(xml) {
  19. 				/*  Al encontrarlo buscar el tag <song> e ir repiendo el proceso hasta llegar al final del archivo(bucle) */
  20. 				$(xml).find('Song').each(function(){
  21. 					/*  Tomar los valores dentro de title */
  22. 					var tittle = $(this).attr('title');
  23. 					/*  Buscar el tag <artist> y repetir el bucle */
  24. 					$(this).find('Artist').each(function(){
  25. 						/*  Tomar los valores de name */
  26. 						var artist = $(this).attr('name');
  27. 						/*  Por ultimo mostrar dentro de div.cancion */
  28. 						$('.cancion').append( "<p>Song:"+tittle+"<br>Artist:"+artist+"</p>" );
  29. 					});
  30. 				});
  31. 			}
  32. 		});			
  33. 	});
  34. 	</script>
  35. </head>
  36. <body>
  37. 	<div class="cancion"></div>
  38. </body>
  39. </html>
  40.  

Si queres profundizar sobre el tema lee sobre HTML, CSS, javascript (JQUERY es una libreria de javascript, para agilizar un poco las cosas)
« Última modificación: 10 Diciembre 2011, 23:40 pm por EFEX » En línea
GITHUB 
bettu


Desconectado Desconectado

Mensajes: 923


Ver Perfil
Re: Leer xml por javascript en Joomla
« Respuesta #2 en: 4 Diciembre 2011, 14:56 pm »
Holaa!

Siento muchísimo el retraso en contestar, cuestiones de trabajo no me han permitido mirar el foro.

Bueno, primeramente muchisimas gracias por el codigo proporcionado, he estado jugando un poco para que me mostrara más información adicional (por ejemplo, la hora en que fue emitida la cancion), pero no sé porque pero ahora no me funciona. ¿Podrías decirme que es lo que hago mal?

Ahí va el código para AirPlayHistory y AirPlayNext (que en realidad son lo mismo):
Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<script src="http://code.jquery.com/jquery-latest.js"></script>
  5. 	<style type="text/css">
  6. 	p{
  7. 		background-color:#FFFBDB;
  8. 		padding:5px;
  9. 	}
  10. 	</style>
  11. 	<script type="text/javascript">
  12. 	$(document).ready(function(){
  13. 		/*  Busca el archivo AirPlayHistory.xml */
  14. 		$.ajax({
  15. 			type: "GET",
  16. 			url: "AirPlayHistory.xml",
  17. 			dataType: "xml",
  18. 			success: function(xml) {
  19. 				/*  Al encontrarlo buscar el tag <song> e ir repiendo el proceso hasta llegar al final del archivo(bucle) */
  20. 				$(xml).find('Song').each(function(){
  21. 					/*  Tomar los valores dentro de title */
  22. 					var title = $(this).attr('title');
  23. 					/*  Buscar el tag <artist> y repetir el bucle */
  24. 					$(this).find('Artist').each(function(){
  25. 						/*  Tomar los valores de name */
  26. 						var artist = $(this).attr('name');
  27. 					});
  28. 					$(this).find('Info').each(function(){
  29. 						var time = $(this).attr('StartTime');
  30. 						/*  Por ultimo mostrar dentro de div.cancion */
  31. 						$('.cancion').append("<p>"+time+": "+artist+" - "+title+"</p>");
  32. 					});
  33. 				});
  34. 			}
  35. 		});			
  36. 	});
  37. 	</script>
  38. </head>
  39. <body>
  40. 	<div class="cancion"></div>
  41. </body>
  42. </html>

Y aquí el código para NowOnAir (cosa que el xml cambia un poco...):
Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<script src="http://code.jquery.com/jquery-latest.js"></script>
  5. 	<style type="text/css">
  6. 	p{
  7. 		background-color:#FFFBDB;
  8. 		padding:5px;
  9. 	}
  10. 	</style>
  11. 	<script type="text/javascript">
  12. 	$(document).ready(function(){
  13. 		/*  Busca el archivo NowOnAir.xml */
  14. 		$.ajax({
  15. 			type: "GET",
  16. 			url: "NowOnAir.xml",
  17. 			dataType: "xml",
  18. 			success: function(xml) {
  19. 				/*Buscar el tag <Event> e ir repitiendo el proceso hasta el final (bucle) */
  20. 				$(xml).find('Event').each(function(){
  21. 					/*Tomar los valores de startTime*/
  22. 					var startTime = $(this).attr('startTime');
  23.  
  24. 					/*Buscar el tag <Song> y repetir bucle*/
  25. 					$(this).find('Song').each(function(){
  26. 					/*Tomar los valores de title*/
  27. 					var title = $(this).attr('title');
  28.  
  29. 					/*Buscar el tag <Artist> y repetir bucle*/
  30. 					$(this).find('Artist').each(function(){
  31. 					/*Tomar los valores de name*/
  32. 					var artist = $(this).attr('name');
  33.  
  34. 					/*Buscar el tag Expire y repetir bucle*/
  35. 					$(this).find('Expire').each(function(){
  36. 					var time = $(this).attr('Time');
  37. 					$('.cancion').append("<p>Inici: "+startTime+"<br>Artista: "+artist+"<br>Tema: "+title+"<br>Finalitza: "+time+"</p>");
  38. 					});
  39. 					});
  40. 					});
  41. 					});
  42. 				}
  43. 		});
  44. 	});
  45. 	</script>
  46. </head>
  47. <body>
  48. 	<div class="cancion"></div>
  49. </body>
  50. </html>


Gracias!!
En línea
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Leer xml por javascript en Joomla
« Respuesta #3 en: 4 Diciembre 2011, 19:23 pm »
Hola, el error fue mio por no pensado/incluirlo antes... el error es por que las variables que se declaron dentro de una funcion solo son accesible a esa funcion:

Citar
var v1; // Esta es una variable global
function funcion1(){
   var v2; // Esta variable es visible solamente dentro de la funcion funcion1()
   // v1 Podemos seguir utilizando esta variable
}
function funcion2(){
   var v3; // // Esta variable es visible solamente dentro de la funcion funcion2()
   // v1 Podemos seguir utilizando esta variable
   // v2 Esta variable ya no es accesible
   function funcion3(){
      var v4; // Esta variable es visible solamente dentro de la funcion funcion3()
      // v1 Podemos seguir utilizando esta variable
      // v2 Esta variable ya no es accesible
      // v3 Podemos seguir utilizando esta variable
   }
}

Por lo que hay que declarar una variable Global para que pueda ser accesido a todas las demas funciones, en el ejemplo de AirPlayHistory, quedaria asi:

Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<script src="http://code.jquery.com/jquery-latest.js"></script>
  5. 	<style type="text/css">
  6. 	p{
  7. 		background-color:#FFFBDB;
  8. 		padding:5px;
  9. 	}
  10. 	</style>
  11. 	<script type="text/javascript">
  12. 	$(document).ready(function(){
  13. 		// 	Defino my variable global
  14. 		var myObj = {}; 
  15. 		$.ajax({
  16. 			type: "GET",
  17. 			url: "AirPlayHistory.xml",
  18. 			dataType: "xml",
  19. 			success: function(xml) {
  20. 				$(xml).find('Song').each(function(){
  21. 					//  Definimos el atributo tittle
  22. 					myObj.tittle = $(this).attr('title');
  23. 					$(this).find('Artist').each(function(){
  24. 						//  Definimos el atributo artist
  25. 						myObj.artist = $(this).attr('name');
  26. 					});
  27. 					$(this).find('Info').each(function(){
  28. 						//  Definimos el atributo time
  29. 						myObj.time = $(this).attr('StartTime');
  30. 					});
  31. 					//  Por ultimo lo mostramos :)
  32. 					$('.cancion').append( "<p>Song:"+myObj.tittle+"<br>Artist:"+myObj.artist+"<br>Time:"+myObj.time+"</p>" );
  33. 				});
  34. 			}
  35. 		});			
  36. 	});
  37. 	</script>
  38. </head>
  39. <body>
  40. 	<div class="cancion"></div>
  41. </body>
  42. </html>
  43.  
En línea
GITHUB 
bettu


Desconectado Desconectado

Mensajes: 923


Ver Perfil
Re: Leer xml por javascript en Joomla
« Respuesta #4 en: 4 Diciembre 2011, 21:43 pm »
Fantástico! Esto si que funciona!  :-* :-* :-*

Para mostrar dicho contenido he realizado lo siguiente: dicho código se guarda en un nuevo fichero html (en total 3 para cada uno de los xml) y se sube al servidor FTP donde se encuentren los archivos generados por Jazler. Posteriormente, en Joomla se añade uno o varios módulos del tipo Marco (Wraper) para que Joomla muestre la información a través de un archivo externo/adicional.

Nuevamente, muchísimas gracias (ahora me encuentro con un pequeño problema a perfilar, pero esto lo tendré que realizar desde Jazler).

Un saludo  ;)
En línea
bettu


Desconectado Desconectado

Mensajes: 923


Ver Perfil
Re: Leer xml por javascript en Joomla
« Respuesta #5 en: 10 Diciembre 2011, 16:59 pm »
Hola de nuevo!

Bueno, simplemente quiero recalcar la solución a lo que comenté anteriormente (por si alguien se encuentra con el mismo problema y no sabe como solucionarlo).

Cita de: bettu en  4 Diciembre 2011, 21:43 pm
(ahora me encuentro con un pequeño problema a perfilar, pero esto lo tendré que realizar desde Jazler).

El problema basicamente consiste en que los xml no funcionan si encuentran algun caracter de habla hispana (acentos, dieresis y estas cosas...). Hay dos soluciones que se pueden realizar desde Jazler: la primera (y la más pesada), es eliminar cada acento/dieresis de toda la base de datos de canciones que hay en el programa. Obviamente, cuanto más grande es la base de datos, más latoso será el trabajo (en mi caso son 5500 canciones).

Bien, la segunda solución es la que muestro en la siguiente imagen:



En la columna de la izquierda se introducen los caracteres que se quieren reemplazar y a la derecha cómo quieres que se muestren. Por ejemplo, si alguna canción posee la letra Ñ, yo querré que me lo reemplace a N (no os confundais, aunque el reemplazo de caracter esté dentro de la sección de RDS, también afecta a los archivos AirPlayHistory, AirPlayNext y NowOnAir.xml).

Muchas gracias por todo!
« Última modificación: 10 Diciembre 2011, 17:01 pm por bettu » En línea
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
2 dudas: Leer info de OTRO ejecutable .exe ; leer accesos directos (LNK)
.NET (C#, VB.NET, ASP) 		raul338 8 7,774 Último mensaje 27 Agosto 2009, 01:33 am
por seba123neo
Leer archivos // Leer un dato en concreto
Programación C/C++ 		uhuru 3 3,548 Último mensaje 22 Mayo 2010, 14:14 pm
por uhuru
javascript/php - leer input, mostrar
Desarrollo Web 		Neibar 3 3,754 Último mensaje 14 Mayo 2012, 06:57 am
por engel lex
leer url con javascript
PHP 		diego_lp 1 1,753 Último mensaje 9 Junio 2012, 22:29 pm
por #!drvy
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines