Some instructions on using media player on the Web

Source: Internet
Author: User
Tags html comment
Simple Example of scripting in a web page

You can easily embed the Windows Media Player control in an HTML file using any scripting language your browser recognizes. the following simple example uses Microsoft JScript to create a page that will play a file when you click on a button, and stop playing the file when you click on another button.

You can embed the Windows Media Player ActiveX control in a Web page using the following four steps:

  1. Create the web page.
  2. Add the object tag.
  3. Add a user interface. In this case, two buttons.
  4. Add a few lines of code to respond when the user clicks on one of the buttons you have created.
Creating the web page

The first step is to create a valid HTML web page. The following code is the minimum needed to create a blank but valid HTML page:

<HTML>    <HEAD>    </HEAD>    <BODY>    </BODY></HTML>
Adding the object tag

Once you have created a web page, you need to add an object tag. this identifies the ActiveX control to the browser and sets up any initial definitions. you must place the object tag in the body of the Code. if you place it in the body, the default user interface of Windows Media Player will be visible. if you want to create your own user interface, set the height and width attributes to 0 (zero ). you can also setPlayer. UimodeProperty to "invisible" when you want to hide the control, but still reserve space for it on the page. The following code is recommended when you provide a Custom User Interface:

<OBJECT ID="Player" height="0" width="0"  CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"></OBJECT>

The following object tag attributes are required:

ID

The name that will be used by other parts of the Code to identify and use the ActiveX control. you can choose any name you want, as long as it is a name that is not already used by HTML, HTML extensions, or the scripting language you are using. in this example, the namePlayerIs used, but you coshould also call itMyplayerOr something else. Just pick a name that is unique to that web page.

Classid

A very large hexadecimal number that is unique to the control. only one control has this number and it is the Windows Media Player ActiveX control. to prevent typographical errors, you can copy and paste this number from the documentation. versions of the Windows Media Player control prior to version 7.0 had a different classid.

Adding a user interface

HTML allows a vast wealth of user interface elements, allowing the user to interact with your web page by clicking, pressing keys, and other user actions. adding a few input buttons is the easiest way to provide a quick user interface. the following code creates two buttons that can respond to the user. clicking one button starts the media stream playing and the other button stops it:

<INPUT TYPE="BUTTON" NAME="BtnPlay" VALUE="Play" OnClick="StartMeUp()"><INPUT TYPE="BUTTON" NAME="BtnStop" VALUE="Stop" OnClick="ShutMeDown()">

The name of the button is used to identify the button to your code; the value is the label that will appear on the button, and The onclick attribute identifies which part of your scripting code will be called when the button is clicked.

Adding scripting code

Scripting code adds interactivity to your page. scripting code can respond to events, call methods, and change run-time properties. extended scripts are enclosed in a script tag set. the script tag tells the browser where your scripting code is and identifies the scripting language. if you do not identify a language, the default language will be Microsoft JScript.

It is good authoring practice to enclose your script in HTML comment tags so browsers that do not support scripting do not render your code as text. put the script tag anywhere within the body of your HTML file and embed the comment-surrounded code within the Opening and Closing SCRIPT tags.

The following Microsoft JScript code example callthe Windows Media Player control and performs an appropriate action in response to the corresponding button click.

<SCRIPT><!--function StartMeUp (){    Player.URL = "laure.wma";}function ShutMeDown (){    Player.controls.stop();}--></SCRIPT>

The example function, startmeup, is called when the button marked play is clicked, And the shutmedown function is called when the stop button is clicked.

The code inside startmeup uses the URL property to define a path to the media. The media will start playing immediately.

The Shutmedown code CILSStopMethod ofControlsObject. Note thatControlsObject is called throughControlsProperty ofPlayerObject, which has the id value of "Player ".

The following code shows a complete example.

<HTML><HEAD></HEAD><BODY><OBJECT ID="Player" height="0" width="0"  CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"></OBJECT><INPUT TYPE="BUTTON" NAME="BtnPlay" VALUE="Play" OnClick="StartMeUp()"><INPUT TYPE="BUTTON" NAME="BtnStop" VALUE="Stop" OnClick="ShutMeDown()"><SCRIPT><!--function StartMeUp (){    Player.URL = "laure.wma";}function ShutMeDown (){    Player.controls.stop();}--></SCRIPT></BODY></HTML>

Note that you must provide a valid URL to a valid file name in the URL property. In this case the assumption is that the file Laurel .wma is in the same directory as the HTML file.

This is a copy section from the msdn SDK, but it illustrates some problems, such as the play and stop issues, which are often seen in the Web ASP version of media player, mediaid is easy to describe. controls. play () and media. control. stop (); to control

Controls. currentitem

TheCurrentitemProperty specifies or retrieves the current media item.

Syntax

player.controls.currentItem

Possible values

This property is a read/writeMediaObject.

Remarks

This method works only with items inPlayer.Currentplaylist. CallingCurrentitemWith a reference to a saved media item is not supported.

Example code

The following JScript example usesCurrentitemTo set the player control current media item to the selected value in an HTML select element. The current playlist was first specified by usingPlaylistcollection.Getbyname.PlayerObject was created with ID = "Player ".

<SELECT ID = playItem  NAME = "playItem"  LANGUAGE = "JScript"    /* Specify the current item when the selected list value changes. */    onChange = "Player.controls.currentItem = Player.currentPlaylist.item(playItem.value);">    /* Fill the SELECT element list with three items that match       the songs in the playlist. */    <OPTION VALUE = 0 >Laure    <OPTION VALUE = 1 >Jeanne    <OPTION VALUE = 2 >House</SELECT>Controls.currentItem

The currentItem property specifies or retrieves the current media item.

Syntax

player.controls.currentItem

Possible Values

This property is a read/write Media object.

Remarks

This method works only with items in Player.currentPlaylist. Calling currentItem with a reference to a saved media item is not supported.

Example Code

The following JScript example uses currentItem to set the player control current media item to the selected value in an HTML SELECT element. The current playlist was first specified by using PlaylistCollection.getByName. The Player object was created with ID = "Player".

<Select id = playitem name = "playitem" Language = "jscript"/* specify the current item when the selected list value changes. */onchange = "player. controls. currentitem = player. currentplaylist. item (playitem. value); ">/* fill the select element list with three items that match the songs in the playlist. */<option value = 0> Laure <option value = 1> Jeanne <option value = 2> house </SELECT> obviously, controls has many things that we can control.
Controls. Next

TheNextMethod sets the current item to the next item in the playlist.

Syntax

player.controls.next()

Parameters

This method takes no parameters.

Return values

This method does not return a value.

Remarks

If the playlist is on the last entry whenNextIs invoked, the first entry in the playlist will become the current one.

For server-side playlists, this method skips to the next item in the server-side playlist, not the client playlist.

When playing a DVD, this method skips to the next logical chapter in the playback sequence, which may not be the next chapter in the playlist. when playing DVD stills, this method skips to the next still.

Example code

The following example creates an HTML button element that usesNextTo move to the next item in the current playlist.PlayerObject was created with ID = "Player ".

<INPUT TYPE = "BUTTON"  ID = "NEXT"  NAME = "NEXT"  VALUE = ">>|"    onClick = "        /* Check first to be sure the operation is valid. */        if (Player.controls.isAvailable('Next'))            /* Move to the next item in the playlist. */            Player.controls.next();">

All of these are available in Microsoft sdks. The size is 10 MB, which can be easily downloaded.

Here we only write some usage in web scripts, which can be controlled like vb vc. Controls is obviously very convenient.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.