How to stop sounds after keypress using Javascript
Hi,
I want to conduct a reaction time task where participants have to respond to a sound. This sound should stop playing after keyboard response. I have already solved the problem adding an inline python scrip, following this discussion: https://forum.cogsci.nl/discussion/6429/is-it-possible-to-stop-sound-played-by-sampler-at-keypress
However, I need to perform the task online, so I need to use an inline_javascript. Is that possible? Does anyone know how to solve it?
Thanks a lot,
Carlotta
Comments
Hi Carlotta, I think your question fits better in the OSWeb forum. I'll move it there. Best, Kristian
Hi @carlotta,
There may be other options but the only way I know to achieve what you're after in Javascript requires that you handle sounds from Javascript instead of using the sampler object. Note that the method I'm describing below will only work when you run the task in the navigator.
instead of using sounds from the file pool, you'll need to load them up in memory from an external URL. that is, you'll need to host your sound files on a server. Furthermore, that server must support Cross-Origin Resource Sharing or CORS (otherwise your navigator will be denied access when trying to access the sound files). One option is for you to get an account on Github (free) and use it to store your sounds (you'll then need to use raw links to your sound files). If you have many heavy sound files, your task may become heavy in terms of memory management. Sound files in .ogg format take less room and maybe a better option than .wav files (note that with the method I'm describing below, you'd also be able to use .mp3 files which are not supported by the sampler object in Open Sesame).
Here's the basic method:
Sounds need to be loaded into memory from a URL. We do this with Javascript code in an
inline_javascriptobject.The code to load up a sound is:
vars.mysound = new Audio('https://www.bensound.com/bensound-music/bensound-moose.mp3')You'd have to replace the URL by the raw Github link where you're hosting your sound file. Note that this code must be place in the "Prepare" section of the
inline_javascriptobject.In the "Run" section, we play it with:
The sound will start playing while the task will move on to the next object.
To stop the sound, we execute the following Javascript code:
This will stop the sound.
In your task, you'd want to run this code when the subject response has been registered.
Hope fully this method can be adapted to your task.
You can download my basic example here:
Good luck!
Fabrice.
PS: Note that a memory leak was detected in OSWeb 1.4.4.0 (see https://forum.cogsci.nl/discussion/7623/memory-leaks-in-osweb-1-4-sketchpad-feedback-sampler). If you're using many trials and many sounds, my recommendation would be to update your OSWeb component to the latest prerelease package (https://forum.cogsci.nl/discussion/comment/25205/#Comment_25205)
I have a similar issue playing an audio file as a distraction during an online experiment. I could use the 'sampler' item and let the audio play in the background but I would like to be able to stop the audio distraction in between the practice & experiment loops. Otherwise when the experiment loop starts it plays over the existing audio from the 'practice' loop.
I used the javascript example earlier in this thread and uploaded a distraction audio file to a GitHub repository.
vars.mysound = new Audio('https://github.com/DBS-Lab/open-sesame/blob/583654469a0296b001295cb862b3432998e29e16/BabyGirlCrying.ogg')
But when I run it in a browser in Open Sesame there's no audio playing. The sample experiment above plays the audio correctly. Is there a privacy / access setting I might have to change on Github or an alternate url to store the audio that will work with the javascript code? I've attached my sample experiment...
Hi @MikeN,
The code works: the problem is that your sound is not accessible due to CORS restrictions or because the link is incorrect (if I try to access that link in my browser, I get a 404 message, which makes me think that your link is incorrect). The link you're using is not a raw Github link. If you can find the raw link to that sound file, I believe it would work (as far as I know, Github raw links due not have CORS restrictions).
You can see from the browser's console that your sound resource is not found (message 404):
If you replace your link by that I used in my example (https://www.bensound.com/bensound-music/bensound-moose.mp3), you'll see that your code works.
Hope this helps,
Fabrice.
Thanks @Fab
I finally cracked the raw url for the file on Github. Any web search I made on raw Github files suggested using a 'raw' button in the github UI but I couldn't find any button for the audio files I uploaded. If I hovered the mouse over the 'download' button for the audio file in the Github UI it gave a url which would work with the javascript. (if I downloaded the file the downloads folder also gave a url for the file which worked).
But I also had to switch the visibility of the repository for the files in Github to public . Once the repo had public visibility the url worked with the javascript code.
Hi @MikeN,
Good to hear that you solved the URL issue. indeed, the resource on Github must be public for the file to be accessible from outside Github.
Some further recommendations...
varsto make sure it is available throughout the task). To make the task run smoother, it is probably best to load up your sounds ahead of the loop running your trials, especially if you're using few sounds. However, if you are using a large set of sounds and occupies a lot of RAM, it might be best to load them into the variable in the prepare phase of each trial.Good luck!
Fabrice.