Embedded audio on BBC website: how is it done?

Here’s the link to the website.

They have a “Play” button for each song. When one song’s play button is pressed, any other song playing is stopped and the new one starts (there are surely many sites with similar features, this is just an example)

I tried looking at the page source, but after a quick perusal I can’t figure out what they are using to get the desired effect.

Are they using Flash with a Javascript wrapper? Something else?

They are using Flash and JS, yes. It appears they’re feeding the buttons using XML too (scroll all the way to the end of the source).

I’ve used the Flash player described in this tutorial before and I am 90% sure that it stops all other music when a new button is pressed.

I think the BBC uses the RealNetworks Helix Media Server:

http://www.realnetworks.com/products-services/helix/media/server_proxy.aspx

The code on the BBC website shows the following:

Radio player code:


<script src="/radio/aod/radioplayer.js" type="text/javascript"></script>
<script type="text/javascript">
<!--//
function launchInMainWindow( url ) {
	opener.location=url;
	opener.focus();
}
//-->
</script>


and

Play button code:


  <div class="button_container">
		<a onclick="return false;" href="#" class="previewItem" id="button">
			<span class="loader"></span>
		</a>
	  </div>	  						
      <a href="/music/artists/ad279295-653f-42e1-9aaa-b731df2e78ba">		


So when the user clicks the Play button, it sends the song ID and url to the radioplayer.js, and starts to play the song. Your browser most likely has a pre-installed plugin to handle the audio format.