Can a sound trigger a timeline?

1

Is there a way to start a timeline when a sound stops playing in hype?

The only way I can think of is to time the audio, create a js timer and use that to trigger the timeline. Due to variable load times I’m not sure how accurate that will be though. Just wondering if there’s a way to do it within hype.

Thanks for any help.

2

Have a look at Audio events. Hype itself does not have any UI or API that does this but with Javascript and you own Audio element in an Hype element you can listen for a events such as ended, playing etc. then fir code (Javascript )when the event fires.

https://www.w3schools.com/tags/ref_av_dom.asp

Maybe the ended event.

You will have to create your audio element using the Audio Tags in the innerHTML of an Hype Element.

There are plenty of example already on site of this, just look through the Audio section or do a search

2 Likes
3

If you can get the ID of the audio element, you can create a listener that runs ‘On Scene Load’ where you have the audio:

var audioelement = hypeDocument.getElementById('screechingbanshee');    
audioelement.onended = function(e) {
  /*Do things here!*/
};

This would require that you create your audio using an embedded <audio id="screechingbanshee ">...</audio> element.

2 Likes
4

Thanks Mark and Daniel, I’ll see what I can figure out.

5

Hi.
Howler.js is helping me with some of this, for example:

		window.M_F = new Howl({
		src: ['${resourcesFolderName}/MaleFemaleMix.m4a'],
});

	M_F.play();

			M_F.on('play', function(){
			hypeDocument.startTimelineNamed('Sing together', hypeDocument.kDirectionForward);
			});

Create the audio element, play the audio, and onplay trigger a timeline. It could be onend as well.
You have to have the howler.js in the head though.
Hope it helps.

3 Likes