Java script for MUTE/UNMUTE audio in Storyline 3
Sep 08, 2017
Hello All,
Is it possible to MUTE/UNMUTE audio in Storyline 3 (HTML5 output)? I'm working on a course with a custom interface with a button that's supposed to mute/unmute - not pause/play or stop/play - the audio.
In the previous version of the storyline (Storyline 2), I am using javascript code to set the volume to 0 (mute audio) and set the volume to 0.8 (unmute audio). But now in storyline 3, the code was not working.
Please have a look on to the code which I used in Storyline 2:
"
Audio off button:
if (document.location.href.indexOf('html5') < 0) {
} else {
var player = GetPlayer();
Audio.setMasterVolume(0);
$('audio').prop('volume','0');
}
Audio on button :
if (document.location.href.indexOf('html5') < 0) {
} else {
var player = GetPlayer();
Audio.setMasterVolume(0.8);
$('audio').prop('volume','0.8');
}
"
It seems that in storyline 3 function is not working.
Has anyone an idea how audio is played in Storyline3? And how to mute/unmute audio like in Storyline 2?
Thanks
Akash
21 Replies
Code is accessing the Audio object. Does that object exist in the HTML5 published content? And is jquery library loaded to handle your selector calls? I'm guessing a few javascript errors are stopping things for starters
Hi Akash,
Did you find the solution for Mute/Unmute button in Storyline 3. If yes, can you please let us know.
Regards
S
for 360 and storyline 3 use this code to toggle the audio on and off:
var appState = require("helpers/appState");
appState.onToggleVolume();//mute
Vishal Agarwal
This post was removed by the author
Hi,
This is not working when open the new tab.(if i mute the audio than open the new tab in this case audio is not unmute)
Please suggest.😩
Hello all,
In storyline update 5 Audio mute/unmute JS code is not working for video.
We use below mention code for audio mute/unmute in SL3 and SL360.
var appState = require("helpers/appState");
appState.onToggleVolume();//mute/unmute
Any alternative solution for this?
Thanks
Akash
Hi Akash,
Use below code with condition this will work:
if (document.location.href.indexOf('html5') < 0) {
var player = GetPlayer();
player.SetVar("muteToggle",true);
} else {
var appState = require("helpers/appState");
appState.onToggleVolume();//mute
}
I am using this in my current course and this is working with me.
Hello Vishal,
Is there a way perhaps to visually show the learner when mute is on or off? Perhaps an icon in a green colour for on and red for off?
Many thanks
Nicole
Hi Nicole,
You can create a toggle mute/unmute button and give on that button.
It works.
Can this code be used as is to toggle the audio mute/unmute?
if (document.location.href.indexOf('html5') < 0) {
var player = GetPlayer();
player.SetVar("muteToggle",true);
} else {
var appState = require("helpers/appState");
appState.onToggleVolume();//mute
}
Hi Christina,
Please use this code for audio mute & unmute in articulate storyline 3 & 360.
Mute:
var appState = require("helpers/appState");
appState.onVolumeChanged(0);
Unmute:
var appState = require("helpers/appState");
appState.onVolumeChanged(0.8);
Hello all,
A month ago I updated storyline 360 and JavaScript no longer works for audio mute/unmute.
Published output works fine before the update, but those same courses after the update do not work properly.
Do anyone have solution for this?
Hi Akash,
Are you using jQuery with your JavaScript? To improve security for our customers, we removed jQuery from Storyline 360. You can still use it to write custom JavaScript. You'll just need to reference the jQuery library directly. Hope this helps!
Hi Akash, here is the solution you are looking for. Try following code to mute/unmute audio.
//To mute audio add following Code
//To unmute audio add following Code
Thanks a lot, Sheetal! I have used Vishal's code, but now it doesn't work anymore. Your solution came just in time!!
Hi Sheetal, thanks a lot for your code, works like a charm it really does the job. I only have one mute/unmute button so I made a little change, now it works with the same button.
var appState = window.DS ? DS.appState : require("helpers/appState");
if (appState.onToggleVolume === 0){
appState.onToggleVolume(1);
}
else{
appState.onToggleVolume(0);
}
That's awesome. I was looking for this feature and the code works perfectly. Thanks guys.
I can't seem to get this to work. is it browser specific or something?
Hi Sheetal, thanks for the above script. Its working fine for me too; but my problem is:
Can you please help me on this one. Or anyone in the community, please give your suggestion.
Love it! Thanks Sheetal!
Amazing! Thank you Sheetal.
I wanted to add the option to learners so that I can get rid of the Player controls and gain that space on the page.
Trying to replace each function on the Player one by one and mute/unmute (although everyone have the option on their computers), seems an important one that I, as a user, appreciate when I have.
I first created a toggle action on the mute button and then added the conditions separately for mute/ unmute with the provided codes.
Also, I made states for the button so that it changes icon for mute unmute and put all the triggers on the slide master. Have tested and it works perfectly weather I'm playing audio or video in any give slide!
Whoop whoop!
Hi Sheetal,
This code works fine when we launch the course. but when we mute the audio and resume the course the code was not working.