This project is read-only.

Getting Started Guide - JavaScript Usage

Follow these steps to get the HTML5 Player Framework added to your web page:

Step 1: Download the HTML5 Player Framework.

  • Use the minified JavaScript and CSS files for production (js/playerframework.min.js and css/playerframework.min.css) or the documented JavaScript and CSS files for development (src/js/*.js and src/css/*.css).

Step 2: Download the Silverlight Players.

  • Create a directory named "xap" and add either the Progressive Download Sample Player or the Smooth Streaming Sample Player .xap file. Rename the file to SilverlightPlayer.xap.

Step 3: Add the following JavaScript and CSS references to your web page:

    <script src="js/playerframework.min.js"></script>
    <link rel="stylesheet" href="css/playerframework.min.css">

Step 4: Add the video player container in HTML.

<div id="myVideoContainer" class="pf-container">

Step 5: Add the following JavaScript:

    var myPlayer = new PlayerFramework.Player("myVideoContainer",
        mediaPluginFallbackOrder: [ "VideoElementMediaPlugin", "SilverlightMediaPlugin" ],
        //Uncomment the following line and comment out the line above to use Silverlight as the primary experience:
        //mediaPluginFallbackOrder: [ "SilverlightMediaPlugin", "VideoElementMediaPlugin" ], 
        width: "480px",
        height: "320px",
        poster: "",
                src: "",
                type: "text/xml"
                src: "",
                type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"'
                src: "",
                type: 'video/webm; codecs="vp8, vorbis"'
                src: "",
                type: 'video/ogg; codecs="theora, vorbis"'

Last edited Nov 9, 2011 at 5:33 PM by timgreenfield, version 1