tecnologia

Reproductor mp3

Para aligerar la carga del servidor donde tenemos alojado el sitio web se pueden utilizar servicios de almacenamiento en nube para guardar los archivos de música, imágenes, vídeo o documentos, los cuales son llamados desde la propia página web. Por ejemplo, utilizar Dropbox para tener los archivos mp3 de música y el reproductor, que se activa desde la misma página web.

Utilizar memoria Dropbox desde página web

Es posible liberar el servidor, donde tenemos alojado el sitio web, de la carga de fotografías, canciones, vídeos, reproductores y otros ficheros, utilizando memorias virtuales existentes en la red. Hay una variada oferta de servicios gratuitos de almacenamiento en la nube para guardar archivos de imágenes, música, texto o video, que se pueden utilizar gratuitamente.

Veamos cómo utilizar Dropbox para almacenar un reproductor mp3 y una lista de canciones que podemos llamar desde nuestro sitio web:

1. Abrir Dropbox (usuario y contraseña) y en la carpeta “pública” crear una subcarpeta que podemos llamar mp3 y dentro de ella crear subcarpetas para alojar los grupos de canciones (por tipo de música, autor, cd, etc.).

2. Descargar el reproductor Dewplayer. Descomprimir el fichero zip y subirlo a la carpeta mp3 que acabamos de crear.

3. Subir las canciones a las diferentes subcarpetas recien creadas en Dropbox.

…/mp3/clasica/tema1.mp3, tema2.mp3, tema3.mp3 …
…/mp3/jazz/tema1.mp3, tema2.mp3, tema3.mp3 …
…/mp3/boleros/ tema1.mp3, tema2.mp3, tema3.mp3 …

4. Configurar las listas de reproducción y subirlas a Dropbox. Con la descarga del reproductor hay un fichero denominado playlist.xml que hay que configurar para cada grupo de temas. A cada subdirectorio con su grupo de canciones subir su propio fichero playlist.xml. La edición se puede hacer con el “Bloc de notas” de Windows. Dentro del archivo existe una sección llamada TrackList donde hay que incluir tantos bloques de texto entre <track> … </track> como canciones a reproducir. Ejemplo de una playlist.xml:

<track>
<location>https://dl.dropboxusercontent.com/u/84371786/mp3/clasica/tema1.mp3</location>
<title>Tema1</title>
</track>

<track>
<location>https://dl.dropboxusercontent.com/u/84371786/mp3/clasica/tema2.mp3</location>
<title>Tema2</title>
</track>

Repetir <track> … </track> para cada tema del subdirectorio.

Las direcciones (urls) anteriores del campo <location> las proporciona Dropbox con la opción "Copiar enlace publico" del menú contextual a cada tema o canción.

5. El código HTML que hay que incluir en nuestra sitio web para llamar al reproductor Dewplayer se obtiene en la página web del reproductor Dewplayer (ofrece varias opciones). En este blog se puede ver una muestra del reproductor Dewplayer, lleva este código:

<object id="dewplayer" style="display: block; margin-left: auto; margin-right: auto;" data="https://dl.dropboxusercontent.com/u/84371786/mp3/dewplayer-playlist.swf" type="application/x-shockwave-flash" width="240" height="200" name="dewplayer">
<param name="wmode" value="transparent">
<param name="movie" value="https://dl.dropboxusercontent.com/u/84371786/mp3/dewplayer-playlist.swf">
<param name="flashvars" value="showtime=true&amp;autoreplay=true&amp;xml=https://dl.dropboxusercontent.com/u/84371786/mp3/Lidia/playlist.xml"></object>

Las direcciones (URLs) anteriores las proporciona Dropbox con la opción "Copiar enlace publico" del menú contextual pulsando con el botón derecho del ratón encima del fichero dewplayer y de cada fichero playlist.xml.

 


Web,s amigas