@oddin-gg/havik-player 2.0.2 → 2.0.4

package/dist/index.d.cts

@@ -67,7 +67,16 @@ export declare interface CreatePlayerOptions {
     baseUrl: string;
     matchUrn: string;
     credential: CredentialSource;
-    /** Start playback once ready. Default: true. */
+    /**
+     * Start playback once ready. Default: true. With false the player resolves
+     * playback, then holds in a pre-play 'paused' state (poster + play card,
+     * no spinner) and defers media loading — segments and DRM license traffic —
+     * until the first play(). The hls.js engine still parses the manifest
+     * pre-play ('ready', track lists); the native engine defers all fetching
+     * and emits 'ready' at attach. A policy-blocked programmatic play()
+     * ('autoplayblocked') leaves the loader warming the buffer — media and DRM
+     * traffic flows from that kick, not from a viewer gesture.
+     */
     autoplay?: boolean;
     /** Mute the element (required for reliable autoplay with sound policies). Default: false. */
     muted?: boolean;

package/dist/index.d.ts

@@ -67,7 +67,16 @@ export declare interface CreatePlayerOptions {
     baseUrl: string;
     matchUrn: string;
     credential: CredentialSource;
-    /** Start playback once ready. Default: true. */
+    /**
+     * Start playback once ready. Default: true. With false the player resolves
+     * playback, then holds in a pre-play 'paused' state (poster + play card,
+     * no spinner) and defers media loading — segments and DRM license traffic —
+     * until the first play(). The hls.js engine still parses the manifest
+     * pre-play ('ready', track lists); the native engine defers all fetching
+     * and emits 'ready' at attach. A policy-blocked programmatic play()
+     * ('autoplayblocked') leaves the loader warming the buffer — media and DRM
+     * traffic flows from that kick, not from a viewer gesture.
+     */
     autoplay?: boolean;
     /** Mute the element (required for reliable autoplay with sound policies). Default: false. */
     muted?: boolean;

package/dist/index.js

@@ -663,12 +663,15 @@ var z = class {
 	keySession = null;
 	fairplayArmed = !1;
 	fairplayKeyIV;
+	loadStarted;
+	preloadTouched = !1;
+	savedPreload = null;
 	constructor(e) {
-		this.deps = e;
+		this.deps = e, this.loadStarted = e.deferLoad !== !0;
 	}
 	async load() {
 		let { video: e, descriptor: t, emit: r } = this.deps;
-		if (t.drmEnabled) {
+		if (this.loadStarted || (this.preloadTouched = !0, this.savedPreload = e.getAttribute("preload"), e.preload = "none"), t.drmEnabled) {
 			if (!t.drm?.fairplay) {
 				r({
 					type: "error",
@@ -679,11 +682,21 @@ var z = class {
 			}
 			this.armFairPlay();
 		}
-		this.onLoaded = () => r({ type: "ready" }), this.onError = () => r({
+		let i = !this.loadStarted;
+		this.onLoaded = i ? void 0 : () => r({ type: "ready" }), this.onError = () => r({
 			type: "error",
 			error: new n("INTERNAL", 0, "native HLS playback error"),
 			fatal: !0
-		}), e.addEventListener("loadedmetadata", this.onLoaded, { once: !0 }), e.addEventListener("error", this.onError), e.src = Ee(t.manifestUrl, t.analytics?.sid), e.load();
+		}), this.onLoaded && e.addEventListener("loadedmetadata", this.onLoaded, { once: !0 }), e.addEventListener("error", this.onError), e.src = Ee(t.manifestUrl, t.analytics?.sid), e.load();
+	}
+	startLoad() {
+		this.loadStarted || (this.loadStarted = !0, this.restorePreload());
+	}
+	restorePreload() {
+		if (!this.preloadTouched) return;
+		this.preloadTouched = !1;
+		let { video: e } = this.deps;
+		this.savedPreload === null ? e.removeAttribute("preload") : e.setAttribute("preload", this.savedPreload);
 	}
 	armFairPlay() {
 		let { video: e, descriptor: t, credential: r, deviceId: a, userId: o, emit: s } = this.deps, c = t.drm?.fairplay;
@@ -805,7 +818,7 @@ var z = class {
 		try {
 			e.pause();
 		} catch {}
-		e.removeAttribute("src");
+		e.removeAttribute("src"), this.restorePreload();
 		try {
 			e.load();
 		} catch {}
@@ -872,8 +885,9 @@ var V = class {
 	sizeCapManaged = !0;
 	dprMedia = null;
 	onDprChange = null;
+	loadStarted;
 	constructor(e) {
-		this.deps = e, this.licenseUrl = e.descriptor.drm?.widevine?.licenseUrl;
+		this.deps = e, this.licenseUrl = e.descriptor.drm?.widevine?.licenseUrl, this.loadStarted = e.deferLoad !== !0;
 	}
 	async load() {
 		let { descriptor: e, snapToLiveOnRefocus: t, video: r, emit: i } = this.deps, a = L(r) && R(), o = !!e.drm?.widevine?.licenseUrl && !a;
@@ -894,6 +908,9 @@ var V = class {
 			t - r.currentTime > Math.max(n * 3, 8) && (r.currentTime = t);
 		}, document.addEventListener("visibilitychange", this.onVisibility)), this.onSeeking = () => this.clampOverSeek(), r.addEventListener("seeking", this.onSeeking), this.sizeCapManaged && typeof ResizeObserver < "u" && (this.capObserver = new ResizeObserver(() => this.onMediaResize()), this.capObserver.observe(r), this.watchDprChanges());
 	}
+	startLoad() {
+		this.loadStarted || (this.loadStarted = !0, this.hls?.startLoad(-1));
+	}
 	watchDprChanges() {
 		if (typeof matchMedia != "function") return;
 		this.unwatchDprChanges();
@@ -927,6 +944,7 @@ var V = class {
 			maxLiveSyncPlaybackRate: 1.5,
 			abrEwmaDefaultEstimate: 1e6,
 			capLevelToPlayerSize: !1,
+			...this.loadStarted ? {} : { autoStartLoad: !1 },
 			...u ? {
 				emeEnabled: !0,
 				drmSystems: { ...this.licenseUrl ? { "com.widevine.alpha": { licenseUrl: this.licenseUrl } } : {} },
@@ -951,7 +969,7 @@ var V = class {
 			} } : {},
 			...c
 		};
-		We(d), this.sizeCapManaged = d.capLevelToPlayerSize !== !0;
+		We(d), this.sizeCapManaged = d.capLevelToPlayerSize !== !0, this.loadStarted = d.autoStartLoad !== !1;
 		let f = new e(d);
 		this.hls = f, f.on(e.Events.MANIFEST_PARSED, () => {
 			this.mediaRecoveries = 0, this.networkRecoveries = 0, this.applySizeCap(), l({ type: "ready" });
@@ -1422,7 +1440,7 @@ var Ye = class {
 			keepalive: !0
 		}).catch(() => {});
 	}
-}, Xe = "2.0.2", W = {
+}, Xe = "2.0.4", W = {
 	accent: "#E1B600",
 	accentText: "#1B1C23",
 	background: "#0e0f13",
@@ -1874,6 +1892,8 @@ var dt = class {
 	_lastError = null;
 	analyticsSession = null;
 	detachSeekListener;
+	playRequested = !1;
+	pendingStartLoad = !1;
 	constructor(e) {
 		this.opts = e;
 	}
@@ -2002,18 +2022,20 @@ var dt = class {
 		let n = await s(this.opts.credential);
 		if (this.destroyed || t !== this.loadGen) return;
 		this.setState("loading");
-		let r = this.createEngine(e, n), i = we(this.opts.video, (e) => {
+		let r = this.opts.autoplay === !1 && !this.playRequested, i = this.createEngine(e, n, r), a = we(this.opts.video, (e) => {
 			this._state !== "ended" && this._state !== "error" && this.setState(e);
 		});
-		if (await r.load(), this.destroyed || t !== this.loadGen) {
-			i(), r.destroy();
+		if (await i.load(), this.destroyed || t !== this.loadGen) {
+			a(), i.destroy();
 			return;
 		}
 		if (this._state === "error") {
-			i(), r.destroy();
+			a(), i.destroy();
 			return;
 		}
-		this.engine = r, this.detachMedia = i, this.opts.maxBitrate != null && r.setMaxBitrate(this.opts.maxBitrate), this.startStats(), this.scheduleLicenseRefresh(), this.startLiveState(t), this.startAnalytics(e, r, n.apiKey);
+		this.engine = i, this.detachMedia = a, this.opts.maxBitrate != null && i.setMaxBitrate(this.opts.maxBitrate), this.startStats(), this.scheduleLicenseRefresh(), this.startLiveState(t), this.startAnalytics(e, i, n.apiKey), r && (this.pendingStartLoad = !0, this.setState("paused"), i.name === "native" && setTimeout(() => {
+			this.destroyed || t !== this.loadGen || this.engine !== i || (this.analyticsSession?.noteReady(), this.emit("ready"));
+		}, 0));
 	}
 	startAnalytics(e, t, n) {
 		if (this.analyticsSession?.noteDestroyed(), this.analyticsSession = null, this.detachSeekListener?.(), this.opts.analytics === !1) return;
@@ -2041,10 +2063,10 @@ var dt = class {
 		let s = () => o.noteSeek();
 		a.addEventListener("seeking", s), this.detachSeekListener = () => a.removeEventListener("seeking", s), o.start();
 	}
-	createEngine(e, t) {
-		let r = { ...this.opts.hlsConfig };
-		this.opts.startLevel != null && (r.startLevel = this.opts.startLevel), this.opts.liveLatencyTarget != null && (r.liveSyncDuration = this.opts.liveLatencyTarget);
-		let i = {
+	createEngine(e, t, r = !1) {
+		let i = { ...this.opts.hlsConfig };
+		this.opts.startLevel != null && (i.startLevel = this.opts.startLevel), this.opts.liveLatencyTarget != null && (i.liveSyncDuration = this.opts.liveLatencyTarget);
+		let a = {
 			video: this.opts.video,
 			descriptor: e,
 			credential: t,
@@ -2053,20 +2075,21 @@ var dt = class {
 			lowLatency: this.opts.lowLatency === void 0 || this.opts.lowLatency === "auto" || this.opts.lowLatency,
 			snapToLiveOnRefocus: this.opts.snapToLiveOnRefocus,
 			debug: this.opts.debug,
-			hlsConfig: r,
+			deferLoad: r,
+			hlsConfig: i,
 			emit: (e) => this.onEngineEvent(e)
-		}, a = this.opts.engine ?? "auto";
-		if (a === "native") return new z(i);
-		if (a === "hls") return new V(i);
-		if (e.drmEnabled && e.drm?.fairplay?.licenseUrl && e.drm.fairplay.certificateUrl && L(this.opts.video) && R()) return new z(i);
-		if (De()) return new V(i);
-		if (L(this.opts.video)) return new z(i);
+		}, o = this.opts.engine ?? "auto";
+		if (o === "native") return new z(a);
+		if (o === "hls") return new V(a);
+		if (e.drmEnabled && e.drm?.fairplay?.licenseUrl && e.drm.fairplay.certificateUrl && L(this.opts.video) && R()) return new z(a);
+		if (De()) return new V(a);
+		if (L(this.opts.video)) return new z(a);
 		throw new n("INTERNAL", 0, "no supported HLS playback engine in this browser");
 	}
 	onEngineEvent(e) {
 		if (!this.destroyed) switch (e.type) {
 			case "ready":
-				this.analyticsSession?.noteReady(), this.emit("ready"), this.opts.autoplay !== !1 && this.play();
+				this.analyticsSession?.noteReady(), this.emit("ready"), (this.opts.autoplay !== !1 || this.playRequested) && this.play();
 				break;
 			case "lowLatencyDetected":
 				this._descriptor && (this._descriptor.isLowLatency = e.value);
@@ -2116,7 +2139,7 @@ var dt = class {
 				t === "match_ended" && this._endedReason !== "match_ended" && (this._endedReason = t, this.emit("ended", t));
 				return;
 			}
-			this.endedHandled = !0, this._endedReason = t ?? null, this.stopRefresh(), this.engine?.stop(), this.setState("ended");
+			this.endedHandled = !0, this._endedReason = t ?? null, this.stopRefresh(), this.pendingStartLoad = !1, this.engine?.stop(), this.setState("ended");
 		}
 	}
 	rejoinEnabled() {
@@ -2135,7 +2158,7 @@ var dt = class {
 		this.teardownPlayback(), this.setState("waiting"), this.beginArming(e, void 0, !0);
 	}
 	teardownPlayback() {
-		this.stopStats(), this.stopRefresh(), this.cancelRejoin(), this.closeArming(), this.closeLiveState(), this.detachMedia?.(), this.engine?.destroy(), this.engine = null;
+		this.stopStats(), this.stopRefresh(), this.cancelRejoin(), this.closeArming(), this.closeLiveState(), this.detachMedia?.(), this.engine?.destroy(), this.engine = null, this.pendingStartLoad = !1;
 	}
 	mountControls() {
 		let e = this.opts.controls ?? "custom", t = this.opts.video;
@@ -2206,10 +2229,15 @@ var dt = class {
 		}
 	}
 	async play() {
-		if (!this.destroyed) try {
+		if (this.destroyed) return;
+		let e = !this.playRequested;
+		this.playRequested = !0;
+		let t = this.pendingStartLoad && this._state !== "ended" && this._state !== "error";
+		t && (this.pendingStartLoad = !1, this.setState("loading"), this.engine?.startLoad());
+		try {
 			await this.opts.video.play();
-		} catch (e) {
-			e instanceof DOMException && e.name === "NotAllowedError" && this.emit("autoplayblocked");
+		} catch (n) {
+			n instanceof DOMException && n.name === "NotAllowedError" && (e && (this.playRequested = !1), t && !this.destroyed && this._state === "loading" && this.setState("paused"), this.emit("autoplayblocked"));
 		}
 	}
 	pause() {