Reproductor multimedia JW 5.1

Jeroen Wijering está continuamente mejorando sus reproductores multimedia. Es por esto que tenemos que volver de nuevo a hablar de los mismos.
Porque siguen siendo los mejores.
A pesar de los problemas que puedan dar o de las opciones que no acaban de funcionar.



Vamos a explicar la última versión del reproductor, la 5.1, que reproduce tanto vídeo en formatos flv y mp4, como archivos de audio mp3. También vídeos de YouTube (aunque creo que no es una opción demasiado interesante pues el propio YouTube ya tiene su reproductor...)
Vamos a su web, ahora llamada longtail video:
http://www.longtailvideo.com/
Y pulsamos sobre el botón Download Now.
Llegaremos a una nueva página en la que veremos la siguiente imagen:



Por defecto están activadas las opciones:
- Mantenerme informado
- Descargar la opción Viral
Yo recomiendo desactivar esta última opción que lo que permite es, fundamentalmente, que se pueda compartir nuestro vídeo y embeberlo. Esta información la obtenemos colocando el ratón sobre el signo de interrogación:

Si desactivamos la opción, nos descargaremos un archivo mediaplayer.zip que, al descomprimirlo, contiene 6 archivos:
- El player.swf es el reproductor propiamente dicho
- El preview.jpg es la imagen que se ve antes de que el vídeo comience a rodar
- El readme.html es la página web con el vídeo de ejemplo y las explicaciones correspondientes para hacer funcionar todo
- El swfobject.js es un javascript que necesita ser subido al servidor en la misma carpeta
- El video.flv es el archivo de vídeo que se va a reproducir
- El yt.swf es otro archivo flash necesario para la reproducción de un vídeo de YouTube

Abrimos el archivo readme.html y tendremos que ver la página web con el vídeo de ejemplo reproduciéndose sin problemas.
Para ver el código que tenemos que colocar en la entrada de nuestra web o blog, pulsamos con el botón derecho del ratón sobre un punto vacío de la página y elegiremos "Ver código fuente". Allí nos encontraremos con el siguiente fragmento de código:

 
 <object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="400" height="315">
  <param name="movie" value="player.swf" />
  <param name="allowfullscreen" value="true" />
  <param name="allowscriptaccess" value="always" />

<param name="flashvars" value="file=video.flv&image=preview.jpg" />
  <embed
   type="application/x-shockwave-flash"
   id="player2"
   name="player2"
   src="player.swf" 
   width="400" 
   height="315"
   allowscriptaccess="always" 
   allowfullscreen="true"
   flashvars="file=video.flv&image=preview.jpg" 
  />
 </object>
 
 

He marcado con rojo las rutas de los archivos que tienen que ser comprobadas y en su caso modificadas.

Lo que tenemos que hacer es:

1.- Subir a nuestro servidor en una misma carpeta:

• El reproductor player.swf
• El archivo de vídeo, el video.flv
• El swfobject.js
• La imagen preview.jpg

2.- Realizar la entrada en el blog incluyendo el código en el que habremos cambiado la cadena player.swf (en los dos sitios) por la ruta absoluta (http://...) en la que se encuentre el reproductor una vez alojado.
3.- Como el archivo video.flv estará en la misma carpeta, no hará falta escribir la ruta absoluta.
4.- Lo que si que será, probablemente necesario, será sustituir la ruta relativa de la imagen preview.jpg por la ruta absoluta.
5.- Finalmente comprobar los tamaños width y height de nuesto vídeo (que tiene que ser también el tamaño en ancho y alto de la preview.jpg y modificarlo en el código del embebido (las dos veces).
Con esto el reproductor del vídeo debería de funcionar:



En la entrada anterior he empleado el reproductor Viral.
Puedes comprobar las diferencias y ver que el embebido no funciona...
Por esto recomiendo la descarga del reproductor sencillo.
Vídeo obtenido de la Agencia Atlas.

Ampliación ( 15/04/2010)

Efectivamente, si en lugar de colocar la ruta del vídeo flv, colocamos la ruta del archivo de audio mp3, el reproductor se reconvierte sin problema. Claro, las medidas de width y height hay que modificarlas. En este caso lo hemos puesto a 200 x 22 píxeles.


"Silbo del dale" de Miguel Hernández musicado y cantado por Joan Manuel Serrat

Probamos también la reproducción de un vídeo de YouTube. Simplemente, en file hemos puesto la URL del vídeo en Youtube. En este caso: http://www.youtube.com/watch?v=siOHh0uzcuY Hemos añadido también la imagen inicial. Para que se viera esta imagen previa, hemos tenido que colocar la URL absoluta.

Lástima que se pierdan los subtítulos que ayudan a entender lo que se está diciendo a los que nos cuesta esto del inglés...