Comunicacion entre iframes

Juampi J. Parada · #1 (**permalink**) 19/11/2008, 22:08

Que tal
Basicamente tengo en una pagina 2 iframe, en el primero tengo una pagina que tiene una lista de canciones(lista1 , lista2...lista3) , en el segundo tengo otra pagina que tiene embebido un reproductor hecho en flash que carga las canciones apartir de un xml, lo que necesito hacer es :
Seleccionar una lista de temas del primer iframe y q se cargue en segundo(el reproductor)

Lo q tengo hecho hasta ahora es:

Pagina Principal

Código PHP:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
 
<script>  
 
</script>  
 
<head> 
<title>Documento sin t&iacute;tulo</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
</head> 
 
<body> 
 
<table width="679" border="0" cellpadding="0" cellspacing="0"> 
  <tr>  
    <td width="414" height="930" valign="top"> <iframe id="iframe1" WIDTH="600" height="430" SCROLLING="no" src="pagina1.php"></iframe> </td> 
    <td width="280" valign="top"> <iframe id="iframe2" WIDTH="280" height="430" SCROLLING="no" src="pagina2.php"></iframe>  </td> 
  </tr> 
</table> 
</body> 
</html>

Pagina1.php(iframe 1 de la pagina pricipal)

Código PHP:

  <html>  
<head>  
</head>  
<script>  
function cargar_iframe(pag){  
if (pag!=""){  
parent.document.getElementById('iframe2').src=pag+".php";  
}  
}  
</script> 
 
<body bgcolor="#999999"> 
  
<table width="491" border="0" cellpadding="0" cellspacing="0"> 
  <tr>  
    <td height="74" valign="top" bgcolor="#CCCCCC"> 
    <input type="button" onclick="cargar_iframe(pagina2)" value="Lista 1"></td> 
    <td valign="top" bgcolor="#CCCCCC"> 
    <input type="button" onclick="cargar_iframe(pagina2)" value="Lista 2"> 
<!-- los botones hacen lo mismo los 2 pero es solo de ejemplo--> 
 
</td> 
 
</table> 
</body>  
</html>

Pagina 2 (Iframe 2 de la pagina pricipal ,donde esta el reproductor)

Código PHP:

  <html>  
<head>  
</head> 
<body> 
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="260" height="410" > 
  <param name="movie" value="mp3player_demo.swf" /> 
  <param name="FlashVars" value="playlist=old/tracks.xml" /> 
  <param name="bgcolor" value="#eeeeee" /> 
  <embed src="mp3player_demo.swf" width="260" height="410" bgcolor="#eeeeee" FlashVars="playlist=tracks.xml" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> 
</object> 
<body> 
</html>

ACLARACION: la funcion javascript que tengo en pagina 1 me recarga el reproductor , lo que necesitaria hacer es poder cambiar el value de FlashVars ya que este es el que le indica a flash la lista de temas.

Código PHP:

  <param name="FlashVars" value="playlist=old/tracks.xml" />

Espero que se entienda

David · #2 (**permalink**) 19/11/2008, 22:43

Ya que estás trabajando con PHP puedes enviar un valor por GET que indique qué archivo .xml debe cargar (y con PHP imprimir eso en el FlashVars). Bueno, también puedes tomar el parámetro de la URL con Javascript e imprimir el repectivo elemento <object> . Aunque, no sé si te has dado cuenta pero estás pasando como parámetro pagina2 a la función cargar_iframe(), lo cual haría que se interprete como variable, pero al parecer es una cadena literal por lo que debería ir entre comillas simples ''.

P.S.: No es muy recomendable usar iframes, es mejor usar AJAX o el include() de PHP dependiendo del caso.

Juampi J. Parada · #3 (**permalink**) 21/11/2008, 06:47

Gracias david, tenes razon podia enviarla por get no me habia dado cuenta.
Como puedo hacer este mismo comportamiento pero todo con javascript, con iframes no me gusta como queda pero esta es la unica forma que encontre para que no se actualice el reproductor cuando navego por el sitio.

David · #4 (**permalink**) 21/11/2008, 06:57

Una idea quizás podría ser tener el reproductor en un contenedor <div> o lo que sea, y cada vez que quieres recargarlo, borrar todo el contenido del div (innerHTML = ''), y luego volver a cargar el <object> en el div ya con el respectivo video. No sé qué tan buena idea sea, pero puedes intentarlo.

Juampi J. Parada · #5 (**permalink**) 21/11/2008, 08:22

Gracias David
Y como hago para este div no se recargue cuando navego por el sitio?

David · #6 (**permalink**) 21/11/2008, 08:24

En ese caso no hay más remedio que usar iframes. A no ser que cargues todo el contenido del resto de la página con AJAX, pero... no sé, ¿para qué necesitas que sea de esa manera?.