@mattebox/player-preferences 0.0.0-stage → 0.1.0

package/dist/es2015/element.js

@@ -0,0 +1,223 @@
+import { Component } from "./component.js";
+import _objectSpread2 from "./_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/objectSpread2.js";
+import { preferences } from "./store.js";
+import { best, engineChoice, nativeChoice } from "./tracks.js";
+// src/element.ts
+const SIZE = "subtitle-size";
+const BACKGROUND = "subtitle-background";
+const same = (a, b) => JSON.stringify(a) === JSON.stringify(b);
+var MbxPreferences = class extends Component {
+	static get observedAttributes() {
+		return ["storage-key"];
+	}
+	constructor() {
+		super();
+		this.store = preferences();
+		this.engine = null;
+		this.put = {};
+		this.pinned = null;
+		this.loading = true;
+		this.offEngine = null;
+		this.saved = /* @__PURE__ */ new Set();
+	}
+	attributeChangedCallback() {
+		const key = this.getAttribute("storage-key");
+		const next = preferences(key === null ? {} : { key });
+		if (next === this.store) return;
+		for (const name of this.saved) next.set(name, this.store.get(name));
+		this.saved = /* @__PURE__ */ new Set();
+		this.store = next;
+	}
+	/** Whether the element keeps `key`: every key, less the ones `except` names. */
+	keeps(key) {
+		var _this$getAttribute;
+		return !((_this$getAttribute = this.getAttribute("except")) !== null && _this$getAttribute !== void 0 ? _this$getAttribute : "").split(/\s+/).includes(key);
+	}
+	/** The stored value of `key`, or undefined when the element leaves it alone. */
+	stored(key) {
+		return this.keeps(key) ? this.store.get(key) : void 0;
+	}
+	save(key, value) {
+		if (!this.keeps(key)) return;
+		this.store.set(key, value);
+		this.saved.add(key);
+	}
+	attach(player) {
+		const video = player.video;
+		const volume = this.stored("volume");
+		if (volume !== void 0) video.volume = volume;
+		let pageMuted = player.hasAttribute("muted");
+		const muted = this.stored("muted");
+		if (muted !== void 0 && !pageMuted) video.muted = muted;
+		const look = this.stored("subtitle-look");
+		if ((look === null || look === void 0 ? void 0 : look.size) !== void 0) player.setAttribute(SIZE, look.size);
+		if ((look === null || look === void 0 ? void 0 : look.background) !== void 0) player.setAttribute(BACKGROUND, look.background);
+		this.on(video, "volumechange", () => {
+			this.save("volume", video.volume);
+			pageMuted = pageMuted && video.muted;
+			if (!pageMuted) this.save("muted", video.muted);
+		});
+		const watch = new MutationObserver(() => {
+			const size = player.getAttribute(SIZE);
+			const background = player.getAttribute(BACKGROUND);
+			this.save("subtitle-look", _objectSpread2(_objectSpread2({}, size === null ? {} : { size }), background === null ? {} : { background }));
+		});
+		watch.observe(player, {
+			attributes: true,
+			attributeFilter: [SIZE, BACKGROUND]
+		});
+		this.keep(() => {
+			watch.disconnect();
+		});
+		this.on(video, "loadstart", () => {
+			this.loading = true;
+			this.put = {};
+		});
+		this.on(video, "loadedmetadata", () => {
+			const rate = this.stored("rate");
+			if (rate !== void 0) video.playbackRate = rate;
+			this.loading = false;
+			if (this.engine === null) this.restoreNative(player);
+		});
+		this.on(video, "ratechange", () => {
+			var _this$engine, _moving$live;
+			const moving = (_this$engine = this.engine) !== null && _this$engine !== void 0 ? _this$engine : {};
+			const trick = moving.trick;
+			const live = ((_moving$live = moving.live) === null || _moving$live === void 0 ? void 0 : _moving$live.edge) != null || video.duration === Number.POSITIVE_INFINITY;
+			if (this.loading || live || trick !== void 0 && (trick.rate !== 1 || trick.scrubbing)) return;
+			this.save("rate", video.playbackRate);
+		});
+		this.on(player, "click", () => {
+			setTimeout(() => {
+				this.notePin();
+			}, 0);
+		});
+		for (const name of ["audioTracks", "textTracks"]) {
+			const list = video[name];
+			if (list !== void 0) this.on(list, "change", () => this.noteNative(player));
+		}
+		this.on(player, "sourcechange", () => {
+			this.follow(player.engine);
+		});
+		this.follow(player.engine);
+		this.keep(() => {
+			this.follow(null);
+		});
+	}
+	/** Puts the stored tracks and pin back on each engine once its manifest lists them, and saves the viewer's changes. */
+	follow(engine) {
+		var _this$offEngine;
+		(_this$offEngine = this.offEngine) === null || _this$offEngine === void 0 || _this$offEngine.call(this);
+		this.offEngine = null;
+		this.engine = engine;
+		if (engine === null) return;
+		let offChanged = () => void 0;
+		let offSelected = () => void 0;
+		const ready = () => {
+			offChanged();
+			this.restoreEngine(engine);
+			offSelected = engine.on("tracks:selected", () => {
+				this.noteEngine(engine);
+			});
+		};
+		if (engine.tracks.available.length > 0) ready();
+		else offChanged = engine.on("tracks:changed", ready);
+		this.offEngine = () => {
+			offChanged();
+			offSelected();
+		};
+	}
+	restoreEngine(engine) {
+		const tracks = engine.tracks;
+		for (const kind of ["audio", "subtitles"]) {
+			const type = kind === "audio" ? "audio" : "text";
+			const list = tracks.available.filter((track) => track.contentType === type && tracks.selectable(track.id) && !track.forced);
+			const wanted = this.stored(kind);
+			this.put[kind] = this.engineActive(engine, kind);
+			if (wanted === null) {
+				var _tracks$active$forced, _tracks$active;
+				if (!((_tracks$active$forced = (_tracks$active = tracks.active("text")) === null || _tracks$active === void 0 ? void 0 : _tracks$active.forced) !== null && _tracks$active$forced !== void 0 ? _tracks$active$forced : false)) tracks.deselect("text");
+				this.put[kind] = null;
+			} else if (wanted !== void 0) {
+				const active = tracks.active(type);
+				const pick = list[best(list.map(engineChoice), wanted, active === null ? -1 : list.indexOf(active))];
+				if (pick !== void 0) {
+					tracks.select(pick.id);
+					this.put[kind] = engineChoice(pick);
+				}
+			}
+		}
+		const height = this.stored("quality");
+		const quality = engine.quality;
+		if (typeof height === "number") {
+			var _fit$find;
+			const fit = [...quality.selectable].filter((rendition) => rendition.height !== void 0).sort((a, b) => b.height - a.height);
+			const pick = (_fit$find = fit.find((rendition) => rendition.height <= height)) !== null && _fit$find !== void 0 ? _fit$find : fit[fit.length - 1];
+			if (pick !== void 0) {
+				quality.pin(pick.id);
+				this.pinned = pick.id;
+				return;
+			}
+		}
+		this.pinned = quality.pinned;
+	}
+	/** The active track of `kind` as a choice: null for subtitles off, or for a forced track. */
+	engineActive(engine, kind) {
+		const track = engine.tracks.active(kind === "audio" ? "audio" : "text");
+		return track === null || track.forced === true ? null : engineChoice(track);
+	}
+	noteEngine(engine) {
+		for (const kind of ["audio", "subtitles"]) {
+			const now = this.engineActive(engine, kind);
+			if (kind === "subtitles" && now === null && engine.tracks.active("text") !== null) continue;
+			if (kind === "audio" && now === null) continue;
+			if (same(now, this.put[kind])) continue;
+			this.put[kind] = now;
+			this.save(kind, now);
+		}
+	}
+	notePin() {
+		var _this$engine2, _quality$renditions$f;
+		const quality = (_this$engine2 = this.engine) === null || _this$engine2 === void 0 ? void 0 : _this$engine2.quality;
+		if (quality === void 0 || quality.pinned === this.pinned) return;
+		this.pinned = quality.pinned;
+		const height = (_quality$renditions$f = quality.renditions.find((rendition) => rendition.id === this.pinned)) === null || _quality$renditions$f === void 0 ? void 0 : _quality$renditions$f.height;
+		this.save("quality", height !== null && height !== void 0 ? height : null);
+	}
+	/** The native session's audio and subtitle tracks, as Safari lists them. */
+	native(player, kind) {
+		const name = kind === "audio" ? "audioTracks" : "textTracks";
+		const list = player.video[name];
+		const tracks = list === void 0 ? [] : Array.from(list);
+		return kind === "audio" ? tracks : tracks.filter((track) => track.kind === "subtitles" || track.kind === "captions");
+	}
+	nativeActive(player, kind) {
+		const on = this.native(player, kind).find((track) => kind === "audio" ? track.enabled === true : track.mode === "showing");
+		return on === void 0 ? null : nativeChoice(on);
+	}
+	restoreNative(player) {
+		for (const kind of ["audio", "subtitles"]) {
+			const tracks = this.native(player, kind);
+			const wanted = this.stored(kind);
+			if (wanted !== void 0 && tracks.length > 0) {
+				const choices = tracks.map(nativeChoice);
+				const index = wanted === null ? -1 : best(choices, wanted);
+				if (index !== -1 || kind === "subtitles" && wanted === null) tracks.forEach((track, at) => {
+					if (kind === "audio") track.enabled = at === index;
+					else track.mode = at === index ? "showing" : "disabled";
+				});
+			}
+			this.put[kind] = this.nativeActive(player, kind);
+		}
+	}
+	noteNative(player) {
+		if (this.engine !== null || this.loading) return;
+		for (const kind of ["audio", "subtitles"]) {
+			const now = this.nativeActive(player, kind);
+			if (kind === "audio" && now === null || same(now, this.put[kind])) continue;
+			this.put[kind] = now;
+			this.save(kind, now);
+		}
+	}
+};
+export { MbxPreferences };

package/dist/es2015/host.js

@@ -0,0 +1,18 @@
+// src/host.ts
+const PLAYER = "mattebox-player";
+/** The parent, or the host of the shadow root `node` sits in, or null at the document. */
+function above(node) {
+	const parent = node.parentNode;
+	if (parent !== null) return parent;
+	return node instanceof ShadowRoot ? node.host : null;
+}
+/** The nearest player above `node`, or null outside one. It may not be upgraded yet. */
+function findPlayer(node) {
+	let current = node;
+	while (current !== null) {
+		if (current instanceof HTMLElement && current.localName === "mattebox-player") return current;
+		current = above(current);
+	}
+	return null;
+}
+export { PLAYER, above, findPlayer };

package/dist/es2015/index.js

@@ -0,0 +1,18 @@
+import { preferences } from "./store.js";
+import { MbxPreferences } from "./element.js";
+// src/index.ts
+/**
+* @mattebox/player-preferences: the viewer's preferences, as a store that
+* every player and every element of the page reads and writes, and
+* <mbx-preferences>, which keeps the player's own choices in it. Importing
+* this module registers the element; that is the package's one side
+* effect. A page without it stores nothing.
+*/
+const PREFERENCES = "mbx-preferences";
+/** The store of the `<mbx-preferences>` inside `player`, or null without one. */
+function preferencesOf(player) {
+	var _player$querySelector, _player$querySelector2;
+	return (_player$querySelector = (_player$querySelector2 = player.querySelector("mbx-preferences")) === null || _player$querySelector2 === void 0 ? void 0 : _player$querySelector2.store) !== null && _player$querySelector !== void 0 ? _player$querySelector : null;
+}
+if (customElements.get("mbx-preferences") === void 0) customElements.define(PREFERENCES, MbxPreferences);
+export { MbxPreferences, PREFERENCES, preferences, preferencesOf };

package/dist/es2015/store.js

@@ -0,0 +1,70 @@
+import _objectSpread2 from "./_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/objectSpread2.js";
+// src/store.ts
+/** The format of the stored entry. An entry of another version is ignored. */
+const VERSION = 1;
+/** By storage key, and by the empty key for the memory store. */
+const stores = /* @__PURE__ */ new Map();
+function read(storage, key) {
+	try {
+		var _storage$getItem;
+		const entry = JSON.parse((_storage$getItem = storage === null || storage === void 0 ? void 0 : storage.getItem(key)) !== null && _storage$getItem !== void 0 ? _storage$getItem : "null");
+		return (entry === null || entry === void 0 ? void 0 : entry.version) === VERSION && typeof entry.values === "object" && entry.values !== null ? entry.values : {};
+	} catch (_unused) {
+		return {};
+	}
+}
+function defaultStorage() {
+	try {
+		return window.localStorage;
+	} catch (_unused2) {
+		return null;
+	}
+}
+/** The store for `options.key`: the same object for the same key. The first call's `storage` applies. */
+function preferences(options = {}) {
+	var _options$key, _options$storage;
+	const key = (_options$key = options.key) !== null && _options$key !== void 0 ? _options$key : "";
+	const known = stores.get(key);
+	if (known !== void 0) return known;
+	const storage = key === "" ? null : (_options$storage = options.storage) !== null && _options$storage !== void 0 ? _options$storage : defaultStorage();
+	let values = read(storage, key);
+	const listeners = /* @__PURE__ */ new Map();
+	const tell = (name) => {
+		var _listeners$get;
+		for (const fn of (_listeners$get = listeners.get(name)) !== null && _listeners$get !== void 0 ? _listeners$get : []) fn(values[name]);
+	};
+	if (storage !== null && typeof window !== "undefined") window.addEventListener("storage", (event) => {
+		if (event.key !== key || event.storageArea !== storage) return;
+		const before = values;
+		values = read(storage, key);
+		for (const name of /* @__PURE__ */ new Set([...Object.keys(before), ...Object.keys(values)])) if (JSON.stringify(before[name]) !== JSON.stringify(values[name])) tell(name);
+	});
+	const store = {
+		get: (name) => values[name],
+		set(name, value) {
+			if (JSON.stringify(values[name]) === JSON.stringify(value)) return;
+			values = _objectSpread2({}, values);
+			if (value === void 0) delete values[name];
+			else values[name] = value;
+			try {
+				storage === null || storage === void 0 || storage.setItem(key, JSON.stringify({
+					version: VERSION,
+					values
+				}));
+			} catch (_unused3) {}
+			tell(name);
+		},
+		on(name, fn) {
+			var _listeners$get2;
+			const set = (_listeners$get2 = listeners.get(name)) !== null && _listeners$get2 !== void 0 ? _listeners$get2 : /* @__PURE__ */ new Set();
+			listeners.set(name, set);
+			set.add(fn);
+			return () => {
+				set.delete(fn);
+			};
+		}
+	};
+	stores.set(key, store);
+	return store;
+}
+export { preferences };

package/dist/es2015/tracks.js

@@ -0,0 +1,45 @@
+import { isAudioDescription, isEnhancedSpeech, isSdh } from "mattebox";
+// src/tracks.ts
+/** The kinds a viewer keeps across languages. */
+const ACCESS = ["description", "enhanced-speech"];
+/** The primary language subtag, so `de-CH` and `de` are the same language (RFC 5646 §2.2.1). */
+function primary(tag) {
+	return tag.toLowerCase().split("-")[0];
+}
+function score(track, wanted) {
+	const language = wanted.language !== "" && primary(track.language) === primary(wanted.language);
+	const kind = track.kind === wanted.kind;
+	if (language) return kind ? 3 : 2;
+	return kind && ACCESS.includes(wanted.kind) ? 1 : 0;
+}
+/** The index of the best match for `wanted`, or -1 when none scores. `current` wins a tie. */
+function best(tracks, wanted, current = -1) {
+	let found = -1;
+	let top = 0;
+	tracks.forEach((track, index) => {
+		const points = score(track, wanted);
+		if (points > top || points === top && points > 0 && index === current) {
+			found = index;
+			top = points;
+		}
+	});
+	return found;
+}
+/** An engine track as a choice, its kind from the manifest's standard signals. */
+function engineChoice(track) {
+	var _track$lang;
+	const kind = track.contentType === "text" ? isSdh(track) ? "captions" : "subtitles" : isAudioDescription(track) ? "description" : isEnhancedSpeech(track) ? "enhanced-speech" : "main";
+	return {
+		language: (_track$lang = track.lang) !== null && _track$lang !== void 0 ? _track$lang : "",
+		kind
+	};
+}
+/** A native `AudioTrack` or `TextTrack` as a choice, from HTML's kinds. */
+function nativeChoice(track) {
+	const kind = track.kind === "main-desc" ? "description" : track.kind || "main";
+	return {
+		language: track.language,
+		kind
+	};
+}
+export { best, engineChoice, nativeChoice, score };

package/dist/host.d.ts

@@ -0,0 +1,14 @@
+/**
+ * The contract of a control of the page's own, as guide chapter 03 of the
+ * player states it: the nearest <mattebox-player> above, through shadow
+ * hosts. This package implements the contract from outside, as the cast
+ * package does: the player exports no base class.
+ */
+import type { PlayerHost } from '@mattebox/player';
+export type { PlayerHost };
+export declare const PLAYER = "mattebox-player";
+/** The parent, or the host of the shadow root `node` sits in, or null at the document. */
+export declare function above(node: Node): Node | null;
+/** The nearest player above `node`, or null outside one. It may not be upgraded yet. */
+export declare function findPlayer(node: Node): HTMLElement | null;
+//# sourceMappingURL=host.d.ts.map

package/dist/host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"host.d.ts","sourceRoot":"","sources":["../src/host.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,YAAY,EAAE,UAAU,EAAE,CAAC;AAE3B,eAAO,MAAM,MAAM,oBAAoB,CAAC;AAExC,0FAA0F;AAC1F,wBAAgB,KAAK,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAI7C;AAED,wFAAwF;AACxF,wBAAgB,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,WAAW,GAAG,IAAI,CAOzD"}

package/dist/host.js

@@ -0,0 +1,19 @@
+export const PLAYER = 'mattebox-player';
+/** The parent, or the host of the shadow root `node` sits in, or null at the document. */
+export function above(node) {
+    const parent = node.parentNode;
+    if (parent !== null)
+        return parent;
+    return node instanceof ShadowRoot ? node.host : null;
+}
+/** The nearest player above `node`, or null outside one. It may not be upgraded yet. */
+export function findPlayer(node) {
+    let current = node;
+    while (current !== null) {
+        if (current instanceof HTMLElement && current.localName === PLAYER)
+            return current;
+        current = above(current);
+    }
+    return null;
+}
+//# sourceMappingURL=host.js.map

package/dist/host.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"host.js","sourceRoot":"","sources":["../src/host.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,MAAM,GAAG,iBAAiB,CAAC;AAExC,0FAA0F;AAC1F,MAAM,UAAU,KAAK,CAAC,IAAU;IAC9B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC;IAC/B,IAAI,MAAM,KAAK,IAAI;QAAE,OAAO,MAAM,CAAC;IACnC,OAAO,IAAI,YAAY,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;AACvD,CAAC;AAED,wFAAwF;AACxF,MAAM,UAAU,UAAU,CAAC,IAAU;IACnC,IAAI,OAAO,GAAgB,IAAI,CAAC;IAChC,OAAO,OAAO,KAAK,IAAI,EAAE,CAAC;QACxB,IAAI,OAAO,YAAY,WAAW,IAAI,OAAO,CAAC,SAAS,KAAK,MAAM;YAAE,OAAO,OAAO,CAAC;QACnF,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC;IAC3B,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @mattebox/player-preferences: the viewer's preferences, as a store that
+ * every player and every element of the page reads and writes, and
+ * <mbx-preferences>, which keeps the player's own choices in it. Importing
+ * this module registers the element; that is the package's one side
+ * effect. A page without it stores nothing.
+ */
+import { MbxPreferences } from './element.js';
+import type { PreferenceStore } from './store.js';
+export { MbxPreferences } from './element.js';
+export type { PreferenceOptions, PreferenceStorage, PreferenceStore, Preferences, SubtitleLook, TrackChoice, } from './store.js';
+export { preferences } from './store.js';
+export declare const PREFERENCES = "mbx-preferences";
+/** The store of the `<mbx-preferences>` inside `player`, or null without one. */
+export declare function preferencesOf(player: Element): PreferenceStore | null;
+declare global {
+    interface HTMLElementTagNameMap {
+        'mbx-preferences': MbxPreferences;
+    }
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,YAAY,EACZ,WAAW,GACZ,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzC,eAAO,MAAM,WAAW,oBAAoB,CAAC;AAE7C,iFAAiF;AACjF,wBAAgB,aAAa,CAAC,MAAM,EAAE,OAAO,GAAG,eAAe,GAAG,IAAI,CAErE;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,cAAc,CAAC;KACnC;CACF"}

package/dist/index.js

@@ -0,0 +1,19 @@
+/**
+ * @mattebox/player-preferences: the viewer's preferences, as a store that
+ * every player and every element of the page reads and writes, and
+ * <mbx-preferences>, which keeps the player's own choices in it. Importing
+ * this module registers the element; that is the package's one side
+ * effect. A page without it stores nothing.
+ */
+import { MbxPreferences } from './element.js';
+export { MbxPreferences } from './element.js';
+export { preferences } from './store.js';
+export const PREFERENCES = 'mbx-preferences';
+/** The store of the `<mbx-preferences>` inside `player`, or null without one. */
+export function preferencesOf(player) {
+    return player.querySelector(PREFERENCES)?.store ?? null;
+}
+if (customElements.get(PREFERENCES) === undefined) {
+    customElements.define(PREFERENCES, MbxPreferences);
+}
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAS9C,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzC,MAAM,CAAC,MAAM,WAAW,GAAG,iBAAiB,CAAC;AAE7C,iFAAiF;AACjF,MAAM,UAAU,aAAa,CAAC,MAAe;IAC3C,OAAO,MAAM,CAAC,aAAa,CAAiB,WAAW,CAAC,EAAE,KAAK,IAAI,IAAI,CAAC;AAC1E,CAAC;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,SAAS,EAAE,CAAC;IAClD,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;AACrD,CAAC"}

package/dist/store.d.ts

@@ -0,0 +1,62 @@
+/**
+ * The viewer's preferences: one store per storage key, shared by every
+ * player on the page and by the page's own elements. A store without a key
+ * keeps its values in memory, for as long as the page is open. A store
+ * with one keeps them in localStorage, or in the storage the page gives,
+ * under that key, and hears the writes of the page's other tabs. Every
+ * storage call sits in `try`: a browser that blocks storage keeps the
+ * values in memory instead.
+ */
+/** A track the viewer chose: its language, and its kind in HTML's words. */
+export interface TrackChoice {
+    readonly language: string;
+    /** `main`, `description` or `enhanced-speech` for audio; `subtitles` or `captions` for text. */
+    readonly kind: string;
+}
+/** The look of the subtitles: the player's `subtitle-size` and `subtitle-background`. */
+export interface SubtitleLook {
+    readonly size?: string;
+    readonly background?: string;
+}
+/**
+ * Every key a store holds, with its type. A package of your own adds its
+ * keys through declaration merging, under a prefix of its name:
+ *
+ * ```ts
+ * declare module '@mattebox/player-preferences' {
+ *   interface Preferences {
+ *     'my-app.theme': 'dark' | 'light';
+ *   }
+ * }
+ * ```
+ */
+export interface Preferences {
+    volume: number;
+    muted: boolean;
+    rate: number;
+    /** The height of the quality the viewer pinned, or null for Auto. */
+    quality: number | null;
+    audio: TrackChoice;
+    /** Null for subtitles off. */
+    subtitles: TrackChoice | null;
+    'subtitle-look': SubtitleLook;
+}
+/** Where a store keeps its values: localStorage, sessionStorage, or an object of your own with these two methods. */
+export type PreferenceStorage = Pick<Storage, 'getItem' | 'setItem'>;
+export interface PreferenceStore {
+    /** The value of `key`, or undefined when the viewer has none. */
+    get<K extends keyof Preferences>(key: K): Preferences[K] | undefined;
+    /** Sets `key`. Undefined removes it. */
+    set<K extends keyof Preferences>(key: K, value: Preferences[K] | undefined): void;
+    /** Calls `fn` when `key` changes, here or in another tab, until the returned function runs. */
+    on<K extends keyof Preferences>(key: K, fn: (value: Preferences[K] | undefined) => void): () => void;
+}
+export interface PreferenceOptions {
+    /** The storage key. Without one, the store keeps its values in memory. */
+    readonly key?: string;
+    /** The storage under `key`. localStorage by default. */
+    readonly storage?: PreferenceStorage;
+}
+/** The store for `options.key`: the same object for the same key. The first call's `storage` applies. */
+export declare function preferences(options?: PreferenceOptions): PreferenceStore;
+//# sourceMappingURL=store.d.ts.map

package/dist/store.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../src/store.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,4EAA4E;AAC5E,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,gGAAgG;IAChG,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED,yFAAyF;AACzF,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,qEAAqE;IACrE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,WAAW,CAAC;IACnB,8BAA8B;IAC9B,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;IAC9B,eAAe,EAAE,YAAY,CAAC;CAC/B;AAED,qHAAqH;AACrH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,OAAO,EAAE,SAAS,GAAG,SAAS,CAAC,CAAC;AAErE,MAAM,WAAW,eAAe;IAC9B,iEAAiE;IACjE,GAAG,CAAC,CAAC,SAAS,MAAM,WAAW,EAAE,GAAG,EAAE,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IACrE,wCAAwC;IACxC,GAAG,CAAC,CAAC,SAAS,MAAM,WAAW,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC;IAClF,+FAA+F;IAC/F,EAAE,CAAC,CAAC,SAAS,MAAM,WAAW,EAC5B,GAAG,EAAE,CAAC,EACN,EAAE,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,SAAS,KAAK,IAAI,GAC9C,MAAM,IAAI,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,0EAA0E;IAC1E,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,wDAAwD;IACxD,QAAQ,CAAC,OAAO,CAAC,EAAE,iBAAiB,CAAC;CACtC;AAgCD,yGAAyG;AACzG,wBAAgB,WAAW,CAAC,OAAO,GAAE,iBAAsB,GAAG,eAAe,CA8C5E"}

package/dist/store.js

@@ -0,0 +1,89 @@
+/**
+ * The viewer's preferences: one store per storage key, shared by every
+ * player on the page and by the page's own elements. A store without a key
+ * keeps its values in memory, for as long as the page is open. A store
+ * with one keeps them in localStorage, or in the storage the page gives,
+ * under that key, and hears the writes of the page's other tabs. Every
+ * storage call sits in `try`: a browser that blocks storage keeps the
+ * values in memory instead.
+ */
+/** The format of the stored entry. An entry of another version is ignored. */
+const VERSION = 1;
+/** By storage key, and by the empty key for the memory store. */
+const stores = new Map();
+function read(storage, key) {
+    try {
+        const entry = JSON.parse(storage?.getItem(key) ?? 'null');
+        return entry?.version === VERSION && typeof entry.values === 'object' && entry.values !== null
+            ? entry.values
+            : {};
+    }
+    catch {
+        return {};
+    }
+}
+function defaultStorage() {
+    try {
+        return window.localStorage;
+    }
+    catch {
+        return null;
+    }
+}
+/** The store for `options.key`: the same object for the same key. The first call's `storage` applies. */
+export function preferences(options = {}) {
+    const key = options.key ?? '';
+    const known = stores.get(key);
+    if (known !== undefined)
+        return known;
+    const storage = key === '' ? null : (options.storage ?? defaultStorage());
+    let values = read(storage, key);
+    const listeners = new Map();
+    const tell = (name) => {
+        for (const fn of listeners.get(name) ?? [])
+            fn(values[name]);
+    };
+    // Another tab wrote the entry: take its values, and tell what changed.
+    if (storage !== null && typeof window !== 'undefined') {
+        window.addEventListener('storage', (event) => {
+            if (event.key !== key || event.storageArea !== storage)
+                return;
+            const before = values;
+            values = read(storage, key);
+            for (const name of new Set([...Object.keys(before), ...Object.keys(values)])) {
+                if (JSON.stringify(before[name]) !== JSON.stringify(values[name]))
+                    tell(name);
+            }
+        });
+    }
+    const store = {
+        get: (name) => values[name],
+        set(name, value) {
+            if (JSON.stringify(values[name]) === JSON.stringify(value))
+                return;
+            values = { ...values };
+            if (value === undefined)
+                delete values[name];
+            else
+                values[name] = value;
+            try {
+                storage?.setItem(key, JSON.stringify({ version: VERSION, values }));
+            }
+            catch {
+                // Full or blocked: the value stays in memory for this page.
+            }
+            tell(name);
+        },
+        on(name, fn) {
+            const set = listeners.get(name) ?? new Set();
+            listeners.set(name, set);
+            set.add(fn);
+            return () => {
+                set.delete(fn);
+            };
+        },
+    };
+    stores.set(key, store);
+    return store;
+}
+//# sourceMappingURL=store.js.map

package/dist/store.js.map

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

package/dist/tracks.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Which track of a new programme matches the one the viewer chose last:
+ * the same language and kind scores 3, the same language 2. The same kind
+ * alone scores 1 only for audio made for access, an audio description or
+ * enhanced speech, which a viewer who needs it keeps over the language.
+ * The first track with the highest score wins, and no score keeps the
+ * engine's choice.
+ */
+import type { Track } from 'mattebox';
+import type { TrackChoice } from './store.js';
+export declare function score(track: TrackChoice, wanted: TrackChoice): number;
+/** The index of the best match for `wanted`, or -1 when none scores. `current` wins a tie. */
+export declare function best(tracks: readonly TrackChoice[], wanted: TrackChoice, current?: number): number;
+/** An engine track as a choice, its kind from the manifest's standard signals. */
+export declare function engineChoice(track: Track): TrackChoice;
+/** A native `AudioTrack` or `TextTrack` as a choice, from HTML's kinds. */
+export declare function nativeChoice(track: {
+    readonly kind: string;
+    readonly language: string;
+}): TrackChoice;
+//# sourceMappingURL=tracks.d.ts.map

package/dist/tracks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tracks.d.ts","sourceRoot":"","sources":["../src/tracks.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEtC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAU9C,wBAAgB,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,GAAG,MAAM,CAKrE;AAED,8FAA8F;AAC9F,wBAAgB,IAAI,CAAC,MAAM,EAAE,SAAS,WAAW,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,SAAK,GAAG,MAAM,CAW9F;AAED,kFAAkF;AAClF,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,WAAW,CAYtD;AAED,2EAA2E;AAC3E,wBAAgB,YAAY,CAAC,KAAK,EAAE;IAClC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;CAC3B,GAAG,WAAW,CAId"}