No audio tag present in html

I have a hype document with audio that has been automatically started in the timeline. I am trying to mute the audio using a javascript in the parent container but I don’t see the tag when the page is served via a web server. I only see it when I open the page by double clicking on the html file.

I’m guessing because it’s using WebAudio API when being served from the server. So how do I do things like audio.muted = true through javascript?
I’m including a small sample I created: sample.zip (324.7 KB)

Hi Jyoten!

Attached is “Test_muted.hype”. I’ve adjusted your original set-up because I could not figure out how to do it as is (via a Timeline Action).

So instead of the Timeline firing the playing of the sound (which I’ve eliminated) I put that in a function named “audioSetup” - triggered by the “On Scene Load” handler. Sounds identical.

window.audio = new Audio('${resourcesFolderName}/music.mp3');
audio.play();

Note this is a global, should be able to call it from anywhere.

The mute function is called with “audioMuted”
audio.muted = true;
which in my example is triggered by clicking on the “Mute” button on the HTML page.

Test_muted.hype.zip (125.1 KB)

Hey Jim,

Thanks for answering. Yes, this works, however I have a ton of hype files that already have timeline action and I really don’t want to go through each one and manually update it, regenerate the html and upload it back to my server so I am looking for something that works via the timeline. If I can get to the audio context and source that are generated with the webaudio api that the timeline uses then I have an automated way to update the javascript I’m using, fix the audio and add a mute button to all the documents otherwise i’m stuck with the manual way. I’ll keep trying to see what else I can come up with but otherwise I can use this method you have given me.

hi jim,
hype does not provide any function within its Javascript API to control audios managed by its behaviours.
@Daniel This’d be a nice featurerequest :slight_smile:

well … as a result you won’t know if actually audiotag or web audio api is used to play the sound.

So best / easiest way would be to manage it yourself (like @JimScott mentioned ) or hope for some insight of the hypeteam :wink:

or: create another timeline which starts behaviour to stop audio. you can start / control this timeline from your parent container …

1 Like

as a hack:
WebAudio Api will start xmlHTTPrequest. so you can create a prototype for send and apply a callbackfunction.
this object will include responseURL which is the mp3-filepath ....

_send = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function() {

var callback = this.onreadystatechange;
this.onreadystatechange = function() {             
if (this.readyState == 4) {
console.log(this.responseURL)
}
callback.apply(this, arguments);
}
    _send.apply(this, arguments);
}
1 Like

I am assume this goes in a on load.

But did you actually get anything with it ? ( I am probably being thick here )

has to be inserted before load … head :slight_smile:
it’s not been my idea …

Thanks.

I tried both ways. Got errors in the Head.
I am sure it should work as I have seen some other examples suggesting this kind of thing.
oh well… sure someone will figure it out :slight_smile:

guess it been just over the top :wink:

_send = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function() {

this.onreadystatechange = function() {             
if (this.readyState == 4) {
console.log(this)
}
}
    _send.apply(this, arguments);
}

@h_classen, this will only tell us if there is an audio file being requested. There is still no way to get the audio context so no way to mute it correct?

this is right