Buzz. Una librería para manejar audio

Buzz es una pequeña librería de Javascript que fue pensada para poder controlar fácilmente las posibilidades que da la etiqueta AUDIO en los navegadores que las soportan.

Pese a su tamaño es muy poderosa porque permite ejecutar los archivos en distintos formatos de modo automático e incorpora una enorme variedad de funciones para controlar su ejecución; la documentación no es abundante pero se puede entender.

Como todas estas nuevas etiquetas, por ahora, nos vemos inmiscuidos en esa lucha de formatos soportados y no soportados, lo que hace que como usuarios, estemos limitados u obligados a, como mínimo, duplicar la información.

En este caso, el script soporta formatos AAC, MP3, OGG y WAV pero, no todos los navegadores soportan los cuatro y por lo tanto, no hay forma de tener un solo archivo de audio y que este se reproduzca siempre:

ACC	MP3	OGG	WAV

Igualmente, veamos cómo funciona.

Una vez alojado el script en un servidor y agregado antes de </head>:

<script type="text/javascript" src="URL_buzz.js"></script>

o copiado directamente en la plantilla:

<script type'text/javascript'>
//<![CDATA[
  ....... aquí colocamos el contenido del archivo buzz.js
//]]> 
</script>

Ya lo tenemos funcionando y listo para usar. Para eso, creamos objetos con JavaScript de varios modos:

var unaudio = new buzz.sound( "URL_archivo.ext");

donde unaudio es cualquier nombre que querramos usar y que identificará a ese archivo que es único, por ejemplo: musica.mp3.

var otroaudio = new buzz.sound( "URL_archivo", { formats: [ "ogg", "mp3" ] });

donde le agregamos los formatos disponibles y en ese caso, no ponemos la extensión del archivo ya que hay dos que tienen el mismo nombre con diferente extensión.

Los formatos aceptados son cuatro así que si dispusiéramos de cuatro archivos, pondríamos: { formats: [ "ogg", "mp3", "aac", "wav" ] }

Por defecto, los audios son pre-cargados y no se ejecutan de modo automático. Llegado el caso, esto puede cambiarse, modificando los parámetros correspondientes, tanto globalmente como para cada archivo en particular.

Todo se maneja con JavaScript así que es simple de usar; siempre, usamos el nombre definido al crear el objeto; esta son algunas de las funciones:

• nombre.play(); comienza a ejecutar el audio
• nombre.pause() pausa la ejecución
• nombre.stop() detiene la ejecución
• nombre.togglePlay() permuta entre play y pause
• nombre.isPaused() devuelve TRUE si se ha pausado
• nombre.isEnded() devuelve TRUE si ha terminado
• nombre.loop() lo ejecuta repetidamente
• nombre.unloop() detiee el loop
• nombre.mute() silencia el audio
• nombre.unmute() vuelve a escucharse
• nombre.toggleMute() permuta entre esos dos estados
• nombre.isMuted() devuelve TRUE si se ha silenciado
• nombre.setVolume(valor) establece el volumen (0 a 100, 80 por defecto)
• nombre.getVolume() devuelve el valor del volumen actual

Por ejemplo, si tenemos definido un audio:

<script>
  var ejemplo = new buzz.sound( "URL_archivo", { formats: [ "ogg", "mp3" ] });
</script>

Podemos usar enlaces de cualquier tipo para ejecutar algunas de esas funciones, sean estos texos o imágenes:

<a href="javascript:void(0);" onclick="ejemplo.play();"> PLAY </a>
<a href="javascript:void(0);" onclick="ejemplo.pause();"> PAUSE </a>
<a href="javascript:void(0);" onclick="ejemplo.stop();"> STOP </a>

<a href="javascript:void(0);" onclick="ejemplo.togglePlay();"> TOGGLE AUDIO </a>

nombre.play()nombre.pause()nombre.stop()

O bien podemos crear funciones de alguna clase, mezcándolas:

<script>
function togglesonido(obj) {
  obj.togglePlay();
  if (obj.isPaused()) {
    document.getElementById("mostrar").innerHTML = "pausado";
  } else {
    document.getElementById("mostrar").innerHTML = "playing";
  }
}
</script>

<a href="javascript:void(0);" onclick="togglesonido(ejemplo);"> FUNCION </a> <span id="mostrar"></span>

togglePlay

Obviamente, hay que tner en cuenta que si se utiliza la precarga de archivos, la demora podría lleagr a ser importante si es que agregamos demasiados o si estos son voluminosos.