JSPM

import "video.js/dist/video-js.css";
import { videoJsPlugin } from "@netless/video-js-plugin";
import { createPlugins } from "white-web-sdk";

const plugins = createPlugins({ "video.js": videoJsPlugin() });

plugins.setPluginContext("video.js", { enable: true, verbose: true });

const sdk = new WhiteWebSdk({ appIdentifier, plugins });

const room = await sdk.joinRoom({ uuid, roomToken });

room.insertPlugin("video.js", {
    originX: -width / 2,
    originY: -height / 2,
    width,
    height,
    attributes: { src: "url/to/a.mp4" },
});

export interface PluginContext {
    /**
     * Chrome prevents video play sound on video.play().
     * Set `hideMuteAlert: true` to hide the muted mask covering the player.
     * @default false
     */
    hideMuteAlert?: boolean;

    /**
     * @deprecated use `enable` or `room.setWritable()` instead.
     * @default "guest"
     */
    identity?: "host" | "publisher" | "guest" | "observer";

    /**
     * If set false, videojs plugins will not be controlled by the user input.
     * @default false
     */
    enable?: boolean;

    /**
     * For debug.
     * @default false
     */
    verbose?: boolean;
}

export interface VideoJsPluginAttributes {
    /** whether to show [X], default `true` */
    close?: boolean;
    /** text at top-left corner */
    title?: string;
    /** mime type */
    type?: string;

    /** video url */
    src: string;
    /** poster */
    poster: string;
    /** current `room.calibrationTimestamp` */
    hostTime: number;
    /** current play time */
    currentTime: number;
    /** is paused, default `false` */
    paused: boolean;
    /** is muted, default `false` */
    muted: boolean;
    /** volume (0..1), default `1` */
    volume: number;
}