@mattebox/player 0.1.0

package/dist/element.js

@@ -0,0 +1,327 @@
+/**
+ * <mattebox-player>: a real <video> as a light-DOM child, so the integrator
+ * can reach it, and the player's own panels in shadow DOM. The element never
+ * forwards or wraps a media element member: play, pause, seek, volume and
+ * the rest live on the video, where the browser, Picture-in-Picture and the
+ * OS media session already find them.
+ *
+ * No class fields, `#private` or otherwise: the ES2015 build would lower
+ * them into runtime helpers, and the emit check bans helpers. Statics are
+ * getters and instance state is declared, then assigned in the constructor.
+ */
+import { createPlayer, matteboxHandler, nativeHandler } from '@mattebox/player-core';
+import { controlBar } from './controls/bar.js';
+import { ATTRIBUTES, resolve } from './controls/options.js';
+import { namespaces } from './namespaces.js';
+import { drmPanel } from './panels/drm.js';
+import { errorSurface } from './panels/error.js';
+import { livePanel } from './panels/live.js';
+import { qualityPanel } from './panels/quality.js';
+import { tracksPanel } from './panels/tracks.js';
+import { drmGuard, resolvePreset } from './presets.js';
+import { STYLE } from './style.js';
+const TAG = 'mattebox-player';
+/** Attributes forwarded onto the video as attributes, never as properties. */
+const FORWARDED = ['autoplay', 'muted', 'poster'];
+/** Everything else the element watches. Changing any of them reloads. */
+const OWN = ['src', 'type', 'preset', 'license-url', 'thumbnails'];
+/**
+ * The one attribute whose meaning the element owns: `native` keeps the
+ * browser's controls on the video, `custom` swaps them for the bar, `none`
+ * leaves the video bare for a page that draws its own. Anything else is
+ * `native`. Changing it swaps the bar without touching the session.
+ */
+const CONTROLS = 'controls';
+/** The bar's knobs as attributes. Changing one rebuilds the bar with the new value. */
+const KNOBS = Object.values(ATTRIBUTES);
+/** Composed in this order, and each one answers null when its namespace is absent. */
+const PANELS = [qualityPanel, tracksPanel, livePanel, drmPanel];
+/** Every stage the engine ships. A narrower preset is optimization. */
+const DEFAULT_PRESET = 'full';
+/**
+ * What `define()` recorded, for the elements the parser creates. It is the
+ * one value shared across elements, and the prompt asks for it: a page that
+ * writes only markup still has to be able to say what the engine carries.
+ */
+let defaults = {};
+/**
+ * The interface above merges only `addEventListener` and `removeEventListener`
+ * overloads, which the class inherits from HTMLElement. The rule it suppresses
+ * guards against properties an interface declares and a constructor never
+ * assigns, and there are none.
+ */
+// biome-ignore lint/suspicious/noUnsafeDeclarationMerging: method overloads only, no properties
+export class MatteboxPlayerElement extends HTMLElement {
+    static get observedAttributes() {
+        return [...FORWARDED, ...OWN, CONTROLS, ...KNOBS];
+    }
+    /** Registers the element once, and records the stages markup-only pages get. */
+    static define(options) {
+        if (options !== undefined)
+            defaults = options;
+        if (customElements.get(TAG) === undefined)
+            customElements.define(TAG, MatteboxPlayerElement);
+    }
+    constructor(options) {
+        super();
+        this.options = options ?? defaults;
+        this.panels = [];
+        this.controls = null;
+        this.focusable = false;
+        this.core = null;
+        this.current = null;
+        this.offs = [];
+        this.queue = Promise.resolve();
+        this.pending = false;
+        this.media = document.createElement('video');
+        // Native until the `controls` attribute says otherwise, which arrives
+        // through attributeChangedCallback: a constructor must not read attributes.
+        this.media.controls = true;
+        this.stage = document.createElement('div');
+        this.stage.setAttribute('part', 'stage');
+        this.stage.append(document.createElement('slot'));
+        this.bar = document.createElement('div');
+        this.bar.setAttribute('part', 'panels');
+        this.surface = errorSurface(() => {
+            this.reload();
+        });
+        const root = this.attachShadow({ mode: 'open' });
+        const style = document.createElement('style');
+        style.textContent = STYLE;
+        root.append(style, this.stage, this.bar, this.surface.root);
+    }
+    /** The media element. Everything the browser already does is here. */
+    get video() {
+        return this.media;
+    }
+    /** The core, or null until the first source has been set up: resolving a preset is asynchronous. */
+    get player() {
+        return this.core;
+    }
+    /** The engine feeding the video, or null for a native session and before the first load. */
+    get engine() {
+        return this.current?.engine ?? null;
+    }
+    connectedCallback() {
+        if (this.media.parentNode !== this)
+            this.append(this.media);
+        for (const name of FORWARDED)
+            this.forward(name);
+        this.reload();
+    }
+    disconnectedCallback() {
+        // A single-page app must not leave a pipeline attached to a video it
+        // navigated away from. Reconnecting loads the `src` again.
+        this.enqueue(() => this.teardown());
+    }
+    attributeChangedCallback(name) {
+        if (FORWARDED.includes(name)) {
+            this.forward(name);
+            return;
+        }
+        if (name === CONTROLS || KNOBS.includes(name)) {
+            this.mode();
+            return;
+        }
+        // The preset decides the chain, so it is the one attribute that rebuilds it.
+        if (name === 'preset')
+            this.enqueue(() => this.discard());
+        this.reload();
+    }
+    /**
+     * Applies the `controls` attribute and the knobs: the video's own
+     * controls, and the bar rebuilt from scratch. Rebuilding is cheap, the
+     * knobs are read once at build, and a session re-attaches in one call.
+     */
+    mode() {
+        const value = this.getAttribute(CONTROLS);
+        const custom = value === 'custom';
+        this.media.controls = !custom && value !== 'none';
+        // The bar carries the menus, so the panels row would say it all twice.
+        this.bar.hidden = custom;
+        if (this.controls !== null) {
+            this.controls.dispose();
+            this.controls = null;
+            this.removeAttribute('fullscreen');
+            if (this.focusable)
+                this.removeAttribute('tabindex');
+            this.focusable = false;
+        }
+        if (!custom)
+            return;
+        // A bare video is not focusable, so without this a click on it would
+        // leave the shortcuts nowhere to listen. A page that set its own
+        // tabindex keeps it.
+        if (!this.hasAttribute('tabindex')) {
+            this.tabIndex = 0;
+            this.focusable = true;
+        }
+        const knobs = resolve(this.options.controls, (name) => this.getAttribute(name));
+        // Fullscreen goes on the stage, in shadow DOM, and `:fullscreen` does
+        // not match the host for that; the attribute is how a page styles the
+        // light-DOM video in that state.
+        this.controls = controlBar(this, this.stage, this.media, knobs, (name, on) => {
+            this.toggleAttribute(name, on);
+        }, () => {
+            this.reload();
+        });
+        // The bar's own screen carries a fatal error while the bar is up.
+        this.surface.clear();
+        this.stage.append(this.controls.root);
+        if (this.current !== null)
+            this.controls.attach(this.current);
+    }
+    forward(name) {
+        const value = this.getAttribute(name);
+        if (value === null)
+            this.media.removeAttribute(name);
+        else
+            this.media.setAttribute(name, value);
+        // A video reads `muted` into its state only when it is created, and this
+        // one was created before any attribute reached it. Muted autoplay and
+        // the autoplay policy read the state, so the attribute alone would not do.
+        if (name === 'muted')
+            this.media.muted = value !== null;
+    }
+    enqueue(task) {
+        this.queue = this.queue.then(task, task).catch(() => undefined);
+    }
+    /**
+     * One run per burst. The parser sets every attribute and then connects the
+     * element before any queued task starts, and each of those would load on
+     * its own; the flag folds them into the one run that sees the final state.
+     */
+    reload() {
+        if (this.pending)
+            return;
+        this.pending = true;
+        this.enqueue(() => {
+            this.pending = false;
+            return this.run();
+        });
+    }
+    emit(name, detail) {
+        this.dispatchEvent(new CustomEvent(name, { detail, bubbles: true, composed: true }));
+    }
+    report(error) {
+        if (error.fatal) {
+            if (this.controls !== null)
+                this.controls.error(error);
+            else
+                this.surface.show(error);
+        }
+        this.emit('error', error);
+    }
+    async run() {
+        this.unmount();
+        if (!this.isConnected)
+            return;
+        const url = this.getAttribute('src');
+        if (url === null)
+            return;
+        const core = await this.ensure();
+        const type = this.getAttribute('type');
+        const source = type === null ? { url } : { url, type };
+        this.surface.clear();
+        this.controls?.clearError();
+        let session;
+        try {
+            session = await core.load(source);
+        }
+        catch {
+            // The core already reported it on the error event, which the surface
+            // and the element's own event both carry. Nothing to add here.
+            return;
+        }
+        if (!this.isConnected) {
+            await core.unload();
+            return;
+        }
+        this.current = session;
+        this.configure(session);
+        this.controls?.attach(session);
+        for (const factory of PANELS) {
+            const panel = factory(session, this.media);
+            if (panel === null)
+                continue;
+            this.panels.push(panel);
+            this.bar.append(panel.root);
+        }
+    }
+    async ensure() {
+        if (this.core !== null)
+            return this.core;
+        const core = createPlayer(this.media, { handlers: await this.chain() });
+        this.offs.push(core.on('sourcechange', (session) => {
+            this.emit('sourcechange', session);
+        }), core.on('error', (error) => {
+            this.report(error);
+        }));
+        this.core = core;
+        return core;
+    }
+    async chain() {
+        if (this.options.handlers !== undefined)
+            return this.options.handlers;
+        if (this.options.stages !== undefined) {
+            return [matteboxHandler({ stages: this.options.stages }), nativeHandler()];
+        }
+        const name = this.getAttribute('preset') ?? DEFAULT_PRESET;
+        const preset = await resolvePreset(name);
+        if (preset === null) {
+            this.report({
+                category: 'config',
+                code: 'CONFIG_INVALID',
+                fatal: true,
+                recoverable: false,
+                handler: null,
+                context: { preset: name },
+            });
+            return [nativeHandler()];
+        }
+        return [matteboxHandler({ preset, ...drmGuard() }), nativeHandler()];
+    }
+    /** What the attributes ask of the session's namespaces, once there is one. */
+    configure(session) {
+        const engine = session.engine;
+        if (engine === null)
+            return;
+        const optional = namespaces(engine);
+        const license = this.getAttribute('license-url');
+        // After the session exists, not before: passing a license URL up front
+        // means constructing eme-core, and importing a stage to configure it
+        // would bundle it.
+        if (license !== null && optional.drm !== undefined)
+            optional.drm.setLicenseUrl(license);
+        const track = this.getAttribute('thumbnails');
+        if (track !== null && optional.thumbnails !== undefined) {
+            // Loaded here; drawn by the seek bar's preview under `controls="custom"`.
+            // Native controls expose no scrub position to anchor a preview to, so
+            // under `native` the track only answers `engine.thumbnails.at(time)` for
+            // the app. See docs/guide/03-the-element.md.
+            void optional.thumbnails.load(track).catch(() => undefined);
+        }
+    }
+    unmount() {
+        this.controls?.detach();
+        for (const panel of this.panels)
+            panel.dispose();
+        this.panels = [];
+        this.bar.replaceChildren();
+        this.current = null;
+    }
+    async teardown() {
+        this.unmount();
+        if (this.core !== null)
+            await this.core.unload();
+    }
+    /** Drops the player itself, so the next run builds a chain from the new preset. */
+    async discard() {
+        await this.teardown();
+        for (const off of this.offs)
+            off();
+        this.offs = [];
+        this.core = null;
+    }
+}
+//# sourceMappingURL=element.js.map

package/dist/element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.js","sourceRoot":"","sources":["../src/element.ts"],"names":[],"mappings":"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"}

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/asyncToGenerator.js

@@ -0,0 +1,27 @@
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/asyncToGenerator.js
+function asyncGeneratorStep(n, t, e, r, o, a, c) {
+	try {
+		var i = n[a](c), u = i.value;
+	} catch (n) {
+		e(n);
+		return;
+	}
+	i.done ? t(u) : Promise.resolve(u).then(r, o);
+}
+function _asyncToGenerator(n) {
+	return function() {
+		var t = this, e = arguments;
+		return new Promise(function(r, o) {
+			var a = n.apply(t, e);
+			function _next(n) {
+				asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
+			}
+			function _throw(n) {
+				asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
+			}
+			_next(void 0);
+		});
+	};
+}
+//#endregion
+export { _asyncToGenerator as default };

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/defineProperty.js

@@ -0,0 +1,12 @@
+import toPropertyKey from "./toPropertyKey.js";
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/defineProperty.js
+function _defineProperty(e, r, t) {
+	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+		value: t,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[r] = t, e;
+}
+//#endregion
+export { _defineProperty as default };

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/objectSpread2.js

@@ -0,0 +1,25 @@
+import _defineProperty from "./defineProperty.js";
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/objectSpread2.js
+function ownKeys(e, r) {
+	var t = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var o = Object.getOwnPropertySymbols(e);
+		r && (o = o.filter(function(r) {
+			return Object.getOwnPropertyDescriptor(e, r).enumerable;
+		})), t.push.apply(t, o);
+	}
+	return t;
+}
+function _objectSpread2(e) {
+	for (var r = 1; r < arguments.length; r++) {
+		var t = null != arguments[r] ? arguments[r] : {};
+		r % 2 ? ownKeys(Object(t), !0).forEach(function(r) {
+			_defineProperty(e, r, t[r]);
+		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r) {
+			Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+		});
+	}
+	return e;
+}
+//#endregion
+export { _objectSpread2 as default };

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/toPrimitive.js

@@ -0,0 +1,14 @@
+import _typeof from "./typeof.js";
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/toPrimitive.js
+function toPrimitive(t, r) {
+	if ("object" != _typeof(t) || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || "default");
+		if ("object" != _typeof(i)) return i;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return ("string" === r ? String : Number)(t);
+}
+//#endregion
+export { toPrimitive as default };

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/toPropertyKey.js

@@ -0,0 +1,9 @@
+import _typeof from "./typeof.js";
+import toPrimitive from "./toPrimitive.js";
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/toPropertyKey.js
+function toPropertyKey(t) {
+	var i = toPrimitive(t, "string");
+	return "symbol" == _typeof(i) ? i : i + "";
+}
+//#endregion
+export { toPropertyKey as default };

package/dist/es2015/_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/typeof.js

@@ -0,0 +1,11 @@
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/typeof.js
+function _typeof(o) {
+	"@babel/helpers - typeof";
+	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
+		return typeof o;
+	} : function(o) {
+		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
+	}, _typeof(o);
+}
+//#endregion
+export { _typeof as default };

package/dist/es2015/controls/bar.js

@@ -0,0 +1,227 @@
+import { el, state } from "../dom.js";
+import { namespaces } from "../namespaces.js";
+import { fullscreenButton, muteButton, pipButton, playButton, skipButton } from "./buttons.js";
+import { cueLift, cueStyle } from "./cues.js";
+import { fullscreen } from "./fullscreen.js";
+import { keys } from "./keys.js";
+import { liveButton } from "./live.js";
+import { MENUS } from "./menus.js";
+import { clusters } from "./options.js";
+import { pictureInPicture } from "./pip.js";
+import { errorScreen, startButton } from "./screens.js";
+import { seekBar } from "./seek.js";
+import { speedMenu } from "./speed.js";
+import { volumeSlider } from "./volume.js";
+//#region src/controls/bar.ts
+function controlBar(host, stage, video, options, reflect, retry) {
+	const root = el("div", "controls");
+	const flags = {};
+	let timer;
+	/** Whether the last input was a key, so focus inside is a keyboard user's and holds the bar. */
+	let keyboard = false;
+	function render() {
+		state(root, "controls", flags);
+	}
+	function flag(name, on) {
+		if (flags[name] === on) return;
+		flags[name] = on;
+		render();
+		if (name === "fullscreen") reflect(name, on);
+		if (name === "idle") cues.lifted(!on);
+		if (name === "seekable") live.seekable(on);
+	}
+	/** What keeps the bar up when the timer fires. Read then, never remembered. */
+	function held() {
+		if (video.paused) return true;
+		if (root.querySelector("[part~=\"open\"]") !== null) return true;
+		if (!keyboard) return false;
+		const active = root.getRootNode().activeElement;
+		return active !== null && root.contains(active);
+	}
+	function sleep() {
+		timer = void 0;
+		if (held()) {
+			timer = setTimeout(sleep, options.idleMs);
+			return;
+		}
+		flag("idle", true);
+	}
+	/** Shows the bar and arms the timer again. */
+	function wake() {
+		clearTimeout(timer);
+		if (flags.idle === true) flag("idle", false);
+		timer = setTimeout(sleep, options.idleMs);
+	}
+	function pointer() {
+		keyboard = false;
+		wake();
+	}
+	function key() {
+		keyboard = true;
+		wake();
+	}
+	cueStyle();
+	const cues = cueLift(video, root, host);
+	const live = liveButton(video);
+	const seek = seekBar(video, flag, options);
+	seek.root.append(live.root);
+	const screen = fullscreen(host, stage, video);
+	const start = startButton(video, flag, options.start !== 0);
+	const failure = errorScreen(retry);
+	/** An error over a picture that then plays is wrong by definition: playback resuming clears it. */
+	function played() {
+		if (failure.shown()) {
+			failure.clear();
+			start.root.hidden = !video.paused;
+		}
+	}
+	video.addEventListener("playing", played);
+	stage.append(start.root, failure.root);
+	/** The menus' places in the row, filled per session. */
+	const slots = /* @__PURE__ */ new Map();
+	let session = [];
+	/** A control by the name the layout gives it, or null for a name that is not one. */
+	function build(name) {
+		switch (name) {
+			case "skip-back": return options.skipBack > 0 ? skipButton(video, -options.skipBack) : null;
+			case "skip-forward": return options.skipForward > 0 ? skipButton(video, options.skipForward) : null;
+			case "play": return playButton(video, flag);
+			case "volume": {
+				const group = el("div", "group volume-group");
+				const sound = [muteButton(video, flag), volumeSlider(video)];
+				for (const control of sound) group.append(control.root);
+				return {
+					root: group,
+					dispose() {
+						for (const control of sound) control.dispose();
+					}
+				};
+			}
+			case "speed": return speedMenu(video);
+			case "pip": return pipButton(pictureInPicture(video), flag);
+			case "fullscreen": return fullscreenButton(screen, flag);
+			default: {
+				if (!(name in MENUS)) return null;
+				const slot = el("div", `slot ${name}-slot`);
+				slots.set(name, slot);
+				return {
+					root: slot,
+					dispose() {}
+				};
+			}
+		}
+	}
+	const row = el("div", "row buttons");
+	const cluster = el("div", "cluster");
+	const built = [];
+	const [leftNames, rightNames] = clusters(options.layout);
+	for (const name of leftNames) {
+		const control = build(name);
+		if (control === null) continue;
+		built.push(control);
+		row.append(control.root);
+	}
+	for (const name of rightNames) {
+		const control = build(name);
+		if (control === null) continue;
+		built.push(control);
+		cluster.append(control.root);
+	}
+	row.append(cluster);
+	root.append(seek.root, row);
+	const controls = [
+		...built,
+		live,
+		start,
+		failure,
+		keys({
+			host,
+			stage,
+			own: [
+				root,
+				start.root,
+				failure.root
+			],
+			video,
+			step: options.seekStep,
+			fullscreen: screen
+		}),
+		cues
+	];
+	function drop() {
+		for (const control of session) control.dispose();
+		session = [];
+		for (const slot of slots.values()) slot.replaceChildren();
+	}
+	stage.addEventListener("pointermove", pointer);
+	stage.addEventListener("pointerdown", pointer);
+	host.addEventListener("keydown", key);
+	video.addEventListener("play", wake);
+	video.addEventListener("pause", wake);
+	video.addEventListener("ended", wake);
+	wake();
+	cues.lifted(true);
+	return {
+		root,
+		attach(current) {
+			drop();
+			const engine = current.engine;
+			if (engine === null) {
+				seek.attach({});
+				live.attach(void 0);
+				return;
+			}
+			const found = namespaces(engine);
+			seek.attach({
+				live: found.live,
+				thumbnails: found.thumbnails,
+				pdt: found.pdt,
+				bufferGoal: () => engine.stats.snapshot().scheduling.bufferGoal,
+				window: () => {
+					var _engine$stats$snapsho, _engine$stats$snapsho2;
+					return (_engine$stats$snapsho = (_engine$stats$snapsho2 = engine.stats.snapshot().live) === null || _engine$stats$snapsho2 === void 0 ? void 0 : _engine$stats$snapsho2.span) !== null && _engine$stats$snapsho !== void 0 ? _engine$stats$snapsho : null;
+				}
+			});
+			live.attach(found.live);
+			for (const [name, slot] of slots) {
+				const factory = MENUS[name];
+				if (factory === void 0) continue;
+				const control = factory({
+					engine,
+					host
+				});
+				session.push(control);
+				slot.append(control.root);
+			}
+		},
+		detach() {
+			drop();
+			seek.detach();
+			live.detach();
+		},
+		error(error) {
+			failure.show(error);
+			start.root.hidden = true;
+		},
+		clearError() {
+			failure.clear();
+			start.root.hidden = options.start === 0 || !video.paused;
+		},
+		dispose() {
+			clearTimeout(timer);
+			drop();
+			seek.dispose();
+			for (const control of controls) control.dispose();
+			stage.removeEventListener("pointermove", pointer);
+			stage.removeEventListener("pointerdown", pointer);
+			host.removeEventListener("keydown", key);
+			video.removeEventListener("play", wake);
+			video.removeEventListener("pause", wake);
+			video.removeEventListener("ended", wake);
+			video.removeEventListener("playing", played);
+			root.remove();
+		}
+	};
+}
+//#endregion
+export { controlBar };