@vplayer/core 0.1.6 → 0.1.8

package/dist/defaults.d.ts

@@ -1,4 +1,2 @@
-import type { PlayerIcons, PlayerLabels } from './types';
+import type { PlayerLabels } from './types';
 export declare const defaultPlayerLabels: PlayerLabels;
-/** @see https://iconify.design/icon-sets/lucide/ */
-export declare const defaultPlayerIcons: PlayerIcons;

package/dist/index.d.ts

@@ -15,9 +15,9 @@ export type { PlayerSource, SourceKind } from './source-resolver';
 export { canUseMSE, canUseNativeHLS, canUseFullscreen, canUsePictureInPicture, canUseTextTracks, getMediaCapabilities, isFiniteDuration, } from './media-capabilities';
 export type { MediaCapabilitiesSnapshot } from './media-capabilities';
 export { formatTime } from './utils';
-export { defaultPlayerLabels, defaultPlayerIcons } from './defaults';
+export { defaultPlayerLabels } from './defaults';
 export { BaseMediaEngine, NativeVideoEngine, HlsMediaEngine, DashMediaEngine } from './media-engine';
 export type { MediaEngine, MediaEngineDimensions, MediaEngineError, MediaEngineEvent, MediaEngineEventHandler, HlsMediaEngineOptions, DashMediaEngineOptions, } from './media-engine';
 export { createMediaStore, getInitialMediaState, selectMedia, selectAudio, selectPreferences, selectUI, selectPlugins, selectThumbnails, selectError, } from './state/slices';
-export type { PlayerOptions, TransformThumbnailVTT, MediaState, MediaRemote, PlayerLabels, PlayerIcons, SvgIcon, PlayerInstance, PlayerSystems, PlayerError, PlaybackStatus, } from './types';
+export type { PlayerOptions, TransformThumbnailVTT, MediaState, MediaRemote, PlayerLabels, PlayerInstance, PlayerSystems, PlayerError, PlaybackStatus, } from './types';
 export type { ControlRegistration, SettingRegistration, LayerRegistration, ContextMenuItem, ContextMenuRegistration, PlayerPlugin, PluginAPI, RemoteRef, PlayerContextRef, FlipState, AspectRatioState, SettingItem, } from './plugin-api';

package/dist/index.js

@@ -726,61 +726,77 @@ function J(e) {
 function Y(e) {
 	let r = x(), i = { ...e }, o = new t(), s = new j(), c = new a(i.lang);
 	i.translations && c.addTranslations(i.lang ?? "en", i.translations);
-	let l = new n(), u = i.reconnectMax ?? 3, p = i.reconnectSleep ?? 1500, m = null, h = null, g = null, _ = null, v = null, S = 0, C = null;
-	function w() {
+	let l = new n(), u = i.reconnectMax ?? 3, p = i.reconnectSleep ?? 1500, m = null, h = null, g = null, _ = null, v = null, S = 0, C = null, w = null;
+	function T() {
+		w && typeof navigator < "u" && "mediaSession" in navigator && navigator.mediaSession.metadata === w && (navigator.mediaSession.metadata = null), w = null;
+	}
+	function E() {
+		if (typeof navigator > "u" || !("mediaSession" in navigator) || typeof MediaMetadata > "u") return;
+		let e = i.title?.trim();
+		if (!e) {
+			T();
+			return;
+		}
+		let t = new MediaMetadata({
+			title: e,
+			artwork: i.poster ? [{ src: i.poster }] : []
+		});
+		navigator.mediaSession.metadata = t, w = t;
+	}
+	function D() {
 		l.register({
 			key: "Space",
 			description: "Toggle play/pause",
 			handler: (e) => {
-				e.preventDefault(), E.togglePlay();
+				e.preventDefault(), k.togglePlay();
 			}
 		}), l.register({
 			key: "KeyK",
 			description: "Toggle play/pause",
 			handler: (e) => {
-				e.preventDefault(), E.togglePlay();
+				e.preventDefault(), k.togglePlay();
 			}
 		}), l.register({
 			key: "KeyL",
 			description: "Toggle loop",
 			handler: (e) => {
-				e.preventDefault(), E.toggleLoop();
+				e.preventDefault(), k.toggleLoop();
 			}
 		}), l.register({
 			key: "KeyI",
 			description: "Toggle info panel",
 			handler: (e) => {
-				e.preventDefault(), E.toggleInfoPanel();
+				e.preventDefault(), k.toggleInfoPanel();
 			}
 		}), l.register({
 			key: "KeyF",
 			description: "Toggle fullscreen",
 			handler: (e) => {
-				e.preventDefault(), E.toggleFullscreen();
+				e.preventDefault(), k.toggleFullscreen();
 			}
 		}), l.register({
 			key: "KeyA",
 			description: "Cycle aspect ratio",
 			handler: (e) => {
-				e.preventDefault(), E.cycleAspectRatio();
+				e.preventDefault(), k.cycleAspectRatio();
 			}
 		}), l.register({
 			key: "KeyM",
 			description: "Toggle mute",
 			handler: (e) => {
-				e.preventDefault(), E.toggleMute();
+				e.preventDefault(), k.toggleMute();
 			}
 		}), l.register({
 			key: "ArrowLeft",
 			description: "Seek backward 5s",
 			handler: (e) => {
-				e.preventDefault(), E.skip(-5);
+				e.preventDefault(), k.skip(-5);
 			}
 		}), l.register({
 			key: "ArrowRight",
 			description: "Seek forward 5s",
 			handler: (e) => {
-				e.preventDefault(), E.skip(5);
+				e.preventDefault(), k.skip(5);
 			}
 		}), l.register({
 			key: "ArrowUp",
@@ -788,7 +804,7 @@ function Y(e) {
 			handler: (e) => {
 				e.preventDefault();
 				let t = Math.min(1, r.state.volume + .1);
-				E.setVolume(t);
+				k.setVolume(t);
 			}
 		}), l.register({
 			key: "ArrowDown",
@@ -796,12 +812,12 @@ function Y(e) {
 			handler: (e) => {
 				e.preventDefault();
 				let t = Math.max(0, r.state.volume - .1);
-				E.setVolume(t);
+				k.setVolume(t);
 			}
 		});
 	}
-	i.defaultHotkeys !== !1 && w();
-	function T() {
+	i.defaultHotkeys !== !1 && D();
+	function O() {
 		if (typeof document > "u") return;
 		let e = document;
 		r.setState((t) => ({
@@ -810,7 +826,7 @@ function Y(e) {
 			capabilities: d(h?.element ?? void 0, m)
 		}));
 	}
-	let E = {
+	let k = {
 		play: () => {
 			h?.play();
 		},
@@ -853,7 +869,7 @@ function Y(e) {
 		toggleFullscreen: () => {
 			if (!m || typeof document > "u") return;
 			let e = m, t = document, n = !!(document.fullscreenElement || t.webkitFullscreenElement), r = () => {
-				m?.focus({ preventScroll: !0 }), T();
+				m?.focus({ preventScroll: !0 }), O();
 			}, i = n ? typeof document.exitFullscreen == "function" ? document.exitFullscreen() : t.webkitExitFullscreen?.() : typeof m.requestFullscreen == "function" ? m.requestFullscreen() : e.webkitRequestFullscreen?.();
 			Promise.resolve(i).then(r, r);
 		},
@@ -901,7 +917,7 @@ function Y(e) {
 		},
 		cycleAspectRatio: () => {
 			let e = r.state.aspectRatio, t = U[(U.indexOf(e) + 1) % U.length] ?? "default";
-			E.setAspectRatio(t);
+			k.setAspectRatio(t);
 		},
 		toggleLoop: () => {
 			let e = h;
@@ -917,10 +933,10 @@ function Y(e) {
 			}));
 		}
 	};
-	function D(e) {
+	function A(e) {
 		return [
 			e.on("play", () => {
-				r.setState((e) => ({
+				E(), r.setState((e) => ({
 					...e,
 					status: "playing",
 					isPlaying: !0,
@@ -1069,8 +1085,8 @@ function Y(e) {
 			})
 		];
 	}
-	function O() {
-		k(), _ = setInterval(() => {
+	function N() {
+		P(), _ = setInterval(() => {
 			let e = h;
 			e && s.set(M.PLAYBACK_PROGRESS, {
 				time: e.currentTime,
@@ -1078,14 +1094,14 @@ function Y(e) {
 			});
 		}, 5e3);
 	}
-	function k() {
+	function P() {
 		_ !== null && (clearInterval(_), _ = null);
 	}
-	let A = r.subscribe(() => {
+	let F = r.subscribe(() => {
 		let e = r.state;
-		e.isPlaying && e.duration > 0 ? _ === null && O() : k();
-	}), N = null;
-	function P() {
+		e.isPlaying && e.duration > 0 ? _ === null && N() : P();
+	}), I = null;
+	function L() {
 		if (!i.persistPreferences) return;
 		let e = s.get(M.VOLUME), t = s.get(M.MUTED), n = s.get(M.PLAYBACK_RATE), a = s.get(M.LOOP), o = s.get(M.FLIP), c = s.get(M.ASPECT_RATIO);
 		r.setState((r) => ({
@@ -1096,15 +1112,15 @@ function Y(e) {
 			isLooping: a ?? r.isLooping,
 			flip: o ?? r.flip,
 			aspectRatio: q(c)
-		})), N = r.subscribe(() => {
+		})), I = r.subscribe(() => {
 			let e = r.state;
 			e.volume !== 1 && s.set(M.VOLUME, e.volume), e.isMuted && s.set(M.MUTED, !0), e.playbackRate !== 1 && s.set(M.PLAYBACK_RATE, e.playbackRate), e.isLooping ? s.set(M.LOOP, !0) : s.remove(M.LOOP), e.flip === "normal" ? s.remove(M.FLIP) : s.set(M.FLIP, e.flip), e.aspectRatio === "default" ? s.remove(M.ASPECT_RATIO) : s.set(M.ASPECT_RATIO, e.aspectRatio);
 		});
 	}
-	function F() {
-		N &&= (N(), null);
+	function R() {
+		I &&= (I(), null);
 	}
-	function I(e) {
+	function z(e) {
 		if (C?.abort(), C = null, !e) {
 			r.setState((e) => ({
 				...e,
@@ -1125,11 +1141,11 @@ function Y(e) {
 			})));
 		});
 	}
-	function L(e) {
+	function B(e) {
 		return {
 			name: e,
 			store: r,
-			remote: E,
+			remote: k,
 			events: o,
 			storage: s,
 			hotkeys: l,
@@ -1208,15 +1224,15 @@ function Y(e) {
 			}
 		};
 	}
-	let R = [];
-	function z() {
+	let H = [];
+	function Y() {
 		v !== null && (clearTimeout(v), v = null), S = 0;
-		for (let e of R) e();
-		R = [], h && (h.destroy(), h = null, Y.engine = null);
+		for (let e of H) e();
+		H = [], h && (h.destroy(), h = null, Q.engine = null);
 	}
-	function B(e) {
+	function X(e) {
 		let t = y(i), n = b(e, i);
-		h = n, Y.engine = n, R = D(n), e.playsInline = !0, e.autoplay = !!i.autoPlay, e.preload = e.preload || "metadata", r.setState((n) => ({
+		h = n, Q.engine = n, H = A(n), e.playsInline = !0, e.autoplay = !!i.autoPlay, e.preload = e.preload || "metadata", r.setState((n) => ({
 			...n,
 			status: "loading",
 			source: t,
@@ -1231,16 +1247,16 @@ function Y(e) {
 			error: null
 		})), i.autoPlay && n.play();
 	}
-	function H() {
+	function Z() {
 		let e = h?.element;
 		if (e) {
-			for (z(), e.pause(), e.removeAttribute("src"); e.firstChild;) e.removeChild(e.firstChild);
-			e.load(), B(e);
+			for (Y(), e.pause(), e.removeAttribute("src"); e.firstChild;) e.removeChild(e.firstChild);
+			e.load(), X(e);
 		}
 	}
-	let Y = {
+	let Q = {
 		store: r,
-		remote: E,
+		remote: k,
 		events: o,
 		storage: s,
 		i18n: c,
@@ -1251,7 +1267,7 @@ function Y(e) {
 			i = {
 				...i,
 				...e
-			}, r.setState((t) => {
+			}, (r.state.isPlaying || w) && E(), r.setState((t) => {
 				let n = e.subtitles ?? t.subtitleTracks, r = e.qualities ?? t.qualities;
 				return {
 					...t,
@@ -1260,18 +1276,18 @@ function Y(e) {
 					activeSubtitle: e.subtitles ? t.activeSubtitle && e.subtitles.some((e) => e.lang === t.activeSubtitle.lang) ? t.activeSubtitle : e.subtitles.find((e) => e.default) ?? e.subtitles[0] ?? null : t.activeSubtitle,
 					activeQuality: e.qualities ? e.qualities.includes(t.activeQuality) ? t.activeQuality : e.qualities[0] ?? "Auto" : t.activeQuality
 				};
-			}), (a || o) && I(i.thumbnails), (t || n) && H();
+			}), (a || o) && z(i.thumbnails), (t || n) && Z();
 		},
 		setThumbnails(e) {
 			i = {
 				...i,
 				thumbnails: e
-			}, I(e);
+			}, z(e);
 		},
 		initPlugins(e) {
 			let t = [];
 			for (let n of e) {
-				let e = L(n.name);
+				let e = B(n.name);
 				try {
 					let r = n.setup?.(e);
 					typeof r == "function" && t.push(r);
@@ -1288,10 +1304,10 @@ function Y(e) {
 			};
 		},
 		mount(e, t) {
-			h && this.unmount(), m = t, B(e), g = T, document.addEventListener("fullscreenchange", g), document.addEventListener("webkitfullscreenchange", g), I(i.thumbnails), P(), E.setAspectRatio(r.state.aspectRatio);
+			h && this.unmount(), m = t, X(e), g = O, document.addEventListener("fullscreenchange", g), document.addEventListener("webkitfullscreenchange", g), z(i.thumbnails), L(), k.setAspectRatio(r.state.aspectRatio);
 		},
 		unmount() {
-			z(), m = null, k(), C?.abort(), C = null, F(), v !== null && (clearTimeout(v), v = null), g &&= (document.removeEventListener("fullscreenchange", g), document.removeEventListener("webkitfullscreenchange", g), null), r.setState((e) => ({
+			Y(), T(), m = null, P(), C?.abort(), C = null, R(), v !== null && (clearTimeout(v), v = null), g &&= (document.removeEventListener("fullscreenchange", g), document.removeEventListener("webkitfullscreenchange", g), null), r.setState((e) => ({
 				...e,
 				status: "idle",
 				isPlaying: !1,
@@ -1301,10 +1317,10 @@ function Y(e) {
 			}));
 		},
 		destroy() {
-			this.unmount(), A(), o.clear();
+			this.unmount(), F(), o.clear();
 		}
 	};
-	return Y;
+	return Q;
 }
 //#endregion
 //#region src/gesture-engine.ts
@@ -1415,29 +1431,6 @@ var Q = {
 	contextMenuLoop: "Loop",
 	infoPanel: "Debug stats",
 	loop: "Loop"
-}, $ = {
-	play: "lucide:play",
-	pause: "lucide:pause",
-	replay: "lucide:rotate-ccw",
-	skipBack: "lucide:skip-back",
-	skipForward: "lucide:skip-forward",
-	volumeHigh: "lucide:volume-2",
-	volumeLow: "lucide:volume-1",
-	volumeOff: "lucide:volume-x",
-	settings: "lucide:settings-2",
-	pip: "lucide:picture-in-picture-2",
-	miniPlayer: "lucide:minimize-2",
-	close: "lucide:x",
-	fullscreen: "lucide:maximize",
-	fullscreenExit: "lucide:minimize",
-	chevronLeft: "lucide:chevron-left",
-	check: "lucide:check",
-	spinner: "lucide:loader-2",
-	screenshot: "lucide:camera",
-	flip: "lucide:flip-horizontal-2",
-	aspectRatio: "lucide:monitor",
-	info: "lucide:info",
-	loop: "lucide:repeat"
 };
 //#endregion
-export { p as BaseMediaEngine, g as DashMediaEngine, t as EventBus, h as HlsMediaEngine, n as HotkeyRegistry, a as I18n, m as NativeVideoEngine, M as STORAGE_KEYS, j as Storage, c as canUseFullscreen, o as canUseMSE, s as canUseNativeHLS, l as canUsePictureInPicture, u as canUseTextTracks, X as createGestureEngine, x as createMediaStore, Y as createPlayer, b as createResolvedMediaEngine, $ as defaultPlayerIcons, Q as defaultPlayerLabels, v as detectSourceKind, I as fetchSubtitles, V as fetchThumbnails, Z as formatTime, L as getActiveCue, S as getInitialMediaState, d as getMediaCapabilities, H as getThumbnailAtTime, f as isFiniteDuration, P as parseSRT, z as parseThumbnailVTT, N as parseTimestamp, F as parseVTT, w as selectAudio, k as selectError, C as selectMedia, D as selectPlugins, T as selectPreferences, O as selectThumbnails, E as selectUI, y as toPlayerSource };
+export { p as BaseMediaEngine, g as DashMediaEngine, t as EventBus, h as HlsMediaEngine, n as HotkeyRegistry, a as I18n, m as NativeVideoEngine, M as STORAGE_KEYS, j as Storage, c as canUseFullscreen, o as canUseMSE, s as canUseNativeHLS, l as canUsePictureInPicture, u as canUseTextTracks, X as createGestureEngine, x as createMediaStore, Y as createPlayer, b as createResolvedMediaEngine, Q as defaultPlayerLabels, v as detectSourceKind, I as fetchSubtitles, V as fetchThumbnails, Z as formatTime, L as getActiveCue, S as getInitialMediaState, d as getMediaCapabilities, H as getThumbnailAtTime, f as isFiniteDuration, P as parseSRT, z as parseThumbnailVTT, N as parseTimestamp, F as parseVTT, w as selectAudio, k as selectError, C as selectMedia, D as selectPlugins, T as selectPreferences, O as selectThumbnails, E as selectUI, y as toPlayerSource };

package/dist/types.d.ts

@@ -12,36 +12,12 @@ import type { MediaState } from './state/slices';
 import type { Storage } from './storage';
 import type { SubtitleTrack } from './subtitle-parser';
 export type { MediaState };
-/** Iconify icon identifier, e.g. "lucide:play" or "mdi:play" */
-export type SvgIcon = string;
-export interface PlayerIcons {
-    play: SvgIcon;
-    pause: SvgIcon;
-    replay: SvgIcon;
-    skipBack: SvgIcon;
-    skipForward: SvgIcon;
-    volumeHigh: SvgIcon;
-    volumeLow: SvgIcon;
-    volumeOff: SvgIcon;
-    settings: SvgIcon;
-    pip: SvgIcon;
-    miniPlayer: SvgIcon;
-    close: SvgIcon;
-    fullscreen: SvgIcon;
-    fullscreenExit: SvgIcon;
-    chevronLeft: SvgIcon;
-    check: SvgIcon;
-    spinner: SvgIcon;
-    screenshot: SvgIcon;
-    flip: SvgIcon;
-    aspectRatio: SvgIcon;
-    info: SvgIcon;
-    loop: SvgIcon;
-}
 export interface PlayerOptions {
     src: string;
     /** MIME/content type hint used by source provider selection. */
     type?: string;
+    /** Title exposed to browser and operating-system media controls. */
+    title?: string;
     poster?: string;
     subtitles?: SubtitleTrack[];
     qualities?: string[];
@@ -172,7 +148,7 @@ export interface PlayerInstance {
     hotkeys: HotkeyRegistry;
     /** The active media engine. Null before mount and after unmount. */
     engine: MediaEngine | null;
-    updateOptions(opts: Partial<Pick<PlayerOptions, 'src' | 'type' | 'poster' | 'autoPlay' | 'subtitles' | 'qualities' | 'thumbnails' | 'transformThumbnailVTT'>>): void;
+    updateOptions(opts: Partial<Pick<PlayerOptions, 'src' | 'type' | 'title' | 'poster' | 'autoPlay' | 'subtitles' | 'qualities' | 'thumbnails' | 'transformThumbnailVTT'>>): void;
     setThumbnails(url?: string): void;
     initPlugins(plugins: PlayerPlugin[]): () => void;
     mount(videoEl: HTMLVideoElement, containerEl: HTMLDivElement): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vplayer/core",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "private": false,
   "repository": {
     "type": "git",