Windows Media Player: Advanced Scripting for Cross-Browser Functionality

  • Article

Updated November 2000

This article applies to Windows Media Player version 6.4 only.

Script commands provide a simple and powerful way to synchronize and control Web pages with Microsoft® Windows Media™ files and live streams. By using script commands with an embedded Microsoft Windows Media Player ActiveX® control and plug-in, you can create rich multimedia Web sites. This article shows you how to activate script command functionality in Web pages, with the following topics:

  • Understanding Script Commands
  • Embedding Windows Media Player
  • Adding the Event Handler Applet
  • Enabling the Plug-in to Receive Script Command Events
  • Capturing Script Command Events with the Plug-in
  • Capturing Script Command Events with the ActiveX Control
  • Cross-browser Samples
  • For More Information

Understanding Script Commands

A script command is a text object you can add to a Windows Media file or live stream that is associated with a particular time in the media. During playback, the script command is received and handled by Windows Media Player when that time occurs. Thus, script commands enable you to design synchronized events into your media and Web page. You can, for example, add a command that changes an image in a frame on your Web page in synchronization with dialog recorded in a Windows Media file. 

A script command object contains two strings: the Type string and the Parameter string. The Player uses the Type string to handle the Parameter. For example, if the Player receives a URL Type, it handles the Parameter string as a URL, which it passes to an end user's browser. With a TEXT Type, the Player handles the Parameter as a simple text string, which it displays in the Player caption window. For more information about script command types, see the Windows Media Player 7 Software Development Kit (SDK).

An embedded Windows Media Player generates script command events that can be handled by script in a Web page. Adding script command functionality to a Web page is a two-part process:

  1. Add commands to the media. You can use one of several encoding tools to add the commands to your digital media. When the tool encodes the file or live stream, the commands are encoded into the media. For more information about the authoring tools you can use to add commands, see Adding script commands to Windows Media files.
  2. Handle commands in a Web page. Script handles the script command event raised by the Player object. You add the event script, object elements, and cross-browser script that makes it possible for the command to be handled by either the ActiveX® control or plug-in.

The first step in adding script command handling to your Web page is embedding the Windows Media Player ActiveX control and plug-in, so that your page supports Microsoft Internet Explorer and Netscape Navigator.

Embedding Windows Media Player

The following script embeds Windows Media Player in your Web page, using an ActiveX control for Internet Explorer and a plug-in for Netscape Navigator.

Add the following code to your Web page between the BODY tags. Replace https://server/path/your-file.asx with the path to a Windows Media file or metafile on your local hard drive, the URL of a Windows Media metafile on a Web server, or the URL of a Windows Media file on a Windows Media Server. If a browser does not support ActiveX controls or plug-ins, a simple link is available to open the stream in a standalone Windows Media Player.

<OBJECT ID="MediaPlayer1" width=176 height=144 
   classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
   CODEBASE="https://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,715"
        standby="Loading Microsoft® Windows® Media Player components..." 
        type="application/x-oleobject">
  <PARAM NAME="AutoStart" VALUE="True">
  <PARAM NAME="FileName" VALUE="https://server/path/your-file.asx">
  <PARAM NAME="ShowControls" VALUE="False">
  <PARAM NAME="ShowStatusBar" VALUE="False">
  <EMBED type="application/x-mplayer2" 
   pluginspage="https://www.microsoft.com/Windows/MediaPlayer/"
   SRC="https://server/path/your-file.asx"
   name="MediaPlayer1"
   width=176
   height=144
   autostart=1
   showcontrols=0>
  </EMBED>
</OBJECT>  

<a HREF="https://servername/path/your-file.asx">
    Start the streaming media presentation in the stand-alone Player.</a>

Adding the Event Handler Applet

Add the following JavaScript code after the OBJECT tag. 

<script language="JavaScript">
<!--
    if ( navigator.appName == "Netscape" ) 
    {
        navigator.plugins.refresh();
        document.write("\x3C" + "applet MAYSCRIPT Code=NPDS.npDSEvtObsProxy.class" )
        document.writeln(" width=5 height=5 name=appObs\x3E \x3C/applet\x3E")
     }
//-->
</script>

If the browser is Netscape Navigator, the script refreshes the plug-in and loads the MAYSCRIPT applet, which monitors the plug-in for script commands. An event handler applet is not needed in Internet Explorer.

Enabling the Plug-in to Receive Script Command Events

Add the following simple JavaScript function. Internet Explorer needs no additional scripting.

<SCRIPT LANGUAGE="JavaScript">
function loader(){
   if ( navigator.appName == "Netscape" ) {
      var plugIn = document.MediaPlayer1;
      document.appObs.setByProxyDSScriptCommandObserver(plugIn,true);   
   }
}
</SCRIPT>

If the browser is Netscape Navigator, the MAYSCRIPT applet monitors the Windows Media Player plug-in for script command events.

This function must run when the Web page loads. To do this, add an OnLoad event for the loader function inside the BODY tag, as follows:

<BODY BGCOLOR="#ffffff" onload="loader()">

Capturing Script Command Events with the Plug-in

Your Web page is now ready to receive events from the Windows Media Player plug-in. You can also read header information (including author, title, and copyright) from your Windows Media file or metafile. The following script uses the OnDSScriptCommandEvt function to capture the two strings (through the bstrType and bstrParam parameters) sent by Windows Media Player when a script command is received in a Windows Media stream. The bstrType is the script command Type string, and bstrParam is the Parameter string. 

First, add script, such as the following, that defines the contentNav LAYER and contentIE DIV into which both the plug-in and control functions will write the command Param text: 

<LAYER id="contentNav" TOP=20 LEFT=190 WIDTH=240><NOLAYER>
<DIV id="contentIE" CLASS="content"></DIV></NOLAYER></LAYER>

Now, add the event function. If you want to write caption text to the screen, you can add a command to your Windows Media file with the Type string caption, and the Parameter string containing the text. Add a function, such as the following one, to your Web page:

function OnDSScriptCommandEvt (bstrType, bstrParam){
   if (bstrType.toLowerCase() == "caption") {
      var sCommand;
      
      sCommand = "document.contentNav.document.writeln(\"<SPAN ID=content>"
      sCommand = sCommand + bstrParam;
      sCommand = sCommand + "\");document.contentNav.document.close(); ";
      timerID = setTimeout(sCommand,0);
   }
}

The function is called when the Player plug-in receives a script command. If the script command Type is caption, a string (sCommand) is built that contains the script command Param text and scripting to write the text to the screen. The setTimeout function is used to pass the string to the plug-in. This is necessary because Netscape Navigator requires a new thread for functions called from the appObs proxy applet.

You can add as many if statements as you want for each bstrType. For example, you can have one script command that changes text, another command that changes an image on your Web page, and a third that changes the background color of the page.

Capturing Script Command Events with the ActiveX Control

The Windows Media Player ActiveX control used by Internet Explorer is already enabled to receive events in the stream, so you need no additional script. You can give the same name to the ActiveX control and the plug-in, because the browser only loads the one that is needed, based on the current browser.

The ActiveX control uses the ScriptCommand event to capture script command events, as shown in this example:

<SCRIPT FOR="MediaPlayer1" EVENT="ScriptCommand(bstrType, bstrParam)" LANGUAGE="Jscript">
   if (bstrType.toLowerCase() == "caption") {
      document.all.contentIE.innerHTML = bstrParam;
   } 
</SCRIPT>

You can also use Microsoft Visual Basic® Scripting Edition (VBScript), but keep in mind that many browsers cannot read VBScript. Be sure to separate this code from any other JavaScript on your pages by delimiting it within its own SCRIPT tags.

The if statement checks to make sure that the browser is Internet Explorer. If true, another if statement checks the bstrType string. If it is equal to caption, the text area is changed to bstrParam. As with OnDSScriptCommandEvt, you can add as many if statements as you want for each bstrType.

Understanding how this code works will be key to successfully creating advanced Web sites. You're welcome to cut and paste the script into your own Web pages. (Please note that these pages assume an understanding of scripting languages such as VBScript and JavaScript.) If you customize the code we've provided, be sure to test your changes thoroughly in both Internet Explorer and Netscape Navigator.

Cross-browser Samples

Several examples in the MSDN™ Online Samples area (for example, Cross-browser Embedding and Handling Events Cross-browser) were designed to work in both Internet Explorer and Netscape Navigator. These examples work in both browsers by using simple JavaScript functions.

Netscape Navigator does not support Dynamic HTML and VBScript, so samples that use these scripting languages will work only in Internet Explorer.

Netscape Navigator does not support ActiveX controls, so samples that use only controls will not work. On the other hand, both Internet Explorer and Netscape Navigator support plug-ins, so Web page scripting that uses events to control another plug-in will run in either browser.

For More Information

For additional information on cross-browser scripting, see the Windows Media Player Control SDK, which is part of the Windows Media SDK. The SDK can be downloaded from the Windows Media Web site.