<dash-video>

A custom element for dash.js with an API that matches the <video> API.

<media-controller>
  <dash-video
    src="https://dash.akamaized.net/akamai/streamroot/050714/Spring_4Ktest.mpd"
    slot="media"
    crossorigin
    muted
  ></dash-video>
  <media-control-bar>
    <media-play-button></media-play-button>
    <media-mute-button></media-mute-button>
    <media-volume-range></media-volume-range>
    <media-time-range></media-time-range>
    <media-time-display show-duration remaining></media-time-display>
    <media-fullscreen-button></media-fullscreen-button>
  </media-control-bar>
</media-controller>
Open on CodeSandboxOpen Sandbox

Installing

Section titled Installing

First install the NPM package:

npm install @luwes/dash-video-element

Import in your app javascript (e.g. src/App.js):

import '@luwes/dash-video-element';

Optionally, you can load the script directly from a CDN using jsDelivr:

<script type="module" src="https://cdn.jsdelivr.net/npm/@luwes/dash-video-element@1.0/+esm"></script>

This will register the custom elements with the browser so they can be used as HTML.