Forum Discussion
Muting Audio in Timeline
There are multiple ways to detect an audio file name. For now, I’ll focus on one way.
Execute the following JavaScript global function when the timeline starts on this slide:window.muteAudio = function(filename) { var audioElements = document.querySelectorAll('audio'); audioElements.forEach(function(audio) { const audioFileName = audio.src.split('/').pop(); const audioFilePath = `story_content/${filename}`; if (audio.src.includes(audioFilePath)) { audio.muted = !audio.muted; } }); };- Publish your file to Web.
- Open the published folder and navigate to the story_content directory.
- Copy and paste the exact filename of the audio file you want to control.
Now, you can mute or unmute the specific audio file by executing JavaScript when the user clicks toggle button:
muteAudio('your-audio-file.mp3');
I don't believe an object has access to the volume property in the new API. Additionally, I don't think you can target an audio element as an object the way you've attempted.
If you want to mute just the theme music, one approach could be to have it play on a separate layer. This way, when the timeline starts on a slide, you can show the layer with the audio and manage its visibility as needed. Set the layer properties to "Resume saved state when revisited" to ensure it plays from where it left off.
On the slide with the object, you can create a mute button that toggles the visibility of the audio layer based on the mute button's state (for example, normal and selected). This will give you more control over "muting" the audio without affecting other audios on the slide.
I've attached a sample story file to demonstrate how this can be done. Try that before you consider tackling this problem with JavaScript.
Thanks for the suggestion Nedim. This isn't quite doing what I'm after. I would need the timeline on the layer to continue while it was was muted so that when it resumes, it's at the new spot on the timeline.
To see what I mean, use a shorter soundtrack (mine is 6.5 seconds) and set your button visibility for the same length of time. If you don't press the button at all, they'd both end at the same time.
But, if you do play with that button, I still want it to end at the same time. Not because the button turns it off before vanishing, but because it's reached the end of the soundtrack: like playing with the volume dial on a live radio show.
Try this JavaScript solution to manage audio on your slide. In the attached file, you’ll find two JavaScript triggers. One is executed when the user clicks a button, which contains a function muteAudio(1). The function will toggle the mute state of the audio you want to target. Depending on how many audio elements you have on the slide, the audio you want to toggle mute/unmute may be stored at index 0, 1, or 2. The second JavaScript trigger ensures that the "theme audio" will stop when the timeline of the slide ends. Specifically, the trigger will hide the theme audio once the first audio on the base layer reaches its end.
The first JavaScript function, muteAudio(index), is a global function that targets all audio elements on the slide. It isolates one based on the index you pass in, such as muteAudio(1). The function will mute or unmute the audio element at that particular index. If there are multiple audio elements on the slide, you can use this function to control the mute state of each one individually, depending on their position in the list (index 0, 1, or 2).
The trigger to hide the "theme audio" will be set to activate when the timeline reaches its end. This will ensure that the theme audio stops as soon as the first audio element on the base layer finishes playing.
I don't quite follow all the lines in your more complex javascript, but it looks like you're creating a global muteAudio function which I can call at whim.
I was able to figure out the index I needed.I feel confident I can tweak this so that it remembers the last setting when revisiting.