Html5 video Renderer

The Html5VideoRenderer will render the Azure media player compatible with ImageVault Video.

var video = client.Load<Video>(6405)
    .Resize(200, 200)
    .Single();
var context = new RenderContext(video);

//You can of course force the Html 5 video renderer if you would like to
//context.RendererId = Html5VideoRenderer.RendererId;

var html = MediaRenderer.Render(context);

The following context values can be used to control the behavior of the player. (In addition to the generic context keys that can be set to all renderers.)

Controls

Set this if video controls should be visible for the video.

Default is true.

context.Set(ContextKey.Controls, false);

Autoplay

Set this if autoplay should be activated for the video.

Default is true.

context.Set(ContextKey.Autoplay);

Muted

Set this if audio should be muted from start. In some cases, muted is needed to ensure that autplay works in most browsers.

Default is false.

context.Set(ContextKey.Muted);

Loop

Set to true if video should be looped during playback

Default is false.

context.Set(ContextKey.Loop);

Poster

Sets the poster attribute of the video tag

Default is the poster of the requested media (but set using the PosterKeyAndName context key)

context.Set(Html5VideoRenderer.PosterUrlKey, "https://some.site/path/to/poster.jpg");

Width

Sets the width of the player in pixels. Will be translated to the width attribute of the video HTML element.

Default is set to the width of the video

context.Set(ContextKey.Width, 200);

Height

Sets the height of the player in pixels. Will be translated to the height attribute of the video HTML element.

Default is set to the height of the video

context.Set(ContextKey.Height, 400);

NotSupportedText

The text displayed to the user if the browser is unable to display the player for some reason.

Default value is documented in [NotSupportedText][]

context.Set(nameof(Html5VideoRenderer.NotSupportedText), "Ye browser is too old");

Video Sources

The different sources used by the video element. You can either specify the Src attribute for an external url or MediaKeyAndName for an internal ImageVault resource.

Default value is the different sources of the requested media.

var sources = new List<Html5VideoSource>
{
    new Html5VideoSource {Src = "https://some.site/path/to/video.webm", Type = "video/webm"},
    new Html5VideoSource {MediaKeyAndName = "di8jjewqh8b9y2hewq/video.mp4", Type = "video/mp4"}
};
context.Set(Html5VideoRenderer.VideoSourcesKey, sources);