@mebius-io/web 0.4.1 → 0.4.2

package/dist/index.global.js

@@ -42705,6 +42705,20 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
   };
 
   // src/internal/publish-transport.ts
+  function preferH264(pc) {
+    const caps = RTCRtpSender.getCapabilities?.("video");
+    if (!caps?.codecs) return;
+    const h264 = caps.codecs.filter((c) => c.mimeType.toLowerCase() === "video/h264");
+    if (h264.length === 0) return;
+    const rest = caps.codecs.filter((c) => c.mimeType.toLowerCase() !== "video/h264");
+    for (const tr of pc.getTransceivers()) {
+      if (tr.sender.track?.kind !== "video") continue;
+      try {
+        tr.setCodecPreferences?.([...h264, ...rest]);
+      } catch {
+      }
+    }
+  }
   var WhipPublishTransport = class {
     constructor(signaling) {
       this.signaling = signaling;
@@ -42717,6 +42731,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       for (const track of stream.getTracks()) {
         pc.addTrack(track, stream);
       }
+      preferH264(pc);
       const offer = await pc.createOffer();
       await pc.setLocalDescription(offer);
       await waitForIceGathering(pc);
@@ -42883,6 +42898,8 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       this.video = null;
       this.endedCb = null;
       this.bufferingCb = null;
+      /** Aborts this attempt's element listeners; see start(). */
+      this.listeners = null;
       /** True when playback only started because the element had to be muted. */
       this.mutedByPolicy = false;
     }
@@ -42895,8 +42912,10 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
     async start(streamId, video) {
       this.video = video;
       const url = this.deliveryPath ? this.signaling.deliveryUrl(this.deliveryPath) : this.signaling.scalePlaylistUrl(streamId);
-      video.addEventListener("ended", () => this.endedCb?.());
-      video.addEventListener("waiting", () => this.bufferingCb?.());
+      this.listeners = new AbortController();
+      const { signal } = this.listeners;
+      video.addEventListener("ended", () => this.endedCb?.(), { signal });
+      video.addEventListener("waiting", () => this.bufferingCb?.(), { signal });
       if (video.canPlayType("application/vnd.apple.mpegurl")) {
         video.src = url;
         this.mutedByPolicy = (await playWithAutoplayFallback(video)).mutedByPolicy;
@@ -42912,7 +42931,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       if (!Hls2.isSupported()) {
         throw mebiusError("CONNECTION_FAILED", "Scale playback is not supported in this browser.");
       }
-      const hls = new Hls2();
+      const hls = new Hls2({ maxLiveSyncPlaybackRate: 1.5 });
       this.hls = hls;
       hls.on(Hls2.Events.ERROR, (_evt, data) => {
         if (data.fatal) this.bufferingCb?.();
@@ -42922,6 +42941,8 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       this.mutedByPolicy = (await playWithAutoplayFallback(video)).mutedByPolicy;
     }
     async stop() {
+      this.listeners?.abort();
+      this.listeners = null;
       this.hls?.destroy();
       this.hls = null;
       if (this.video) {
@@ -42941,6 +42962,40 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
   };
 
   // src/internal/balanced-view-transport.ts
+  var LIVE_FLV_CONFIG = {
+    enableStashBuffer: false,
+    stashInitialSize: 128,
+    lazyLoad: false,
+    autoCleanupSourceBuffer: true,
+    autoCleanupMaxBackwardDuration: 30,
+    autoCleanupMinBackwardDuration: 10,
+    reuseRedirectedURL: true
+  };
+  var MAX_DRIFT_S = 2;
+  var EDGE_MARGIN_S = 0.4;
+  var AUDIO_RETRY_MS = 2500;
+  function stalledAtZero(video, ms) {
+    if (video.currentTime > 0) return Promise.resolve(false);
+    return new Promise((resolve) => {
+      const done = (stalled) => {
+        clearTimeout(timer);
+        video.removeEventListener("timeupdate", onTime);
+        resolve(stalled);
+      };
+      const onTime = () => {
+        if (video.currentTime > 0) done(false);
+      };
+      const timer = setTimeout(() => done(true), ms);
+      video.addEventListener("timeupdate", onTime);
+    });
+  }
+  function chaseLiveEdge(video) {
+    const ranges = video.buffered;
+    if (ranges.length === 0) return;
+    const edge = ranges.end(ranges.length - 1);
+    if (edge - video.currentTime <= MAX_DRIFT_S) return;
+    video.currentTime = edge - EDGE_MARGIN_S;
+  }
   var FlvViewTransport = class {
     constructor(signaling, deliveryPath) {
       this.signaling = signaling;
@@ -42949,6 +43004,8 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       this.video = null;
       this.endedCb = null;
       this.bufferingCb = null;
+      /** Aborts this attempt's element listeners; see start(). */
+      this.listeners = null;
       /** True when playback only started because the element had to be muted. */
       this.mutedByPolicy = false;
     }
@@ -42961,8 +43018,11 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
     async start(_streamId, video) {
       this.video = video;
       const url = this.signaling.deliveryUrl(this.deliveryPath);
-      video.addEventListener("ended", () => this.endedCb?.());
-      video.addEventListener("waiting", () => this.bufferingCb?.());
+      this.listeners = new AbortController();
+      const { signal } = this.listeners;
+      video.addEventListener("ended", () => this.endedCb?.(), { signal });
+      video.addEventListener("waiting", () => this.bufferingCb?.(), { signal });
+      video.addEventListener("timeupdate", () => chaseLiveEdge(video), { signal });
       let mod;
       try {
         mod = await Promise.resolve().then(() => __toESM(require_flv(), 1));
@@ -42973,20 +43033,38 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       if (!flvjs.isSupported()) {
         throw mebiusError("CONNECTION_FAILED", "Balanced playback is not supported in this browser.");
       }
-      const player = flvjs.createPlayer({ type: "flv", url, isLive: true });
+      this.attachPlayer(flvjs, video, url, true);
+      const firstPlay = playWithAutoplayFallback(video);
+      firstPlay.catch(() => void 0);
+      if (await stalledAtZero(video, AUDIO_RETRY_MS)) {
+        this.teardownPlayer();
+        this.attachPlayer(flvjs, video, url, false);
+        this.mutedByPolicy = (await playWithAutoplayFallback(video)).mutedByPolicy;
+        return;
+      }
+      this.mutedByPolicy = (await firstPlay).mutedByPolicy;
+    }
+    attachPlayer(flvjs, video, url, withAudio) {
+      const player = flvjs.createPlayer(
+        { type: "flv", url, isLive: true, ...withAudio ? {} : { hasAudio: false } },
+        LIVE_FLV_CONFIG
+      );
       this.player = player;
       player.on(flvjs.Events.ERROR ?? "error", () => this.bufferingCb?.());
       player.attachMediaElement(video);
       player.load();
-      this.mutedByPolicy = (await playWithAutoplayFallback(video)).mutedByPolicy;
+    }
+    teardownPlayer() {
+      if (!this.player) return;
+      this.player.unload();
+      this.player.detachMediaElement();
+      this.player.destroy();
+      this.player = null;
     }
     async stop() {
-      if (this.player) {
-        this.player.unload();
-        this.player.detachMediaElement();
-        this.player.destroy();
-        this.player = null;
-      }
+      this.listeners?.abort();
+      this.listeners = null;
+      this.teardownPlayer();
       if (this.video) {
         this.video.removeAttribute("src");
         this.video.load();
@@ -43035,7 +43113,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
   }
 
   // src/internal/telemetry.ts
-  var SDK_VERSION = "web/0.4.1";
+  var SDK_VERSION = "web/0.4.2";
   var FLUSH_INTERVAL_MS = 15e3;
   var MAX_BATCH = 64;
   function describeDevice() {
@@ -43095,7 +43173,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))} pos: ${this.timeli
       if (beacon && typeof navigator !== "undefined" && navigator.sendBeacon) {
         const url = `${this.target.url}${this.target.url.includes("?") ? "&" : "?"}token=${encodeURIComponent(this.target.token)}`;
         try {
-          navigator.sendBeacon(url, new Blob([body], { type: "application/json" }));
+          navigator.sendBeacon(url, new Blob([body], { type: "text/plain" }));
         } catch {
         }
         return;