feat(media): support audio and video

[eladzlot]

Choosing Tech

The best way to play media is using html5 (supported only from ie9 and up).

Even assuming that is fine with us, there is a cross browser problem, where there is inconsistency across browsers in supported media. It appears that there is not a single format that is consistently supported across all browsers. (although mp4 and mp3 are relatively OK in that regard)
https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats
http://support.jwplayer.com/customer/portal/articles/1403653-browser-device-reference
http://support.jwplayer.com/customer/portal/articles/1403635-media-format-reference

There is a possibility to bridge this problem using a flash/silverlight polyfil but then we necessarily drop back to our flash problems for nonstandard media formats.
http://mediaelementjs.com/

Project implicit has been using JWplayer for media until now.
It is a very powerful player and is the oldest of this type.
The are several problems with it, (1) is that it is not free and (2) requires a user key. In addition, (3) it is quite heavy.
We might want to look into a light and free library instead... (mediaelement?)

API

There are several stages incorporating media into PIP:

1. preloading
2. actions
   • start
   • stop
   • (later) restart
   • (later) control volume etc.
3. conditions
   • end
   • (maybe start?)

Preloading

Preloading seems to be the problematic area here.
As far as I can tell, mobile phones do not allow pre-loading at all, desktops allow partial preloading at most.
I think this means we need to make the loading interface for pip more flexible.
In particular we should allow lazy loading of media during a trial.
This means that a user might activate a trial and then wait for the media to load (although we can at least start loading some of the things...).
Use of PIP would have to reflect the fact that we can not be sure when media will start (all though we can log it retroactively).