Skip to content

Extending the Player

nweber edited this page Mar 6, 2013 · 9 revisions

The player is a set of many small, discrete "classes". The goal was to group related decisions together, but to keep groups of decisions fairly small, so that any one (or more) decisions can be easily extended/overwritten.

After identifying which decision you would like to change, you should first implement your own version of the method.

For example, here’s how you might override the decision 'shouldBufferMore' (which decides whether or not more data should be loaded into the buffer).

MyPackage.classes.SuperBufferDecisions = function () {
     return {
          shouldBufferMore: function (bufferLength) {
               // we are wild and crazy, buffer like there's no tomorrow!
               return Q.when(true);
          }
     };
}

MyPackage.classes.SuperBufferDecisions.prototype = new MediaPlayer.dependencies.BufferExtensions();
MyPackage.classes.SuperBufferDecisions.prototype.constructor = MyPackage.classes.SuperBufferDecisions;

This 'class' has been placed inside of it’s own package MyPackage.classes so that there’s no global conflicts. The prototype of SuperBufferDecisions has been set to an instance of the `MediaPlayer.dependencies.BufferExtensions' object. This is a very simple form of inheritance. The methods we wanted to override has been defined in the return block.

Next we need to tell the player to use the new class instead of the preexisting class.

The player is using a dependency injection framework called dijon. https://github.com/creynders/dijon-framework Each MediaPlayer instance is given a Context. The Context makes all of the DI decisions and it is where the object map is defined. To have the new class be injected instead of the old class, we need to create a new custom context.

This example extends the DashContext and adds the new buffer extensions class from above.

MyPackage.classes.SuperContext = function () {
    "use strict";

    return {
        system : undefined,
        setup : function () {
            MyPackage.classes.SuperContext.prototype.setup.call(this);

            this.system.mapSingleton('bufferExt', MyPackage.classes.SuperBufferDecisions);
        }
    };
};

MyPackage.classes.SuperContext.prototype = new Dash.di.DashContext();
MyPackage.classes.SuperContext.prototype.constructor = MyPackage.classes.SuperContext;

After the new context is made, it needs to be given to the MediaPlayer instance.

var video = document.querySelector(".dash-video-player video"),
    context = new MyPackage.classes.SuperContext(),
    player = new MediaPlayer(context);

    player.startup();
    player.autoPlay = true;
    player.attachView(video);
    player.attachSource(source);
Clone this wiki locally