Microsoft Media Player 11 Scripting
Basic Parameters (default choice values are underlined)

Internet Explorer Version (click here for a cross-browser version)
  • URL (User Choice in HTML): 
    lyrics
    URL/filename:
     ""
    Usage: Player.URL="url/filename;"
  • autoStart (if false you must press "play")
    false true
    Usage: Player.settings.autoStart="false|true;"
  • mute
    false true
    Usage: Player.settings.mute="false|true;"
  • loop
    false true
    Usage: Player.settings.setMode("loop",true|false);
  • volume (percent of current system volume)
      
    Usage: Player.settings.volume=0 < integer value < 100;
    (default is last volume setting -- see slider code section below)
  • balance (left-right audio volume)
      
    Usage: Player.settings.balance=-100 < integer value < 100;
    (default is 0 i.e., equal left right, -100 is all left,

    +100 is all right -- see slider code section below)
  • uiMode (User Interface Mode)
    invisible none mini full
    Usage: Player.uiMode="invisible|none|mini|full"
  • stretchToFit (stretch to fit your HTML specifed width/height)
    false (original) true (HTML specified height/width)
    Usage: Player.stretchToFit=true | false;

 
   

Player.controls.CurrentPosition (raw):
Formatted (HH:MM:SS) Current Position:

Raw Calculated Remaining Time (raw):
Formated (HH:MM:SS) Calculated Remaining Time:

Player.currentMediaDuration (raw):
Player.currentMedia.DurationString (HH:MM:SS):

Playback Rate= (1 is normal, 2 is double speed, etc.)
Update Timer Interval= milliseconds

The Microsoft Media Player has several different settings. The most commonly set controls fall into the following four categories each having a slightly different scripting reference (see this for a complete description of object model for scripting):
  1. Player Object
    The "Player" object defines the player which appears on the web page. The HTML for this player looks like this:

    <OBJECT id="user defined object name for the player" width='360' height='270'
    classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'
    codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
    standby='Loading Microsoft Windows Media Player components...'
    type='application/x-oleobject'>
    </OBJECT>

    This code is placed on the web page. You decide on:

    Common player methods are (we use the arbitrary object name "Player"):

  2. Settings Object

    The player object has a group of settings specified in the player's setting object. Usage is:

    Player.setting.setting property=value

    Common player settings are (defaults are underlined):

  3. Controls Objects

    The controls object is used to provide play controls for the media player. Usage is:

    Player.controls.property();

    Common player controls are:

  4. Media Object

    There are a few really usable media object properties. Usage is:

    Player.currentMedia.property;

  5. slider code

    The slider code used in this example is from SoftComplex.

    The four HTML components are:

    1. a button image to be moved by the mouse. I am using the image named "vidbut.jpg"

      This is the image: . It is 16 pixels wide and 20 pixels tall. Click here to download the image.

    2. a backgound image that the button moves across. This image is named "vidbutback.jpg"

      This is the image: . It is 120 pixels wide and 28 pixels tall. Click here to download the image.

    3. a single pixel black gif image to make the slider's track. This image is named "black1x1.gif"

      This is the image: . It is 1 pixels wide and 1 pixels tall -- but displayed here as 20 by 20. Click here to download the image.

    4. The javascript code is stored in a file named "slider.js". You can download it from the SoftComplex site above or from here. Either way it needs to be saved in the directory where your video application's HTML is stored.

    The HTML code to wire up the images and the javascript is:

    1. the "slider.js" script reference appears in the heading of the HTML page as:

      <script language="JavaScript" src="slider.js"><'/script>

      then on the HTML page are:

    2. the HTML text box that contains the slider's value:

      <input name="slider textbox name" size="3" id="slider textboxname" type="text" onchange="A_SLIDERS[0].f_setValue(this.value)">

      The slider textbox name will be used below.

    3. the code to define the slider is placed in the HTML adjacent to the slider's textbox:

      <script language="javascript">
      var some_structure_name_1 =
         {
         'b_vertical' : false,           //*** vertical is true ;horizontal if false
         'b_watch': true,                //*** continuously update while moving if true
         'n_controlWidth': 120,          //*** width of the background image
         'n_controlHeight': 28,          //*** height of ther background image
         'n_sliderWidth': 16,            //*** width of the slider
         'n_sliderHeight': 20,           //*** height of the slider
         'n_pathLeft' : 2,               //*** slider offset from the left side of the background
         'n_pathTop' : 4,                //*** slider offset from the top of the background
         'n_pathLength' : 100,           //*** width (r height) of the slider movement distance
         's_imgControl': 'vidbutback.jpg',   //*** background image name
         's_imgSlider': 'vidbut.jpg',        //*** slider image name
         'n_zIndex': 10                      //*** z-index
         }
      var some_structure_name_2 =
        {
         's_form' : 'vcform',   //*** name (or number) of the form containing the slider
         's_name': 'slider textbox name', //*** name/id of the slider (slider textbox name above)
         'n_minValue' : -100,   //*** minimum value the slider will attain when moved all the way to the left
         'n_maxValue' : 100,    //*** maximum value the slider will attain when moved all the way to the    right
         'n_value' : 0,         //*** initial value the slider (between the two value above)
         'n_step' : 1           //*** precision of the slider movemnt
        }
      new slider(some_structure_name_1,some_structure_name_2);
      </script>
      

      This script inserts the slider, and background on the page.

    4. a slider track

      I have added a slider track using the one pixel black gif above. The HTML is:

      <span style="position:absolute;Top:12px;Left:10px;z-index:8;">
      <img src="black1x1.gif" height="2" width="100"></span>

      In this example, the choice of the "top" and "left" properties centers the black track in the background image. Note that the slider has a z-index of 10 and the track has a z-index of 8 (thus the track appears behind the slider)

    5. Here are all HTML page pieces in a textarea for cut/paste:

      Here is the resulting example slider:  

    6. Things that have to match up:

      (a) The two structure names that appear in the javascript that define the parameters of the slider will appear as arguments in the "new slider".

      (b) The textbox that contains the slider's value has both a "name" and an "id" attribute. They must be have the same value AND the value must appear in second structure as the value of "s_name".

    7. Multiple sliders

      In order to user multiple sliders on the same page:

      Use a different name/id for each slider textbox. Be sure to change the name in the second structure where the slider is created as the "s_name" value. Then, note in the reference "A_SLIDERS[some_number]" <input name="slider textbox name" size="3" id="slider textboxname" type="text" onchange="A_SLIDERS[some_number].f_setValue(this.value)">

      Here some_number is the sequence number of the slider on the page (the first is zero, the second is one,...). Note that the third slider on this page (the example above) is slider number 2.


    Videos here are wmv formatted from youtube.com