@mediakind/mkplayer 1.0.7

package/README.md

@@ -0,0 +1,125 @@
+## Overview
+`MKPlayer` is an HTML5 video player used for playing back HLS and DASH adaptive bitrate streams without using browser plugins.
+
+Our main goal is to provide a simple, abstract API that allows you to quickly get video playback of MediaKind streams running on your web page. Please reach out to the MediaKind team as we must whitelist your domain that our player will run on.
+
+#### Player Initialization 
+
+Include the `mkplayer.js` and `mkplayer-ui.min.css` file on your page 
+
+```javascript
+<script type='text/javascript' src='mkplayer.js'></script>
+<link rel='stylesheet' href='./mkplayer-ui.min.css'>
+```
+
+Add a `<div>` for the player 
+```html
+<div id='player'></div>
+```
+
+Initialize the video player
+```javascript
+var mkPlayerConfiguration = {
+  debug: true,
+  autoplay: true,
+  muted: true,
+};
+
+var playerContainer = document.getElementById('player');
+mkPlayer = new mkplayer.MKPlayer(playerContainer, mkPlayerConfiguration);
+```
+Load a new stream by passing in a MKStream object
+```javascript
+let mkStream = {
+  primaryUrl: 'https://primary-cdn.com/assetId/master.m3u8?token=tokenUrl',
+  secondaryUrl: 'https://secondary-cdn.com/assetId/master.m3u8?token=tokenUrl',
+  cdnFailoverPercent: 10, //10 percent of streams will start with the secondary url
+  assetIdentifier: 'Your Asset Id',
+  poster: 'https://your-cdn.com/poster.png'
+}
+
+mkPlayer.load(mkStream).then(function() {
+  console.log('MKPlayer Example Page Loaded Source Successfully');
+}, function(reason) {
+  console.error('MKPlayer Example Page - Error loading MKPlayer Source');
+  console.error(reason);
+});
+
+```
+Register your event listeners prior to loading a source to make sure you have visibility into the video playback session
+```javascript 
+
+mkPlayer.on('playing', (event) => {
+    console.log('[MKPlayer] playing' + event.timestamp);
+});
+
+mkPlayer.on('paused', (event) => {
+    console.log('[MKPlayer] paused' + event.timestamp);
+});
+
+mkPlayer.on('ready', (event) => {
+    console.log('[MKPlayer] ready' + event.timestamp);
+});
+
+mkPlayer.on('bufferingstarted', (event) => {
+    console.log('[MKPlayer] buffering started ' + event.timestamp);
+});
+
+mkPlayer.on('bufferingended', (event) => {
+    console.log('[MKPlayer] buffering ended ' + event.timestamp);
+});
+
+mkPlayer.on('streamfinished', (event) => {
+    console.log('[MKPlayer] streamfinished ' + event.timestamp);
+});
+
+mkPlayer.on('timechanged', (event) => {
+    console.log('[MKPlayer] timechanged ' + event.playbackTime);
+});
+
+mkPlayer.on('error', (event) => {
+    console.error('[MKPlayer] error: %d - %s', event.code, event.name);
+});
+
+mkPlayer.on('warning', (event) => {
+    console.warning('[MKPlayer] warning: %d - %s', event.code, event.name);
+});
+
+mkPlayer.on('qualitychanged', (event) => {
+    console.log('[MKPlayer] bitrate changed: ' + event.targetQuality.bitrate);
+});
+
+```
+
+If you need to unload the current stream or destroy the player, you can use the following methods. You must create a new instance of the player if you call `destroy()`
+
+```javascript
+mkPlayer.unload();
+mkPlayer.destroy();
+```
+
+You can also add external subtitles via an optional field in the `MKStream` object
+
+```javascript
+var dashSubtitleSource = {
+  primaryUrl: "https://path_to_your_stream/main.mpd",
+  subtitleTracks: [{
+    url: 'https://path_to_your_stream/subtitles_en.vtt',
+    language: 'ms'
+  }],
+  assetIdentifier: 'DASH Subtitle',
+};
+```
+
+### Support Matrix
+| Browser       | Windows    | Mac      | Linux    | Android  | iOS >= 12 | ChromeOS | Other |
+|--:-:----------|--:-:-------|--:-:-----|--:-:-----|--:-:-----|--:-:------|--:-:-----|--:-:--|
+| Chrome        | **Both**   | **Both** | **Both** | **Both** | **HLS**   | **Both** | -     |
+| Firefox       | **Both**   | **Both** | **Both** | -        | **HLS**   | -        | -     |
+| Edge          | **Both**   | -        | -        | -        | -         | -        | -     |
+| Edge Chromium | **Both**   | **Both** | -        | -        | **HLS**   | -        | -     |
+| IE ≤ 10       | **No**     | -        | -        | -        | -         | -        | -     |
+| IE 11         | **Both** ⁴ | -        | -        | -        | -         | -        | -     |
+| Safari        | -          | **HLS**  | -        | -        | **HLS**   | -        | -     |
+| Opera         | untested   | untested | untested | untested | **HLS**   | -        | -     |
+

package/azure-pipelines.yml

@@ -0,0 +1,34 @@
+# Starter pipeline
+# Start with a minimal pipeline that you can customize to build and deploy your code.
+# Add steps that build, run tests, deploy, and more:
+# https://aka.ms/yaml
+
+trigger:
+- develop
+
+pool:
+  vmImage: 'ubuntu-latest'
+
+steps:
+- script: echo Hello, world!
+  displayName: 'Run a one-line script'
+
+- script: |
+    #Download AzCopy
+    wget https://aka.ms/downloadazcopy-v10-linux
+
+    #Expand Archive
+    tar -xvf downloadazcopy-v10-linux
+
+    #(Optional) Remove existing AzCopy version
+    sudo rm /usr/bin/azcopy
+
+    #Move AzCopy to the destination you want to store it
+    sudo cp ./azcopy_linux_amd64_*/azcopy /usr/bin/
+
+    sudo chmod 775 /usr/bin/azcopy
+
+    #Build and deploy the sample page and docs
+    npm install
+    npm run deploy
+  displayName: 'Run a multi-line script'

package/dist/BufferLevel.d.ts

@@ -0,0 +1,4 @@
+export interface BufferLevel {
+    audio: number;
+    video: number;
+}

package/dist/Logger.d.ts

@@ -0,0 +1,9 @@
+export declare class Logger {
+    private static enabled;
+    static enable(): void;
+    static disable(): void;
+    static log(message?: any, ...optionalParams: any[]): void;
+    static error(message?: any, ...optionalParams: any[]): void;
+    static warn(message?: any, ...optionalParams: any[]): void;
+    static debug(message?: any, ...optionalParams: any[]): void;
+}

package/dist/MKPlayer.d.ts

@@ -0,0 +1,26 @@
+import { MKPlayerConfiguration } from './MKPlayerConfiguration';
+import { MKStream } from './MKStream';
+import { MKEvent } from './events/MKEvent';
+import { BufferLevel } from './BufferLevel';
+import { MKPlayerEventCallback } from './events/MKPlayerEventCallback';
+export declare class MKPlayer {
+    private player;
+    constructor(containerElement: HTMLElement, mkPlayerConfiguration: MKPlayerConfiguration);
+    play(): Promise<void>;
+    pause(): void;
+    destroy(): Promise<void>;
+    load(stream: MKStream): Promise<void>;
+    off(eventType: MKEvent, callback: MKPlayerEventCallback): void;
+    on(eventType: MKEvent, callback: MKPlayerEventCallback): void;
+    unload(): Promise<void>;
+    getCurrentTime(): number;
+    getBufferLevels(): BufferLevel;
+    mute(): void;
+    unmute(): void;
+    setVolume(volume: number): void;
+    version(): string;
+    private static selectUrl;
+    private static getRandomInt;
+    private static makeId;
+    private static mapEvent;
+}

package/dist/MKPlayerConfiguration.d.ts

@@ -0,0 +1,6 @@
+export interface MKPlayerConfiguration {
+    debug: boolean;
+    autoplay: boolean;
+    muted: boolean;
+    smallScreen: boolean;
+}

package/dist/MKStream.d.ts

@@ -0,0 +1,16 @@
+import { SubtitleTrack } from './SubtitleTrack';
+export declare class MKStream {
+    private readonly _assetIdentifier;
+    private readonly _primaryUrl?;
+    private readonly _secondaryUrl?;
+    private readonly _subtitleTracks;
+    private readonly _cdnFailoverPercent;
+    private readonly _poster;
+    constructor(primaryUrl: string, assetIdentifier: string, subtitleTracks?: SubtitleTrack[], poster?: string, secondaryUrl?: string, cdnFailoverPercent?: number);
+    get cdnFailoverPercent(): number;
+    get primaryUrl(): string;
+    get secondaryUrl(): string;
+    get subtitleTracks(): SubtitleTrack[];
+    get assetIdentifier(): string;
+    get poster(): string;
+}

package/dist/SubtitleTrack.d.ts

@@ -0,0 +1,4 @@
+export interface SubtitleTrack {
+    url: string;
+    language: string;
+}

package/dist/events/MKEvent.d.ts

@@ -0,0 +1,13 @@
+export declare enum MKEvent {
+    Playing = "playing",
+    Ready = "ready",
+    TimeChanged = "timechanged",
+    Error = "error",
+    BufferingStarted = "bufferingstarted",
+    BufferingEnded = "bufferingended",
+    StreamFinished = "streamfinished",
+    Warning = "warning",
+    QualityChanged = "qualitychanged",
+    SegmentPlayback = "segmentplayback",
+    Unloaded = "unloaded"
+}

package/dist/events/MKPlayerEventCallback.d.ts

@@ -0,0 +1,4 @@
+import { PlayerEventBase } from 'bitmovin-player';
+export interface MKPlayerEventCallback {
+    (event: PlayerEventBase): void;
+}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { MKPlayer } from './MKPlayer';
+export { MKPlayerConfiguration } from './MKPlayerConfiguration';
+export { MKStream } from './MKStream';
+export { MKEvent } from './events/MKEvent';