Reproducir audio desde nuestras aplicaciones web #Genexus

12:02 a.m. audio , audio.js , evolution , flash , Genexus , html5 , javascript , musica , notificaciones , pause , play , reproducir , sonido 2 Comentarios

En caso de que necesitemos reproducir audio desde Genexus, por ejemplo para avisar de una nueva notificación, podemos utilizar la librería audio.js la cual podremos descargar desde la siguiente pagina http://kolber.github.io/audiojs/

Una vez descargado el archivo audiojs.zip, lo descomprimimos:

Ahora copiamos la carpeta “audiojs” y la pegamos en la carpeta web de nuestro modelo:

Tambien copiamos a la carpeta de nuestro modelo el audio que deseamos reproducir:

En Genexus creamos un nuevo web panel:

En el web form agregamos un TextBlock con la propiedad Format: Raw HTML

En el evento Start escribimos el siguiente código:

En el evento Start cargamos la librería javascript que nos permitirá reproducir audio:

Event Start

form.JScriptSrc.Add( “audiojs/audio.min.js” )

form.HeaderRawHTML = ‘audiojs.events.ready(function(){var as = audiojs.createAll();});’

Do ‘PlayAudio’

Endevent

En la subrutina le asignamos al caption del TextBlock la etiqueta <audio> con el source del audio que deseamos reproducir. (autoplay nos permite reproducir en automatico el sonido al entrar a la pagina)

 Sub ‘PlayAudio’

TextBlock1.Caption = ‘<audio src=”Helium.ogg” autoplay></audio>’
EndSub

Ejecutamos la aplicación (F5):

En la página http://kolber.github.io/audiojs/, podemos encontrar varios ejemplos de cómo editar la apariencia del reproductor o como tener una lista de reproducción y mucho más, en caso de que necesitemos hacer algo más complejo.

Espero que les sirva de ayuda y lo compartan, saludos.