March 3, 1999
The Microsoft® Windows® Media Player is a versatile tool for presenting local and streaming multimedia files. It supports nearly all of the major media file formats, including Windows media files (.avi and .asf files), RealNetworks streaming media (.ram files), Motion Pictures Experts Group formats (.mpg and .mpe files), and audio formats such as MP3, MIDI, WAV, AIFF, and Compact Disc. Recognizing the importance of multimedia to Web content, Microsoft created the Windows Media Player control. This technology enables the Windows Media Player to exist as a Microsoft ActiveX® control inside a Web page along with other content.
Microsoft has continued to enhance the Windows Media Player to include playback of more media formats. The most recent version of the player can play digital video discs (DVD). If you have a DVD player on your computer, the Windows Media Player can show movies on your monitor, either in a desktop window or using the full display area. Microsoft has also added Web scripting support for DVD players to the Windows Media Player control. This gives you full control of DVD playback from an HTML file using scripting languages such as Microsoft Visual Basic® Scripting Edition (VBScript) or Microsoft JScript®. With this capability you can present DVD movies along with HTML content and graphics, creating custom presentations based on DVD events or user interaction.
With Microsoft Internet Explorer 5, you can place the Windows Media Player control in HTML application files to create custom multimedia presentations in HTML. Because all the functionality of the Windows Media Player is now exposed to Web scripting languages, you build a custom user interface (often called a faceplate) to the Windows Media Player control by using dynamic HTML (DHTML). You can tailor a faceplate to the design of your Web page or to the media that you present. The faceplate can also display information from a playlist, such as artist, track title, and copyright information, as well as links to relevant Web sites or online stores.
This article discusses some of the ways you can use the Windows Media Player to add multimedia content to your Web pages and HTML applications.
This article contains the following sections.
The OBJECT tag is used to embed ActiveX objects into a Web page. The following example shows how to use the OBJECT tag to insert the Windows Media Player control.
<OBJECT ID="MediaPlayer" CLASSID="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" TYPE="application/x-oleobject" WIDTH="320" HEIGHT="240" STYLE="position:absolute; left:50px; top:50px;" > <PARAM NAME="FileName" VALUE="http://example.microsoft.com/media/sample.asf"> <PARAM NAME="ShowControls" VALUE="1"> <PARAM NAME="ShowStatusBar" VALUE="1"> <PARAM NAME="ShowDisplay" VALUE="1"> </OBJECT>
The ID attribute of the OBJECT tag specifies a name for the Windows Media Player object, for later scripting control. The CLASSID attribute is required for Internet Explorer to create the object on the page, and should always be the string listed in the preceding example. The CODEBASE attribute contains a Uniform Resource Locator (URL) pointing to a location where the Windows Media Player control can be downloaded if it is unavailable on a user's system. The TYPE attribute indicates to the browser that the type of embedded OBJECT is an ActiveX object. The WIDTH and HEIGHT parameters set the size of the window used for the Windows Media Player object. The STYLE parameters enable you to position the object window anywhere on the Web page.
The PARAM tags have two attributes: The first is the name of the property being set, and the second specifies the value of that property. The PARAM tags initialize the Windows Media Player object with specified data when it is created. In this example, the first PARAM tag sets the FileName property to the URL http://example.microsoft.com/media/sample.asf, defining which file the Windows Media Player will play. The value could also be a path to a local media file, such as C:\sample.asf. The remaining PARAM tags specify that the playback controls, status bar, and display panel should all be visible for this object. Any of these elements could be hidden instead, enabling you to customize the appearance of the Windows Media Player object and user controls.
After you have created the object and specified a file name, you should see the Windows Media Player on your Web page. For more information about other parameters you can set for this object, consult the Windows Media Player control documentation.
DVD represents the next generation in optical disc storage technology for video and audio computer data. Essentially, a DVD is a compact disc (CD) that provides increased storage capacity, faster data access, and superior playback quality. A DVD holds 4.7 gigabytes (GB) of data per layer, and each side can hold two layers of information. This enables a single DVD to hold up to 17 GB of audio, video, and other types of data, which is enough storage for a movie more than two hours long. A CD-ROM of the same physical size holds 600 megabytes (MB) of data.
DVD aims to provide a unified solution for home entertainment, business, computer storage, and computer multimedia with a single digital format. Eventually, DVD aims to replace audio CD, videotape, laser disc, and CD-ROM technologies. Currently, DVD has widespread support from all major electronic companies, all major computer hardware companies, and about half of all major movie and music studios. Thus, DVD technology has an excellent opportunity to revolutionize the distribution of media.
This section contains the following topics.
The Windows Media Player control enables you to embed DVD playback windows in Web pages. It offers full script control of such DVD features as multilingual support, menu options, chapter searching, and switching among multiple camera angles. A DVD playback window is created just like the Windows Media Player object in the preceding example, but with different startup parameters:
<OBJECT ID="MediaPlayer" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="652" HEIGHT="382" > <PARAM NAME="AutoStart" VALUE="0"> <PARAM NAME="Filename" VALUE="DVD:"> </OBJECT>
In this example, the first PARAM tag sets the AutoStart property to false, and the second PARAM tag sets the value of the FileName property to DVD:. It is important to note that DVD playback is triggered by setting the FileName property to DVD:, which instructs the Windows Media Player control to search for the DVD drive on your local system. If the AutoStart property is set to true, the Windows Media Player control will begin DVD playback when the object is created. Otherwise, an event must start the DVD playback, such as the user selecting a button.
The Windows Media Player control supports a number of properties and methods that allow full control over DVD playback using Web scripting languages. The Windows Media Player also generates a special set of DVD-related events, to which a script can respond with DVD actions or changes in the Web page.
DVD properties enable you to retrieve or set various DVD elements, such as audio streams, a subpicture stream, and video angles. They also enable you to determine the current DVD title or chapter, the total or chapter playback time, and the number of frames per second the Windows Media Player is displaying in the viewing window. Some of these properties can be changed by the scripts, so that users can select which chapter or camera angle they would like to see.
The DVD methods perform specific playback actions on the Windows Media Player, such as Play, Stop, ForwardScan and ChapterPlay. Some methods return information about the DVD that is being played, such as GetNumberOfChapters and GetAudioLanguage. The Windows Media Player control supports all basic DVD actions through script, and many advanced actions.
As the DVD plays, it generates events which in turn can invoke Web scripts. For example, the EC_DVD_CHAPTER_START event occurs when the DVD starts playing a new chapter. A script might respond to this event by displaying the chapter number or starting a timer display on the page. Other events occur when the audio stream changes (EC_DVD_AUDIO_STREAM_CHANGE), the title changes (EC_DVD_TITLE_CHANGE), or playback stops (EC_DVD_PLAYBACK_STOPPED).
For more information on DVD scripting capabilities and DVD sample pages, see the Windows Media Player control documentation.
The user interface elements built in to the Windows Media Player (such as the buttons and the display panel) are available for use on any Web page, but they can be completely disabled and replaced with graphical buttons and scripts that you create. For complete control over the look and feel of the object, you can install the Windows Media Player control as an HTML Application (HTA). This technology is introduced in Microsoft Internet Explorer 5 and gives you control over the browser window that displays the faceplate.
Creating faceplates for the Windows Media Player control requires some basic knowledge of Web scripting and DHTML. The more you know about each, the more interactive and impressive your faceplate can be. This section provides the background information you need to start creating faceplates and introduce the basics of writing scripts that access the Windows Media Player control.
This section contains the following topics.
The release of Microsoft Internet Explorer 5 introduces the HTML Application (HTA), a new file type for the Microsoft Windows platform. The file name extension for HTA files is .hta. They use standard HTML formatting tags to display content and graphics, and enable user interaction through scripting. Although HTA files look much like standard HTML files, they incorporate the new HTA:APPLICATION tag to specify properties of the HTML application and the browser window. By setting browser window properties, the window can appear to users as a standard Windows application.
A faceplate is an HTA file with an embedded Windows Media Player object. Because HTA files use standard HTML tags and the player object is controlled through scripts, a faceplate is much easier to create than a stand-alone Windows application.
The procedure for placing a Windows Media Player control in a faceplate is the same used for an HTML file. First, place an OBJECT tag in the HTA file. The OBJECT tag can be placed by itself or inside a TABLE, DIV, or SPAN tag. The following example creates a basic Windows Media Player object.
<HTML> <HEAD> <SCRIPT> window.resizeTo(330,448); </SCRIPT> <TITLE>Windows Media Player Faceplate</TITLE> <HTA:APPLICATION CAPTION="true" MAXIMIZEBUTTON="no" > </HEAD> <BODY SCROLL="no"> <CENTER>A Simple Faceplate</CENTER> <OBJECT ID="MediaPlayer" CLASSID="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" TYPE="application/x-oleobject" WIDTH="320" HEIGHT="370" STYLE="position:absolute; left:0px; top:50px;" > <PARAM NAME="FileName" VALUE="http://example.microsoft.com/media/sample.asf"> <PARAM NAME="AutoStart" VALUE="0"> <PARAM NAME="ShowControls" VALUE="0"> <PARAM NAME="ShowStatusBar" VALUE="0"> <PARAM NAME="ShowDisplay" VALUE="0"> </OBJECT> </BODY> </HTML>
The one-line script within the SCRIPT tags resizes the window to the dimensions of the Windows Media Player and title area. This step is necessary because otherwise the window dimensions would use whatever default values were defined previously for Microsoft Internet Explorer, which probably are not the desired dimensions.
The HTA:APPLICATION tag is used only with the HTA file type, and must appear within the HEAD tag of any HTA file. With this tag you can specify properties of the HTML application and the browser window it shows to users. In the example above, setting the CAPTION attribute to true enables the top menu bar, so that users can reposition and close the browser window. Setting the MAXIMIZEBUTTON attribute to no disables the Maximize button on the menu bar. This prevents users from filling their entire screen with the much smaller faceplate. There is a Minimize button on the menu bar by default; it can be disabled by setting the MINIMIZEBUTTON attribute to no.
The remainder of the file displays the faceplate title and positions the Windows Media Player control in the page. Setting the SCROLL parameter of the BODY tag to no eliminates the scroll bars from the page, which maximizes the usable area of the faceplate. The faceplate title is simply HTML text centered at the top of the page. The OBJECT tag creates the Windows Media Player control with all standard interface controls enabled. The STYLE attribute provides precise positioning of the Windows Media Player object on the page.
The user interface for a faceplate is a Web page written in dynamic HTML (DHTML). The page should be designed to generate events which trigger certain scripts contained in the page. These scripts in turn control playback and the presentation of any information specific to the media file. Because DHTML allows you to change the text and graphics of a Web page after it has loaded, you can change the appearance of the faceplate as the Windows Media Player performs different tasks. Because the faceplate is a Web page, it can also contain hyperlinks to informational and storefront Web sites, and these links can change with each media file that is played.
To make a good faceplate, you need some knowledge of DHTML and Cascading Style Sheets (CSS). MSDN Online has excellent reference material on both of these topics. You will also need some good graphical editing tools, because faceplates can use images for both interface elements and pictures related to the media. With these tools in hand, constructing a faceplate requires the same skills and tools as constructing a Web page. You need only add scripts that control the Windows Media Player and change the faceplate graphics based on user interaction.
Faceplates are possible because all the functionality of the Windows Media Player is exposed to Web scripting languages. Anything you can do with the stand-alone Windows Media Player application, such as pushing the play button, a corresponding script command can replicate. Scripts can also retrieve information from the Windows Media Player control. Combined, these features enable scripts to make changes in the dynamic HTML (DHTML) graphics that correspond to changes in the operational state of the Windows Media Player.
When you open the Windows Media Player as a stand-alone application, you are presented with a video display window and standard control buttons that mimic the functions of most VCRs and compact disc players. These basic playback operations are controlled by the following script commands.
Operation | Method |
---|---|
Play | MediaPlayer.Play(); |
Pause | MediaPlayer.Pause(); |
Stop | MediaPlayer.Stop(); |
Previous Track | MediaPlayer.Previous(); |
Fast Reverse | MediaPlayer.FastReverse(); |
Fast Forward | MediaPlayer.FastForward(); |
Next Track | MediaPlayer.Next(); |
The Windows Media Player control stores information about its current activity and the files it can play. Most information is stored as the value of an object property, which scripts can retrieve, although some information is accessed as the return value of a script method. There are a number of properties such as PlayState, CurrentPosition, FileName, and Duration that you can read from the Windows Media Player and use in scripts for text display and operation control.
While it is playing media files, the Windows Media Player generates events, which can be handled by scripts. Even handling is useful for resetting control button graphics when a media file finishes playing, or displaying new clip information when a new media file begins playing.
The last requirement for a faceplate is a collection of media files to play. The playback of these files is organized in an Advanced Streaming Redirector File (called an ASX file, because the file name extension is .asx). An ASX file is a plain-text file which uses Extensible Markup Language (XML) tags to identify the media associated with each clip. These files not only specify the playback order of media files, but also contain information and related links for each file.
While a file is playing, your script can retrieve information specified in the ASX file for display on the faceplate. An ASX file may contain AUTHOR, COPYRIGHT, and TITLE tags, and other information for the current clip or show. An ASX file can store additional information about the show and each clip in PARAM tags for each media file entry. The names and information contained in PARAM tags are determined entirely by the creator of the ASX file, and can be used with custom scripts for any purpose.
This sample ASX file below shows the use of PARAM tags within ASX entries.
<ASX VERSION="3.0"> <TITLE>Example Media Player Show</TITLE> <PARAM NAME="Director" VALUE="Jane D." /> <ENTRY> <TITLE>Example Clip</TITLE> <AUTHOR>Clip Author</AUTHOR> <COPYRIGHT>(c)1999, Microsoft</COPYRIGHT> <REF HREF="http://samples.microsoft.com/media.asf" /> <PARAM NAME="Release Date" VALUE="March 1998" /> </ENTRY> <ENTRY> <TITLE>Another Clip</TITLE> <AUTHOR>Another Author</AUTHOR> <COPYRIGHT>(c)1999, Microsoft</COPYRIGHT> <REF HREF="http://samples.microsoft.com/more_media.asf" /> <PARAM NAME="Release Date" VALUE="December 1996" /> </ENTRY> </ASX>
Information in standard ASX tags such as TITLE, COPYRIGHT, and AUTHOR are accessible only while the track is playing. Calling the GetMediaInfoString method will retrieve the information contained in an ASX tag from the Media Player control as a string variable. For example, to obtain the author information for the current clip, you could use the following script code.
authorInfo = MediaPlayer.GetMediaInfoString(9);
To obtain the value of the "Release Date" parameter for the second clip at any time during the playback, you could use this script code.
releaseDate = MediaPlayer.GetMediaParameter( 2, "Release Date");
The Windows Radio toolbar provides Internet content providers with the ability to provide broadcast and Internet-only radio station playback.
This section contains the following topics.
Because most browsers do not recognize the protocols that are used for streaming media, such as Microsoft Media Server protocol (MMS), you cannot always link directly from a Web page to a streaming media server. The solution is to create an Advanced Stream redirector (ASX) file containing the information needed by the Windows Radio toolbar, and store this file on a Web server. Then link from the Web document to the ASX file. When the user's browser opens the ASX file, the Windows Radio toolbar processes the file, connects to the streaming media server, and plays the specified radio station. Alternatively, you can use Active Server Pages (ASP) to generate ASX files that link to your content.
The following is a sample ASX file.
<ASX VERSION="3.0"> <TITLE>Show title information</TITLE> <MOREINFO HREF="www.microsoft.com"/> <ENTRY> <TITLE>Clip title information</TITLE> <AUTHOR>Author information</AUTHOR> <COPYRIGHT>Copyright information</COPYRIGHT> <REF HREF="mms://samples.microsoft.com/radio.asf"/> </ENTRY> </ASX>
After creating your ASX file, refer to the ASX file by specifying vnd.ms.radio: followed by the URL of your ASX file.
<A HREF="vnd.ms.radio:http://samples.microsoft.com/radio.asx">Click here for the radio station</A>
If your browser supports the Windows Radio toolbar, you can automatically start radio station playback with the following VBScript code.
<SCRIPT LANGUAGE="VBScript"> <!-- Sub Window_OnLoad() window.location.href="vnd.ms.radio:http://samples.microsoft.com/radio.asx" End Sub --> </SCRIPT>