Page 1 of 1
Embedding the Sono WebAudio library
Posted: Fri Mar 03, 2017 8:31 pm
by erion
Hello,
I'm currently trying to embed the Sono webAudio library (
https://github.com/Stinkstudios/sono), however I get a reference not found error in the web console, when running the application. The main sono object is not found.
Code: Select all
Procedure.i HeaderInclude(filename.s)
Protected filetype.s = GetExtensionPart(filename)
Select LCase(filetype)
Case "less"
!$('<link rel="stylesheet/less" type="text/css">').attr('href',v_filename).appendTo('head');
Case "css"
!$('<link rel="stylesheet" type="text/css">').attr('href',v_filename).appendTo('head');
Case "js"
!$('<script type="text/javascript"></script>').attr('src',v_filename).appendTo('head');
EndSelect
EndProcedure
OpenWindow(0,300,300,300,300,"")
HeaderInclude("sono.js")
EnableJS
var sono = window.sono;
sound = sono.createSound({
src: [
'dnb-loop.mp3'
],
loop: true
});
sound.play()
DisableJS
I've tried both sono and window.sono, but no luck, unfortunately. Any help is appreciated.
Erion
Re: Embedding the Sono WebAudio library
Posted: Fri Mar 03, 2017 10:39 pm
by Peter
this works for me:
Code: Select all
Procedure Main(sono)
! var sound = v_sono.createSound({ src: ['dnb-loop.mp3'], loop: true });
! sound.play();
EndProcedure
Procedure Init(Callback)
! require(["sono.js"],
! function(sono) {
! v_callback(sono);
! }
! );
EndProcedure
Init(@Main())
Greetings ... Peter
Re: Embedding the Sono WebAudio library
Posted: Fri Mar 03, 2017 11:22 pm
by erion
Hello Peter,
Thank you very much for your solution, it works like a charm here as well.
Your solution is interesting, because I thought Sono returns an object on the window. Here, however, as far as I can see, you used 'require', which is commonly used for Node packages.
Please excuse my inexperience with JS, but is there a way to pass this sono object to other functions? For example to create a SB wrapper module around Sono to create sounds, play/pause/stop, etc. That is to say, can I make this sono object available for other SB functions? (tried setting it as a value of a global variable, but the browser complained about an invalid reference, so this is probably not the right way.)
Once again, thank you very much for your help.
Erion
Re: Embedding the Sono WebAudio library
Posted: Sat Mar 04, 2017 1:01 am
by Peter
perhaps this is a starting point for you:
Code: Select all
DeclareModule Sono
Declare Init(Callback)
Declare CreateSound(Source.s)
Declare Play(Sound)
Declare Pause(Sound)
Declare SetVolume(Volume)
EndDeclareModule
Module Sono
EnableExplicit
Global SonoObject
Procedure Init(Callback)
! require(["sono.js"],
! function(sono) {
! v_sonoobject = sono
! v_callback();
! }
! );
EndProcedure
Procedure CreateSound(Source.s)
! return v_sonoobject.createSound({ src: [v_source], loop: true });
EndProcedure
Procedure Play(Sound)
! v_sound.play();
EndProcedure
Procedure Pause(Sound)
! v_sound.pause();
EndProcedure
Procedure SetVolume(Volume)
! v_sonoobject.volume = v_volume / 10;
EndProcedure
EndModule
; ----------------
; Demo:
EnableExplicit
Enumeration
#Window
EndEnumeration
Enumeration
#cmdPlay
#cmdPause
#trkVolume
EndEnumeration
Global Sound
Procedure cmdPlayEvent()
Sono::Play(Sound)
EndProcedure
Procedure cmdPauseEvent()
Sono::Pause(Sound)
EndProcedure
Procedure trkVolumeEvent()
Sono::SetVolume(GetGadgetState(#trkVolume))
EndProcedure
Procedure Main()
OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 230, 80, "Sono-Player", #PB_Window_ScreenCentered)
ButtonGadget(#cmdPlay, 10, 10, 100, 30, "Play")
ButtonGadget(#cmdPause, 120, 10, 100, 30, "Pause")
TrackBarGadget(#trkVolume, 10, 40, 210, 30, 0, 10)
SetGadgetState(#trkVolume, 10)
Sound = Sono::CreateSound("dnb-loop.mp3")
BindGadgetEvent(#cmdPlay, @cmdPlayEvent())
BindGadgetEvent(#cmdPause, @cmdPauseEvent())
BindGadgetEvent(#trkVolume, @trkVolumeEvent())
EndProcedure
Sono::Init(@Main())
Greetings ... Peter
Re: Embedding the Sono WebAudio library
Posted: Sat Mar 04, 2017 10:21 am
by erion
Peter,
You are wonderful, thank you very much!
For some reason, setting the sono object as a global variable's value does not work in 'main()', but your module works nicely. I will probably post the result in the Tips and Tricks forum.
Cheers,
Erion