How do I create an audio player in HTML5 from an audio?

Question

i found a couple HTML5 audio examples:

jQuery plugin:
http://www.happyworm.com/jquery/jplayer/latest/demo-01.htm

This site uses the above jQuery plugin for a stream:
http://wfmu.org/html5/player.php

This one uses streams from scratch:
http://www.trygve-lie.com/blog/entry/html_5_audio_element_and

Another tutorial:
http://html5doctor.com/native-audio-in-the-browser/

As long as the stream has Ogg Vorbis source and MP3, it should be good.

How could I use JavaScript to create a channel-picker that would use a different source for the audio stream upon changing the channel?

Answer 1

You should be able to simply use jquery or regular javascript to remove the old tag from the dom, and create a new tag, set the source to the new mp3 file (from your track listing selector), and start it playing. i.e.

var audioElement = document.createElement('audio');
audioElement.setAttribute('src', 'loading.ogg');
audioElement.play();

Some pretty decent examples here