El editor de audio web es nuevo en Firefox 32.
Con la API de Audio Web, los desarrolladores crean un contexto de audio. Dentro de ese contexto construyen un número de nodos de audio, incluyendo:
- nodos que proporcionan la fuente del audio, como un oscilador o una fuente de buffer de datos
- nodos que realizan transformaciones como delay y ganancia
- nodos que representan el destino del flujo de audio, como los altavoces
Cada nodo tiene cero o más propiedades AudioParam que configuran su operación. Por ejemplo, GainNode tiene solamente la propiedad gain, mientras que OscillatorNode tiene las propiedades frequency y detune.
El desarrollador conecta los nodos en un gráfico y ese gráfico completo define el comportamiento del flujo de audio.
El editor de audio web examina un contexto de audio construido en la página y proporciona una visualización de su gráfico. Esto da una vista de alto nivel de su operación y permite asegurar que todos los nodos están conectados de la forma esperada. Entonces se pueden examinar y editar las propiedades AudioParam para cada nodo del gráfico. Algunas propiedades no-AudioParam, como una propiedad OscillatorNode's type son mostradas y también se pueden editar.
Esta herramienta todavía es experimental. Si encuentra errores, nos encantaría que los informe en Bugzilla. Si tiene alguna opinión o sugerencias para nuevas funcionalidades, ffdevtools.uservoice.com o Twitter son lugares excelentes para registrarlas.
Abriendo el editor de audio web
El editor de audio web no está habilitado por defecto en Firefox 32. Para habilitarlo, abra la Configuración de herramientas de desarrollador y marque "Audio web". Ahora debería haber una pestaña extra en la Barra de herramientas llamada "Audio web". Haga clic en esa pestaña y cargue una página que construya un contexto de audio. Dos demos interesantes son:
- Voice-change-O-Matic, puede aplicar varios efectos a la entrada de micrófono y también muestra una visualización del resultado
- Violent Theremin, cambia el tono y el volumen de una onda sinusoidal al mover el puntero del mouse
Visualizando el gráfico
El editor de audio web ahora mostrará el gráfico del contexto de audio cargado. Aquí está el gráfico del demo de Violent Theremin:
Se puede ver que usa tres nodos: un OscillatorNode como fuente, un GainNode para controlar el volumen y un AudioDestinationNode como destino.
Inspeccionando y modificando AudioNodes
Si hace clic en un nodo, se restalta y aparece un inspector del nodo en el lado derecho. Ahí se listan los valores de las propiedades del nodo AudioParam. Por ejemplo, así se ve el OscillatorNode:
Con el demo de Violent Theremin, el parámetro frecuencia es modificado cuando el usuario mueve el mouse hacia la izquierda o la derecha y eso se puede ver reflejado en el inspector del nodo. Sin embargo, el valor no es actualizado en tiempo real: hay que hacer clic en el nodo nuevamente para ver el valor actualizado.
Si se hace clic en el valor en el inspector del nodo se puede modificar: presione Intro o Tab y el nuevo valor tiene efecto inmediatamente.