A Streaming Media JukeBox: The JukeBox's Script

A Streaming Media JukeBox

The JukeBox's Script

Our streaming media jukebox is very similar to our audio jukebox from Column 21. We first define an array of object:

var streams = new Array();

Then we define the object constructor as:

function makeStream(url, name) {
  this.url = url;
  this.name = name;
}

Finally, we populate the array with several ASX and ASF files:

streams[0] = new makeStream("https://msdn.microsoft.com/downloads/samples/
 Internet/imedia/netshow/smedia/NS3/JavaScript/Buttons/control.asx",
 "Microsoft Promo for Windows Media Player");
  // (The three lines above should be joined as one line.
  // They have been split for formatting purposes.)
streams[1]=new makeStream(
 "https://www.advintsol.com/webmaster030399/webmaster.asx",
 "Microsoft Training for Windows Media Player");
  // (The three lines above should be joined as one line.
  // They have been split for formatting purposes.)
streams[2]=new makeStream(
 "mms://netshow.microsoft.com/ms/sbnasfs/wmt/turtle28.asf", "The Turtle");
  // (The two lines above should be joined as one line.
  // They have been split for formatting purposes.)
streams[3]=new makeStream("mms://netshow.microsoft.com/ms/sbnasfs/wmt/wmt.asf",
"Flying Windows Media Player logo");
  // (The two lines above should be joined as one line.
  // They have been split for formatting purposes.)

Once I know the number of elements in the array, I can dynamically write a drop-down list:

with (document) {
  writeln('<SELECT NAME="streams" onChange="change()">');
  for (var i = 0; i < streams.length; i++) {
    writeln('<OPTION VALUE="', streams[i].url, '">', streams[i].name);
  }
  writeln("</SELECT>");
}

The event handler kicks in whenever there is a change in the selection:

function change() {
  var list = document.playerCtrl.streams;
  var streamURL = list.options[list.selectedIndex].value;
  document.mediaPlayer.stop();
  document.mediaPlayer.fileName = streamURL;
}

We first extracts the URL of the currently selected item. We then call the Media Player's stop() method and then restart the new selection by assigning its URL to the Media Player's fileName property.

Produced by Yehuda Shiran and Tomer Shiran

Created: October 25, 1999
Revised: November 23, 1999

URL: https://www.webreference.com/js/column51/jukebox.html