voPlayer

Prerequisite

Please refer to Tools/setuphttpserver/Win32/README.txt or Tools/setuphttpserver/MacOS/README.md to check how to setup a http server and run the player Demo.

Quick Start for Developers

Create a div element in your html first. Please make sure the controls attribute is present.

<div id="container"></div>

Add voplayer.min.js to the end of the body.

<body>
  ...
  <script src="yourPathOfLibs/voplayer.min.js"></script>
</body>

Now comes to good stuffs. We need to create a MediaPlayer & initialize it.

   var divVideoPlayer = document.getElementById("container");
   var player = new voPlayer.Player(divVideoPlayer);
   player.init(config);
   player.open(source);
   player.play();

When it is all done, it should look like the following code.

<!DOCTYPE html>
<html>
  <body>
    <div>
      <div id="container"></div>
    </div>
    <script src="libs/voplayer.min.js"></script>
    <script>
      var container = document.getElementById("container");
      var player = new voPlayer.Player(container);
      var config = {
          playback: {
            autoPlay: true
          }
      };
      player.init(config);
      var source = {
        links: [{
            uri: "http://dash.edgesuite.net/akamai/bbb_30fps/bbb_30fps.mpd"
        }]
      };
      player.open(source);
    </script>
  </body>
</html>

Guide for configuring player and source

User can initialize player by a configuration (see module:Player~config) and open the media source with sourceConfig(see module:Player~sourceConfig).

For the sample code, user can modify "voDefaultConfig" and "voDefaultStream" in "SamplePlayer/sampleplayer/app/assets.js" to set own configuration and default stream. Also can add streams to "voAvailableStreams" in "SamplePlayer/sampleplayer/app/assets.js".

If there is no complicated configuration of the media source, users can input the url and related drm information by selecting "Enter Asset" from the drop-down menu of "stream" in the Demo.