W3C home > Mailing lists > Public > whatwg@whatwg.org > March 2009

[whatwg] Synchronized play/seek of multiple <audio> elements?

From: Emil Tin <emil@koblo.com>
Date: Mon, 23 Mar 2009 15:39:27 +0100
Message-ID: <8E05E399-4C2D-4EC6-8AA8-3BDA217F4083@koblo.com>

i understand that SVG is meant for advanced timing etc.

but it would be very useful to have a simple mechanism in html/ 
javascript for playing sounds together. conceptually, sounds would be  
placed on a timeline at a certain time. the sounds on the timeline can  
then be played back together and will start at the right times.

forgive me if my understanding of html tags is lacking. but an idea  
would be to add two optional attributes to the audio tag:

timeline: the name of a group of audio tags that are syncronized
time: time this sound starts playing (in milliseconds). defaults to  
zero if omitted

example:

<audio src="pads.mp3" timeline="ambient" time="0" id="my_song" >
<audio src="cello.mp3" timeline="ambient" time="0">
<audio src="voice.mp3"  timeline="ambient" time="2000">
<audio src="bells.mp3"  timeline="ambient" time="5000">

playing each sound works as usual, you can start, stop rewind, seek  
etc on each sound like normal.

but you can also play the group together. this would cause pads and  
cello would start together. 2 seconds later, the voice would play, and  
at 5 sec, the bells would start. the group would be started from  
javascript using somthing like my_song.playgroup()?


the idea could be used for syncing to video too, in which case audio  
and video plays in sync when they're on the same timeline:

<video src="nature.mov" timeline="ambient" time="0" >
<audio src="pads.mp3" timeline="ambient" time="0" id="my_song" >
<audio src="cello.mp3" timeline="ambient" time="0">
<audio src="voice.mp3"  timeline="ambient" time="2000">



another idea would be to group the audio tags inside a timeline tag,  
but that might be a more complicated change?

<timeline id="ambient">
	<video .... time="0">
	<audio .... time="400">
	<audio .... time=" 1200">
</timeline


and then from javascript use: timeline.play();



kind regards,
emil tin





On 18/02/2009, at 11.20, Ian Hickson wrote:

> On Wed, 18 Feb 2009, Emil Tin wrote:
>>
>> However, I've been unable to find any information on how to trigger
>> several audio files in a synchronized manner.
>>
>> Does the html 5 specification provide any way to to this?
>
> Not currently.
>
> -- 
> Ian Hickson               U+1047E                ) 
> \._.,--....,'``.    fL
> http://ln.hixie.ch/       U+263A                /,   _.. \   _ 
> \  ;`._ ,.
> Things that are impossible just take longer.   `._.-(,_..'-- 
> (,_..'`-.;.'
Received on Monday, 23 March 2009 07:39:27 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Wednesday, 30 January 2013 18:47:49 GMT