avbridge 2.6.0 → 2.8.1

package/dist/element-browser.js

@@ -31689,6 +31689,22 @@ function classifyContext(ctx) {
     };
   }
   if (REMUXABLE_CONTAINERS.has(ctx.container)) {
+    const mime = mp4MimeFor(video, audio);
+    if (mime && typeof MediaSource !== "undefined" && !mseSupports(mime)) {
+      if (webCodecsAvailable()) {
+        return {
+          class: "HYBRID_CANDIDATE",
+          strategy: "hybrid",
+          reason: `${ctx.container} container with ${video.codec}${audio ? "/" + audio.codec : ""}; MSE rejects the remux target mime \u2014 routing to WebCodecs hardware decode`,
+          fallbackChain: ["fallback"]
+        };
+      }
+      return {
+        class: "FALLBACK_REQUIRED",
+        strategy: "fallback",
+        reason: `${ctx.container} container with ${video.codec}${audio ? "/" + audio.codec : ""}; MSE rejects the remux target mime and WebCodecs is unavailable \u2014 falling back to WASM decode`
+      };
+    }
     return {
       class: "REMUX_CANDIDATE",
       strategy: "remux",
@@ -32434,7 +32450,7 @@ var VideoRenderer = class {
       this.resolveFirstFrame = resolve;
     });
     this.canvas = document.createElement("canvas");
-    this.canvas.style.cssText = "position:absolute;left:0;top:0;width:100%;height:100%;background:black;object-fit:contain;";
+    this.canvas.style.cssText = "position:absolute;left:0;top:0;width:100%;height:100%;background:black;object-fit:var(--avbridge-fit, contain);";
     const parent = target.parentElement ?? target.parentNode;
     if (parent && parent instanceof HTMLElement) {
       if (getComputedStyle(parent).position === "static") {
@@ -33783,7 +33799,7 @@ async function createHybridSession(ctx, target, transport) {
 init_libav_loader();
 init_debug();
 async function startDecoder(opts) {
-  const variant = pickLibavVariant(opts.context);
+  const variant = "avbridge";
   const libav = await loadLibav(variant);
   const bridge = await loadBridge2();
   const { prepareLibavInput: prepareLibavInput2 } = await Promise.resolve().then(() => (init_libav_http_reader(), libav_http_reader_exports));
@@ -33839,9 +33855,8 @@ async function startDecoder(opts) {
       videoStream ? `video: ${opts.context.videoTracks[0]?.codec ?? "unknown"}` : null,
       audioStream ? `audio: ${opts.context.audioTracks[0]?.codec ?? "unknown"}` : null
     ].filter(Boolean).join(", ");
-    const hint = variant === "webcodecs" ? ` The "${variant}" libav variant does not include software decoders for these codecs. Try the custom "avbridge" variant (scripts/build-libav.sh) for broader codec support, or use a lighter strategy (native, remux, hybrid) instead.` : "";
     throw new Error(
-      `fallback decoder: could not initialize any libav decoders (${codecs}).${hint}`
+      `fallback decoder: could not initialize any libav decoders (${codecs}). The "${variant}" libav variant lacks software decoders for these codecs \u2014 rebuild with scripts/build-libav.sh including the missing decoder, or use a lighter strategy (native, remux, hybrid) instead.`
     );
   }
   let bsfCtx = null;
@@ -34972,6 +34987,8 @@ var PREFERRED_STRATEGY_VALUES = /* @__PURE__ */ new Set([
   "hybrid",
   "fallback"
 ]);
+var FIT_VALUES = /* @__PURE__ */ new Set(["contain", "cover", "fill"]);
+var DEFAULT_FIT = "contain";
 var FORWARDED_VIDEO_EVENTS = [
   "loadstart",
   "loadedmetadata",
@@ -35006,7 +35023,9 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
     "crossorigin",
     "disableremoteplayback",
     "diagnostics",
-    "preferstrategy"
+    "preferstrategy",
+    "fit",
+    "no-orientation-lock"
   ];
   // ── Internal state ─────────────────────────────────────────────────────
   /** The shadow DOM `<video>` element that strategies render into. */
@@ -35058,23 +35077,38 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
    * native fails.
    */
   _preferredStrategy = "auto";
+  /** Current fit mode. Applied to the inner `<video>` via object-fit, and
+   *  to the fallback canvas via the `--avbridge-fit` CSS custom property on
+   *  the stage wrapper (see `src/strategies/fallback/video-renderer.ts`). */
+  _fit = DEFAULT_FIT;
+  /** The stage wrapper — the element the canvas attaches into, and where
+   *  the `--avbridge-fit` CSS custom property lives. */
+  _stageEl;
   /** Set if currentTime was assigned before the player was ready. */
   _pendingSeek = null;
   /** Set if play() was called before the player was ready. */
   _pendingPlay = false;
   /** MutationObserver tracking light-DOM `<track>` children. */
   _trackObserver = null;
+  /** Document-level fullscreenchange handler — installed while connected so
+   *  the element can lock/unlock screen orientation to match the video's
+   *  intrinsic aspect. */
+  _fullscreenChangeHandler = null;
+  /** True if we successfully called screen.orientation.lock() on the last
+   *  fullscreen entry. Used to know whether to unlock on exit. */
+  _orientationLocked = false;
   // ── Construction & lifecycle ───────────────────────────────────────────
   constructor() {
     super();
     const root = this.attachShadow({ mode: "open" });
     const stage = document.createElement("div");
     stage.setAttribute("part", "stage");
-    stage.style.cssText = "position:relative;width:100%;height:100%;display:block;";
+    stage.style.cssText = `position:relative;width:100%;height:100%;display:block;--avbridge-fit:${DEFAULT_FIT};`;
     root.appendChild(stage);
+    this._stageEl = stage;
     this._videoEl = document.createElement("video");
     this._videoEl.setAttribute("part", "video");
-    this._videoEl.style.cssText = "width:100%;height:100%;display:block;background:#000;";
+    this._videoEl.style.cssText = `width:100%;height:100%;display:block;background:#000;object-fit:var(--avbridge-fit, ${DEFAULT_FIT});`;
     this._videoEl.playsInline = true;
     stage.appendChild(this._videoEl);
     this._videoEl.addEventListener("progress", () => {
@@ -35095,6 +35129,10 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
       this._trackObserver = new MutationObserver(() => this._syncTextTracks());
       this._trackObserver.observe(this, { childList: true, subtree: false });
     }
+    if (!this._fullscreenChangeHandler) {
+      this._fullscreenChangeHandler = () => this._onFullscreenChange();
+      document.addEventListener("fullscreenchange", this._fullscreenChangeHandler);
+    }
     const source = this._activeSource();
     if (source != null) {
       void this._bootstrap(source);
@@ -35106,6 +35144,11 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
       this._trackObserver.disconnect();
       this._trackObserver = null;
     }
+    if (this._fullscreenChangeHandler) {
+      document.removeEventListener("fullscreenchange", this._fullscreenChangeHandler);
+      this._fullscreenChangeHandler = null;
+    }
+    this._releaseOrientationLock();
     this._bootstrapId++;
     void this._teardown();
   }
@@ -35139,6 +35182,14 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
           this._preferredStrategy = "auto";
         }
         break;
+      case "fit": {
+        const next = newValue && FIT_VALUES.has(newValue) ? newValue : DEFAULT_FIT;
+        if (next === this._fit) break;
+        this._fit = next;
+        this._stageEl.style.setProperty("--avbridge-fit", next);
+        this._dispatch("fitchange", { fit: next });
+        break;
+      }
     }
   }
   // ── Source handling ────────────────────────────────────────────────────
@@ -35380,6 +35431,13 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
     if (value) this.setAttribute("diagnostics", "");
     else this.removeAttribute("diagnostics");
   }
+  get fit() {
+    return this._fit;
+  }
+  set fit(value) {
+    if (!FIT_VALUES.has(value)) return;
+    this.setAttribute("fit", value);
+  }
   get preferredStrategy() {
     return this._preferredStrategy;
   }
@@ -35553,6 +35611,87 @@ var AvbridgeVideoElement = class extends HTMLElementCtor {
       }
     );
   }
+  /**
+   * Disable the automatic `screen.orientation.lock()` that runs on
+   * fullscreen entry. Set when you want to honor the device's native
+   * auto-rotate instead of matching the video's intrinsic orientation.
+   */
+  get noOrientationLock() {
+    return this.hasAttribute("no-orientation-lock");
+  }
+  set noOrientationLock(value) {
+    if (value) this.setAttribute("no-orientation-lock", "");
+    else this.removeAttribute("no-orientation-lock");
+  }
+  // ── Fullscreen orientation lock ────────────────────────────────────────
+  /** Called whenever `document.fullscreenchange` fires. If this element (or
+   *  any of its ancestors) is now fullscreen, derive the target orientation
+   *  from the video's intrinsic size and call `screen.orientation.lock()`.
+   *  On exit, release the lock we took. iOS Safari rejects `lock()` — we
+   *  swallow the rejection so nothing breaks on that path. */
+  _onFullscreenChange() {
+    if (this._destroyed) return;
+    const fsEl = document.fullscreenElement;
+    const nowFullscreen = fsEl != null && this._isInsideOrEquals(fsEl);
+    if (nowFullscreen && !this._orientationLocked) {
+      if (this.noOrientationLock) return;
+      const target = this._desiredOrientation();
+      if (!target) return;
+      void this._lockOrientation(target);
+    } else if (!nowFullscreen && this._orientationLocked) {
+      this._releaseOrientationLock();
+    }
+  }
+  /** Walk composed-tree ancestors to see if `target` is this element or
+   *  any ancestor across shadow boundaries. `Node.contains()` can't cross
+   *  shadow roots, so when `<avbridge-player>` (the fullscreen element)
+   *  hosts this `<avbridge-video>` inside its shadow DOM, `contains()`
+   *  returns false. */
+  _isInsideOrEquals(target) {
+    let node3 = this;
+    while (node3) {
+      if (node3 === target) return true;
+      const parent = node3.parentNode;
+      if (parent instanceof ShadowRoot) node3 = parent.host;
+      else node3 = parent;
+    }
+    return false;
+  }
+  /** Derive "landscape" / "portrait" from the intrinsic video dimensions.
+   *  Returns null when dimensions aren't known yet or the video is square.
+   *  Uses `videoWidth` / `videoHeight` from the inner `<video>`, which the
+   *  browser sets to the display-aspect-corrected size (so anamorphic
+   *  content is judged by its display aspect, not pixel aspect). */
+  _desiredOrientation() {
+    const w = this._videoEl.videoWidth;
+    const h = this._videoEl.videoHeight;
+    if (!w || !h) return null;
+    if (w === h) return null;
+    return w > h ? "landscape" : "portrait";
+  }
+  /** Attempt to lock screen orientation. Swallows rejections — iOS Safari
+   *  doesn't implement `lock()`, and desktop / non-fullscreen contexts will
+   *  reject too. Records success so we know whether to unlock on exit. */
+  async _lockOrientation(target) {
+    const so = screen.orientation;
+    if (!so || typeof so.lock !== "function") return;
+    try {
+      await so.lock(target);
+      this._orientationLocked = true;
+    } catch {
+    }
+  }
+  _releaseOrientationLock() {
+    if (!this._orientationLocked) return;
+    this._orientationLocked = false;
+    const so = screen.orientation;
+    if (so && typeof so.unlock === "function") {
+      try {
+        so.unlock();
+      } catch {
+      }
+    }
+  }
   // ── Public methods ─────────────────────────────────────────────────────
   /** Force a (re-)bootstrap if a source is currently set. */
   async load() {