Musical loop
Oct 22, 2021
Hello heroes,
I have a question. In my module, a music loop is played when the slide starts. To do that easyli, I've created an empty layer with the loop and I use triggers to play it as a loop. It works fine. My only concern is, when learners pause the animation using the pause button within the player, the slide stops but not the music loop. Is there a way to control that, in other words, is there any hidden variable I can use to pause the layer chronology if the playser pause button is clicked ?
Many thanks
Bruno
8 Replies
At first i thought... oh this is simple. Some variables and done. But not. Either im overseeing a really simple solution in Storyline or making my life myself troublesome and complex ;-)
Well nevertheless here is a partial solution.
It does stop the audio loop on the slidelayer.. Didnot succeed in restarting it after stopping it...
Well a step in the right direction maybe ;-)
Many thanks for your help and the time you spent on my problem :-) I'll have a closer look to your partial solution and maybe I'll find how to restart the loop.
Hello Math,
I used your code and your module to try to find a solution.
Since I don't know JavaScript at all, I added some triggers in the audio layer. It works almost well: when I click on Pause, the music loop stops and I can restart it by clicking on Play.
But there is still a problem if you click on the progress bar (the variables change), also if you click on the Replay button.
I think that, at this level, it is a question of adjustments to be made in the javascript. Maybe you can still help me?
Many thanks.
Bruno
And indeed its a small adjustment now in the Javascript to pause/resume the audio when clicking the play/pause button in the player.
If you check the code you notice i added an extra if/then statement. The play/pause button in Articulate Storyline uses the aria-pressed property to see whether its pressed or not. So checking for that value returns true or false.
As we already had the selector for that button
var playButton = document.getElementById('play-pause');
We can check the value of 'aria-pressed' like this:
playButton.ariaPressed
Its now only setting the appropriate variables and all works.
if(playButton.ariaPressed == true){
player.SetVar("isPaused", false);
player.SetVar("isPlayed", true);
}else{
player.SetVar("isPaused", true);
player.SetVar("isPlayed", false);
}
Adding the fixed story.PS. This opens more options...as i do think this way you can capture any state of the player controls. Audio volume and more...
Two brains worth better than one ;-)
I tested your content but I still have problems clicking on the "Replay" button on the player or moving the progress bar directly.
It seems the varaibles are totally lost ^^
Ah yes only fixed the play button ('play-pause'). To fix the code for the 'replay'-button and progress bar you need to find there 'html'-names in the console and then add that to the code.
Thanks for your help. I have a new question: Where I can find the "html" names(replay and progress) for adding to the code?
The browser console is your best friend. The id for the seekBar is 'seek', the id for the replayButton is 'reset'.
Basically this Storyline detects when clicking them. Not 100% functional because especially the replay button and seekbar have some specific functionality you would need to trigger. But another step to get anyone going.
Kind regards,
Math