Musical loop

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


8 Replies
Math Notermans

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 ;-)


Bruno Forêt Deleau

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.


Math Notermans

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:

Its now only setting the appropriate variables and all works. 

if(playButton.ariaPressed == true){
player.SetVar("isPaused", false);
player.SetVar("isPlayed", true);
player.SetVar("isPaused", true);
player.SetVar("isPlayed", false);

Adding the fixed story.
PS. This opens more i do think this way you can capture any state of the player controls. Audio volume and more...

Math Notermans

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,