Button overlay on top of Video [iPad]:

• if the default controls of video tag is set to true, there’s no way to override the click events
• libraries like MediaElement disabled the default controls, thereby recapturing events

How to destroy video tag completely:

• simply changing the source attribute of <video> or <source> is not enough.
• <video> tag needs to be taken out of the stream of document completely.

How to count video into deferred objects for the loading:

• there are two events for loading (on MediaElementjs):
  1. loadeddata: The first frame of the media has finished loading.
  2. loadedmetadata: The media’s metadata has finished loading; all attributes now contain as much useful information as they’re going to.
• after firing load() for video, wait to capture “loadeddata” event

$('video').mediaelementplayer({
    success: function(player, node) {
        // load video and events
        player.load();
        var videoLoad = $.Deferred();

        // add the object into a list of all the objects
        self.loading.add(videoLoad);

        player.addEventListener("loadeddata", function() {
            videoLoad.resolve();
        });
    };
});