three-vr-player 0.8.0 → 0.10.0

package/dist/types.d.ts

@@ -1,4 +1,4 @@
-export type Projection = '180-sbs' | '180-mono' | '360-mono' | '360-sbs' | '360-tb' | 'flat-2d' | 'flat-sbs-full' | 'flat-sbs-half';
+export type Projection = '180-sbs' | '180-mono' | '360-mono' | '360-sbs' | '360-tb' | 'fisheye190-sbs' | 'fisheye190-mono' | 'flat-2d' | 'flat-sbs-full' | 'flat-sbs-half';
 export interface PlayerOptions {
     /** Initial source URL. If omitted, call `player.load(src)` later. */
     src?: string;
@@ -30,6 +30,11 @@ export interface PlayerOptions {
     vrButton?: boolean;
     /** Title shown on the in-VR control panel. Optional. */
     title?: string;
+    /**
+     * Content carries a DeoVR-style packed alpha matte (fisheye passthrough). When omitted, it's
+     * inferred from a `_ALPHA` marker in the source filename. Only affects fisheye projections.
+     */
+    alpha?: boolean;
     /**
      * If a cross-origin source can't be used as a WebGL texture (CORS-tainted) and
      * isn't proxied, fall back to plain 2D `<video>` playback instead of erroring.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-vr-player",
-  "version": "0.8.0",
+  "version": "0.10.0",
   "description": "Embeddable web player for 180/360 and side-by-side/top-bottom 3D video, undistorted on desktop and in WebXR. Built on three.js.",
   "type": "module",
   "license": "MIT",
@@ -48,7 +48,8 @@
     "build": "vite build && vite build --config vite.standalone.config.ts",
     "build:demo": "vite build --config vite.demo.config.ts",
     "typecheck": "tsc --noEmit",
-    "test": "vitest run"
+    "test": "vitest run",
+    "prepublishOnly": "npm run build"
   },
   "peerDependencies": {
     "three": ">=0.160.0 <1"

package/dist/VideoSource-Cx7XPpvZ.js

@@ -1,528 +0,0 @@
-import * as l from "three";
-function k(a) {
-  let e = a;
-  try {
-    e = new URL(a).pathname;
-  } catch {
-  }
-  const t = e.toLowerCase();
-  return t.endsWith(".m3u8") ? "hls" : t.endsWith(".mpd") ? "dash" : "progressive";
-}
-const F = {
-  progressive: "/proxy/stream",
-  hls: "/proxy/hls/manifest.m3u8",
-  dash: "/proxy/mpd/manifest.m3u8"
-};
-function _(a, e) {
-  const t = k(a);
-  if (!e || !e.url) return { url: a, format: t };
-  const s = e.url.replace(/\/+$/, ""), i = new URLSearchParams();
-  i.set("d", a), e.apiPassword && i.set("api_password", e.apiPassword);
-  for (const [r, n] of Object.entries(e.headers ?? {}))
-    n != null && n !== "" && i.set(`h_${r}`, n);
-  return { url: `${s}${F[t]}?${i.toString()}`, format: t };
-}
-const m = {
-  "180-sbs": { geom: "sphere180", split: "sbs", stereo: !0 },
-  "180-mono": { geom: "sphere180", split: "mono", stereo: !1 },
-  "360-mono": { geom: "sphere360", split: "mono", stereo: !1 },
-  "360-sbs": { geom: "sphere360", split: "sbs", stereo: !0 },
-  "360-tb": { geom: "sphere360", split: "tb", stereo: !0 },
-  "flat-2d": { geom: "plane", split: "mono", stereo: !1, flat: !0, aspect: "full" },
-  "flat-sbs-full": { geom: "plane", split: "sbs", stereo: !0, flat: !0, aspect: "per-eye" },
-  "flat-sbs-half": { geom: "plane", split: "sbs", stereo: !0, flat: !0, aspect: "full" }
-}, z = [
-  { value: "180-sbs", label: "180° SBS (VR180)" },
-  { value: "180-mono", label: "180° Mono" },
-  { value: "360-mono", label: "360° Mono" },
-  { value: "360-sbs", label: "360° SBS" },
-  { value: "360-tb", label: "360° Top-Bottom" },
-  { value: "flat-2d", label: "Flat 2D" },
-  { value: "flat-sbs-full", label: "Flat 3D — Full SBS" },
-  { value: "flat-sbs-half", label: "Flat 3D — Half SBS" }
-];
-function H(a) {
-  var e;
-  return !!((e = m[a]) != null && e.flat);
-}
-function U(a) {
-  const e = String(a).toLowerCase(), t = /(^|[^a-z])(tb|ou|top.?bottom|over.?under)([^a-z]|$)/.test(e), s = /(sbs|side.?by.?side)/.test(e);
-  return e.includes("360") ? t ? "360-tb" : s ? "360-sbs" : "360-mono" : e.includes("180") || e.includes("vr180") ? e.includes("mono") ? "180-mono" : "180-sbs" : s ? e.includes("half") ? "flat-sbs-half" : "flat-sbs-full" : null;
-}
-function R(a) {
-  if (!Number.isFinite(a) || a < 0) return "0:00";
-  const e = Math.floor(a % 60), t = Math.floor(a / 60 % 60), s = Math.floor(a / 3600), i = String(e).padStart(2, "0");
-  return s > 0 ? `${s}:${String(t).padStart(2, "0")}:${i}` : `${t}:${i}`;
-}
-const v = 1024, w = 340;
-function A() {
-  const a = v, e = w, t = 48;
-  return {
-    width: a,
-    height: e,
-    recenter: { x: 30, y: 26, w: 160, h: 52 },
-    exit: { x: a - 190, y: 26, w: 160, h: 52 },
-    title: { x: 0, y: 92, w: a, h: 44 },
-    play: { x: a / 2 - 44, y: 150, w: 88, h: 88 },
-    volIcon: { x: t, y: 178, w: 44, h: 44 },
-    volBar: { x: t + 60, y: 192, w: 200, h: 16 },
-    seekBar: { x: t, y: 286, w: a - t * 2, h: 14 },
-    timeCur: { x: t, y: 262 },
-    timeDur: { x: a - t, y: 262 }
-  };
-}
-const T = (a) => a < 0 ? 0 : a > 1 ? 1 : a;
-function x(a, e, t, s = 0, i = 0) {
-  return e >= a.x - s && e <= a.x + a.w + s && t >= a.y - i && t <= a.y + a.h + i;
-}
-function C(a, e, t = A()) {
-  return x(t.recenter, a, e) ? { region: "recenter" } : x(t.exit, a, e) ? { region: "exit" } : x(t.play, a, e) ? { region: "play" } : x(t.volIcon, a, e) ? { region: "volume" } : x(t.volBar, a, e, 12, 26) ? { region: "volume", value: T((a - t.volBar.x) / t.volBar.w) } : x(t.seekBar, a, e, 12, 26) ? { region: "seek", value: T((a - t.seekBar.x) / t.seekBar.w) } : null;
-}
-const S = "#4f8cff", y = "#e8eaed", E = "#aab2c0", B = [4, 5], M = 8e3, I = 0.05, V = 0.02, O = 1500;
-class W {
-  // re-lock the panel to the head pose for a few frames after summon
-  constructor(e) {
-    this.layout = A(), this.raycaster = new l.Raycaster(), this.tmpMatrix = new l.Matrix4(), this.tmpVec = new l.Vector3(), this.tmpQuat = new l.Quaternion(), this.prevQuat = [], this.prevPos = [], this.revealCooldownUntil = 0, this.controllers = [], this.lasers = [], this.connected = [], this.cleanups = [], this.visible = !1, this.hover = null, this.paintKey = "", this.idleAt = 0, this.togglePrev = !1, this.placeFrames = 0, this.renderer = e.renderer, this.scene = e.scene, this.actions = e.actions, this.canvas = document.createElement("canvas"), this.canvas.width = v, this.canvas.height = w, this.ctx = this.canvas.getContext("2d"), this.texture = new l.CanvasTexture(this.canvas), this.texture.colorSpace = l.SRGBColorSpace, this.texture.minFilter = l.LinearFilter;
-    const t = 1, s = t * w / v;
-    this.panel = new l.Mesh(
-      new l.PlaneGeometry(t, s),
-      new l.MeshBasicMaterial({ map: this.texture, transparent: !0, depthTest: !1, side: l.DoubleSide })
-    ), this.panel.renderOrder = 10, this.panel.frustumCulled = !1, this.panel.visible = !1, this.scene.add(this.panel), this.cursor = new l.Mesh(
-      new l.SphereGeometry(7e-3, 16, 12),
-      new l.MeshBasicMaterial({ color: 16777215, depthTest: !1 })
-    ), this.cursor.renderOrder = 11, this.cursor.frustumCulled = !1, this.cursor.visible = !1, this.scene.add(this.cursor);
-    const i = this.renderer.xr.getSession(), r = i ? Array.from(i.inputSources).filter((n) => n.targetRayMode === "tracked-pointer").length : 0;
-    for (let n = 0; n < 2; n++) {
-      const o = this.renderer.xr.getController(n), h = this.makeLaser();
-      h.visible = !1, o.add(h), this.scene.add(o), this.controllers.push(o), this.lasers.push(h), this.connected.push(n < r);
-      const u = () => this.onSelect(n), c = () => this.toggle(), p = (f) => {
-        this.connected[n] = !(f != null && f.data) || f.data.targetRayMode === "tracked-pointer";
-      }, g = () => {
-        this.connected[n] = !1;
-      }, d = o;
-      d.addEventListener("selectstart", u), d.addEventListener("squeezestart", c), d.addEventListener("connected", p), d.addEventListener("disconnected", g), this.cleanups.push(() => {
-        d.removeEventListener("selectstart", u), d.removeEventListener("squeezestart", c), d.removeEventListener("connected", p), d.removeEventListener("disconnected", g);
-      });
-    }
-    this.paint(!0);
-  }
-  makeLaser() {
-    const e = new l.BufferGeometry().setFromPoints([new l.Vector3(0, 0, 0), new l.Vector3(0, 0, -1)]), t = new l.LineBasicMaterial({ color: 5213439, transparent: !0, opacity: 0.8 });
-    return new l.Line(e, t);
-  }
-  /** Called once per frame from the render loop (before renderer.render). */
-  update(e) {
-    if (!this.renderer.xr.getSession()) return;
-    if (this.pollToggle(), this.maybeRevealOnMotion(e), !this.visible) {
-      for (const i of this.lasers) i.visible = !1;
-      this.cursor.visible = !1;
-      return;
-    }
-    if (this.placeFrames > 0 && (this.place(), this.placeFrames--), this.idleAt && e > this.idleAt) {
-      this.hide();
-      return;
-    }
-    let t = null, s = null;
-    for (let i = 0; i < this.controllers.length; i++) {
-      const r = this.lasers[i], n = this.controllers[i], o = this.tmpVec.setFromMatrixPosition(n.matrixWorld).lengthSq() > 1e-6;
-      if (!this.connected[i] || !o) {
-        r.visible = !1;
-        continue;
-      }
-      const h = this.rayHit(n);
-      h.point ? (r.visible = !0, r.scale.z = h.distance, s = h.point, h.hit && (t = h.hit.region)) : r.visible = !1;
-    }
-    s ? (this.cursor.position.copy(s), this.cursor.visible = !0) : this.cursor.visible = !1, t && (this.idleAt = e + M), this.hover = t, this.paint(!1);
-  }
-  /** Ray from a controller against the panel: the region under it (if any) and
-   *  how far the laser reaches. */
-  rayHit(e) {
-    this.tmpMatrix.identity().extractRotation(e.matrixWorld), this.raycaster.ray.origin.setFromMatrixPosition(e.matrixWorld), this.raycaster.ray.direction.set(0, 0, -1).applyMatrix4(this.tmpMatrix);
-    const t = this.raycaster.intersectObject(this.panel, !1);
-    if (!t.length) return { hit: null, distance: 5, point: null };
-    const s = t[0];
-    return { hit: s.uv ? C(s.uv.x * v, (1 - s.uv.y) * w, this.layout) : null, distance: s.distance, point: s.point };
-  }
-  onSelect(e) {
-    if (!this.visible || !this.connected[e]) return;
-    const { hit: t } = this.rayHit(this.controllers[e]);
-    if (t) {
-      switch (this.idleAt = P() + M, t.region) {
-        case "play":
-          this.actions.togglePlay();
-          break;
-        case "exit":
-          this.actions.exitVR();
-          break;
-        case "recenter":
-          this.actions.recenter(), this.placeFrames = 12;
-          break;
-        case "seek":
-          t.value !== void 0 && this.actions.seekFraction(t.value);
-          break;
-        case "volume":
-          t.value !== void 0 ? this.actions.setVolume(t.value) : this.actions.toggleMute();
-          break;
-      }
-      this.paint(!0);
-    }
-  }
-  /** Re-summon the panel when a connected controller is deliberately moved (and
-   *  we're past the post-hide cooldown). Tracks each controller's pose per frame. */
-  maybeRevealOnMotion(e) {
-    for (let t = 0; t < this.controllers.length; t++) {
-      const s = this.controllers[t], i = this.tmpVec.setFromMatrixPosition(s.matrixWorld);
-      if (!this.connected[t] || i.lengthSq() <= 1e-6) continue;
-      const r = this.tmpQuat.setFromRotationMatrix(s.matrixWorld), n = this.prevQuat[t], o = this.prevPos[t];
-      n && o && !this.visible && e > this.revealCooldownUntil && (r.angleTo(n) > I || i.distanceTo(o) > V) && this.show(), this.prevQuat[t] || (this.prevQuat[t] = new l.Quaternion()), this.prevPos[t] || (this.prevPos[t] = new l.Vector3()), this.prevQuat[t].copy(r), this.prevPos[t].copy(i);
-    }
-  }
-  pollToggle() {
-    const e = this.renderer.xr.getSession();
-    let t = !1;
-    for (const s of (e == null ? void 0 : e.inputSources) ?? []) {
-      const i = s.gamepad;
-      i && B.some((r) => {
-        var n;
-        return (n = i.buttons[r]) == null ? void 0 : n.pressed;
-      }) && (t = !0);
-    }
-    t && !this.togglePrev && this.toggle(), this.togglePrev = t;
-  }
-  toggle() {
-    this.visible ? this.hide() : this.show();
-  }
-  show() {
-    this.place(), this.placeFrames = 12, this.visible = !0, this.panel.visible = !0, this.idleAt = P() + M, this.paint(!0);
-  }
-  hide() {
-    this.visible = !1, this.panel.visible = !1, this.cursor.visible = !1;
-    for (const e of this.lasers) e.visible = !1;
-    this.revealCooldownUntil = P() + O;
-  }
-  /** World-lock the panel in front of the current head pose (the "recenter"). Uses
-   *  yaw only (so head pitch/roll at summon doesn't skew it), drops it into the lower
-   *  field of view, and tilts its face up toward the viewer. Re-run on every summon. */
-  place() {
-    const e = this.renderer.xr.getCamera(), t = e.getWorldPosition(new l.Vector3()), s = e.getWorldQuaternion(new l.Quaternion()), i = new l.Euler().setFromQuaternion(s, "YXZ").y, r = new l.Quaternion().setFromEuler(new l.Euler(0, i, 0, "YXZ")), n = new l.Vector3(0, 0, -1).applyQuaternion(r);
-    this.panel.position.copy(t).addScaledVector(n, 1.5), this.panel.position.y -= 0.55, this.panel.quaternion.copy(r), this.panel.rotateX(-0.3);
-  }
-  /** Trim text with a trailing ellipsis to fit maxWidth. Assumes ctx.font is set. */
-  ellipsize(e, t) {
-    const s = this.ctx;
-    if (s.measureText(e).width <= t) return e;
-    let i = e;
-    for (; i.length > 1 && s.measureText(i + "…").width > t; ) i = i.slice(0, -1);
-    return i.replace(/\s+$/, "") + "…";
-  }
-  roundRect(e, t, s, i, r) {
-    const n = this.ctx;
-    n.beginPath(), n.moveTo(e + r, t), n.arcTo(e + s, t, e + s, t + i, r), n.arcTo(e + s, t + i, e, t + i, r), n.arcTo(e, t + i, e, t, r), n.arcTo(e, t, e + s, t, r), n.closePath();
-  }
-  /** Repaint the panel only when something visible changed (state or hover). */
-  paint(e) {
-    const t = this.actions.currentTime(), s = this.actions.duration(), i = this.actions.volume(), r = this.actions.muted(), n = [this.actions.isPlaying(), Math.floor(t), Math.floor(s), i.toFixed(2), r, this.hover, this.actions.title()].join("|");
-    if (!e && n === this.paintKey) return;
-    this.paintKey = n;
-    const o = this.ctx, h = this.layout;
-    o.clearRect(0, 0, v, w), this.roundRect(0, 0, v, w, 28), o.fillStyle = "rgba(22,24,30,0.84)", o.fill(), o.lineWidth = 2, o.strokeStyle = "rgba(255,255,255,0.08)", o.stroke();
-    const u = this.actions.title();
-    if (u) {
-      o.font = '600 30px system-ui,"Segoe UI",Roboto,sans-serif', o.fillStyle = y, o.textAlign = "center", o.textBaseline = "middle";
-      const d = 2 * h.exit.x - 48 - v;
-      o.fillText(this.ellipsize(u, d), v / 2, h.title.y + h.title.h / 2);
-    }
-    this.drawPill(h.recenter, "Recenter", this.hover === "recenter"), this.drawPill(h.exit, "Exit VR", this.hover === "exit");
-    const c = { x: h.play.x + h.play.w / 2, y: h.play.y + h.play.h / 2 };
-    o.beginPath(), o.arc(c.x, c.y, 44, 0, Math.PI * 2), o.fillStyle = this.hover === "play" ? S : "rgba(255,255,255,0.14)", o.fill(), o.fillStyle = "#fff", this.actions.isPlaying() ? (o.fillRect(c.x - 13, c.y - 16, 9, 32), o.fillRect(c.x + 4, c.y - 16, 9, 32)) : (o.beginPath(), o.moveTo(c.x - 12, c.y - 17), o.lineTo(c.x - 12, c.y + 17), o.lineTo(c.x + 18, c.y), o.closePath(), o.fill()), this.drawSpeaker(h.volIcon, r);
-    const p = r ? 0 : Math.max(0, Math.min(1, i));
-    this.drawBar(h.volBar, p, this.hover === "volume");
-    const g = s > 0 ? Math.max(0, Math.min(1, t / s)) : 0;
-    this.drawBar(h.seekBar, g, this.hover === "seek", !0), o.fillStyle = E, o.font = "22px system-ui,sans-serif", o.textBaseline = "alphabetic", o.textAlign = "left", o.fillText(R(t), h.timeCur.x, h.timeCur.y), o.textAlign = "right", o.fillText(s > 0 ? R(s) : "--:--", h.timeDur.x, h.timeDur.y), this.texture.needsUpdate = !0;
-  }
-  drawPill(e, t, s) {
-    const i = this.ctx;
-    this.roundRect(e.x, e.y, e.w, e.h, e.h / 2), i.fillStyle = s ? S : "rgba(255,255,255,0.12)", i.fill(), i.fillStyle = s ? "#fff" : y, i.font = "600 24px system-ui,sans-serif", i.textAlign = "center", i.textBaseline = "middle", i.fillText(t, e.x + e.w / 2, e.y + e.h / 2);
-  }
-  drawBar(e, t, s, i = !1) {
-    const r = this.ctx, n = e.h / 2;
-    this.roundRect(e.x, e.y, e.w, e.h, n), r.fillStyle = "rgba(255,255,255,0.22)", r.fill(), t > 0 && (this.roundRect(e.x, e.y, e.w * t, e.h, n), r.fillStyle = S, r.fill()), (i || s) && (r.beginPath(), r.arc(e.x + e.w * t, e.y + e.h / 2, s ? 12 : 9, 0, Math.PI * 2), r.fillStyle = "#fff", r.fill());
-  }
-  drawSpeaker(e, t) {
-    const s = this.ctx, i = e.x, r = e.y + e.h / 2;
-    s.fillStyle = t ? E : y, s.beginPath(), s.moveTo(i, r - 7), s.lineTo(i + 10, r - 7), s.lineTo(i + 20, r - 16), s.lineTo(i + 20, r + 16), s.lineTo(i + 10, r + 7), s.lineTo(i, r + 7), s.closePath(), s.fill(), s.strokeStyle = t ? "#e06a6a" : y, s.lineWidth = 3, t ? (s.beginPath(), s.moveTo(i + 26, r - 9), s.lineTo(i + 40, r + 9), s.moveTo(i + 40, r - 9), s.lineTo(i + 26, r + 9), s.stroke()) : (s.beginPath(), s.arc(i + 24, r, 8, -Math.PI / 3, Math.PI / 3), s.stroke(), s.beginPath(), s.arc(i + 24, r, 15, -Math.PI / 3, Math.PI / 3), s.stroke());
-  }
-  dispose() {
-    for (const e of this.cleanups) e();
-    for (let e = 0; e < this.controllers.length; e++) {
-      const t = this.controllers[e];
-      t.remove(this.lasers[e]), this.lasers[e].geometry.dispose(), this.lasers[e].material.dispose(), this.scene.remove(t);
-    }
-    this.scene.remove(this.panel), this.panel.geometry.dispose(), this.panel.material.dispose(), this.scene.remove(this.cursor), this.cursor.geometry.dispose(), this.cursor.material.dispose(), this.texture.dispose();
-  }
-}
-function P() {
-  return typeof performance < "u" ? performance.now() : 0;
-}
-class j {
-  constructor(e) {
-    this.scene = new l.Scene(), this.meshes = [], this.frameCbs = [], this.animate = (h) => {
-      var u;
-      for (const c of this.frameCbs) c();
-      (u = this.vrControls) == null || u.update(h ?? 0), this.video.readyState >= this.video.HAVE_CURRENT_DATA && (this.texture.needsUpdate = !0), this.renderer.render(this.scene, this.camera);
-    }, this.vrSessionInit = { optionalFeatures: ["local-floor"] }, this.vrTitle = "", this.resize = () => {
-      if (this.renderer.xr.isPresenting) return;
-      const h = this.w(), u = this.h();
-      this.camera.aspect = h / u, this.camera.updateProjectionMatrix(), this.renderer.setSize(h, u, !1);
-    };
-    const { canvas: t, video: s, projection: i = "180-sbs", swapEyes: r = !1, fov: n = 70, supersampling: o = 1.5 } = e;
-    this.canvas = t, this.video = s, this.currentMode = m[i] ? i : "180-sbs", this.currentSwap = r, this.renderer = new l.WebGLRenderer({ canvas: t, antialias: !0 }), this.renderer.setPixelRatio(this.pixelRatioFor(o)), this.renderer.setSize(this.w(), this.h(), !1), this.renderer.xr.enabled = !0, this.camera = new l.PerspectiveCamera(n, this.w() / this.h(), 0.1, 1e3), this.camera.position.set(0, 0, 0), this.maxAnisotropy = this.renderer.capabilities.getMaxAnisotropy(), this.texture = new l.VideoTexture(s), this.texture.colorSpace = l.SRGBColorSpace, this.texture.minFilter = l.LinearFilter, this.texture.magFilter = l.LinearFilter, this.texture.anisotropy = 1, this.applyProjection(this.currentMode, this.currentSwap), s.addEventListener("loadedmetadata", () => {
-      m[this.currentMode].flat && this.applyProjection(this.currentMode, this.currentSwap);
-    }), this.renderer.setAnimationLoop(this.animate), this.renderer.xr.addEventListener("sessionstart", () => this.buildVRControls()), this.renderer.xr.addEventListener("sessionend", () => {
-      var h;
-      (h = this.vrControls) == null || h.dispose(), this.vrControls = void 0, this.video.pause();
-    }), this.ro = new ResizeObserver(() => this.resize()), this.ro.observe(t);
-  }
-  buildVRControls() {
-    const e = this.video;
-    this.vrControls = new W({
-      renderer: this.renderer,
-      scene: this.scene,
-      actions: {
-        isPlaying: () => !e.paused,
-        currentTime: () => e.currentTime,
-        duration: () => e.duration || 0,
-        volume: () => e.volume,
-        muted: () => e.muted,
-        title: () => this.vrTitle,
-        togglePlay: () => {
-          e.paused ? e.play() : e.pause();
-        },
-        seekFraction: (t) => {
-          e.duration && (e.currentTime = t * e.duration);
-        },
-        setVolume: (t) => {
-          e.volume = t, t > 0 && (e.muted = !1);
-        },
-        toggleMute: () => {
-          e.muted = !e.muted;
-        },
-        exitVR: () => this.exitVR(),
-        recenter: () => this.recenter()
-      }
-    });
-  }
-  /** Recenter the view: make the viewer's current spot and facing the origin, so the
-   *  video front is straight ahead again. Resets yaw and horizontal position; keeps
-   *  head height and a level horizon (no pitch/roll). */
-  recenter() {
-    const e = this.renderer.xr;
-    if (!e.isPresenting) return;
-    const t = e.getReferenceSpace();
-    if (!t) return;
-    const s = e.getCamera(), i = s.getWorldPosition(new l.Vector3()), r = new l.Euler().setFromQuaternion(s.getWorldQuaternion(new l.Quaternion()), "YXZ").y, n = new l.Quaternion().setFromEuler(new l.Euler(0, r, 0, "YXZ")), o = new XRRigidTransform({ x: i.x, y: 0, z: i.z }, { x: n.x, y: n.y, z: n.z, w: n.w });
-    e.setReferenceSpace(t.getOffsetReferenceSpace(o));
-  }
-  /** Optional title shown on the in-VR control panel. */
-  setVRTitle(e) {
-    this.vrTitle = e;
-  }
-  w() {
-    return this.canvas.clientWidth || 1;
-  }
-  h() {
-    return this.canvas.clientHeight || 1;
-  }
-  pixelRatioFor(e) {
-    return Math.min(window.devicePixelRatio * e, 4);
-  }
-  planeAspect(e) {
-    const t = this.video.videoWidth, s = this.video.videoHeight;
-    return !t || !s ? 16 / 9 : m[e].aspect === "per-eye" ? t / 2 / s : t / s;
-  }
-  buildGeometry(e) {
-    const t = m[e].geom;
-    if (t === "sphere180") {
-      const n = new l.SphereGeometry(500, 64, 32, -Math.PI / 2, Math.PI, 0, Math.PI);
-      return n.scale(-1, 1, 1), n;
-    }
-    if (t === "sphere360") {
-      const n = new l.SphereGeometry(500, 64, 32);
-      return n.scale(-1, 1, 1), n;
-    }
-    const s = 2.4, i = s * this.planeAspect(e), r = new l.PlaneGeometry(i, s);
-    return r.translate(0, 0, -2), r;
-  }
-  /** Shift the shared video texture for the eye/half being drawn. Runs from the mesh's
-   *  onBeforeRender, so it's called once per eye per frame (the reference approach). */
-  updateStereoUV(e) {
-    const t = this.texture, s = m[this.currentMode].split;
-    let i = !0;
-    if (this.renderer.xr.isPresenting) {
-      const n = e, o = this.renderer.xr.getCamera().cameras;
-      o && o.length >= 2 ? n === o[0] ? i = !0 : n === o[1] ? i = !1 : i = Math.abs(n.matrixWorldInverse.elements[12] - o[0].matrixWorldInverse.elements[12]) <= Math.abs(n.matrixWorldInverse.elements[12] - o[1].matrixWorldInverse.elements[12]) : i = n.projectionMatrix.elements[8] <= 0;
-    }
-    const r = !i !== this.currentSwap;
-    s === "sbs" ? (t.repeat.set(0.5, 1), t.offset.set(r ? 0.5 : 0, 0)) : s === "tb" ? (t.repeat.set(1, 0.5), t.offset.set(0, r ? 0 : 0.5)) : (t.repeat.set(1, 1), t.offset.set(0, 0));
-  }
-  clearMeshes() {
-    for (const e of this.meshes)
-      this.scene.remove(e), e.geometry.dispose(), e.material.dispose();
-    this.meshes.length = 0;
-  }
-  applyProjection(e, t) {
-    m[e] || (e = "180-sbs"), this.clearMeshes(), this.currentMode = e, this.currentSwap = t;
-    const s = new l.Mesh(this.buildGeometry(e), new l.MeshBasicMaterial({ map: this.texture }));
-    s.layers.set(0), m[e].geom === "sphere180" && (s.rotation.y = Math.PI / 2), s.onBeforeRender = (i, r, n) => this.updateStereoUV(n), this.scene.add(s), this.meshes.push(s);
-  }
-  setProjection(e) {
-    this.applyProjection(e, this.currentSwap);
-  }
-  setSwapEyes(e) {
-    this.applyProjection(this.currentMode, e);
-  }
-  setFov(e) {
-    this.camera.fov = e, this.camera.updateProjectionMatrix();
-  }
-  setSupersampling(e) {
-    this.renderer.setPixelRatio(this.pixelRatioFor(e)), this.renderer.setSize(this.w(), this.h(), !1);
-  }
-  getProjection() {
-    return this.currentMode;
-  }
-  isFlat() {
-    return !!m[this.currentMode].flat;
-  }
-  onFrame(e) {
-    this.frameCbs.push(e);
-  }
-  pauseRendering() {
-    this.renderer.setAnimationLoop(null);
-  }
-  resumeRendering() {
-    this.renderer.setAnimationLoop(this.animate);
-  }
-  /** Enter immersive VR. Rejects with a readable message on failure so the caller can
-   *  surface it — instead of the silent no-op three.js's VRButton produces. Called from
-   *  a click handler so the request keeps the user's transient activation. */
-  async enterVR() {
-    if (!navigator.xr) throw new Error("WebXR is unavailable here — open the page over HTTPS or localhost.");
-    const e = await navigator.xr.requestSession("immersive-vr", this.vrSessionInit);
-    await this.renderer.xr.setSession(e);
-  }
-  exitVR() {
-    var e;
-    (e = this.renderer.xr.getSession()) == null || e.end();
-  }
-  /** Arm the browser/headset's own "Enter VR" affordance (e.g. the Quest system button). */
-  offerVR() {
-    var s;
-    const e = (s = navigator.xr) == null ? void 0 : s.offerSession;
-    if (!e) return;
-    const t = () => e.call(navigator.xr, "immersive-vr", this.vrSessionInit).then((i) => this.renderer.xr.setSession(i)).catch(() => {
-    });
-    this.renderer.xr.addEventListener("sessionend", () => void t()), t();
-  }
-  dispose() {
-    var e;
-    this.ro.disconnect(), this.renderer.setAnimationLoop(null), (e = this.vrControls) == null || e.dispose(), this.texture.dispose(), this.clearMeshes(), this.renderer.dispose();
-  }
-}
-const L = Math.PI / 180;
-function D(a, e) {
-  return {
-    lon: Math.max(-90, Math.min(90, a)),
-    lat: Math.max(-85, Math.min(85, e))
-  };
-}
-class $ {
-  constructor(e, t, s = {}) {
-    this.camera = e, this.dom = t, this.lon = 0, this.lat = 0, this.dragging = !1, this.px = 0, this.py = 0, this.enabled = !0, this.onDown = (i) => {
-      this.enabled && (this.dragging = !0, this.px = i.clientX, this.py = i.clientY, this.capture("setPointerCapture", i.pointerId));
-    }, this.onMove = (i) => {
-      if (!this.dragging) return;
-      const r = i.clientX - this.px, n = i.clientY - this.py;
-      this.px = i.clientX, this.py = i.clientY, { lon: this.lon, lat: this.lat } = D(this.lon - r * 0.15, this.lat + n * 0.15);
-    }, this.onUp = (i) => {
-      this.dragging = !1, this.capture("releasePointerCapture", i.pointerId);
-    }, this.isPresenting = s.isPresenting ?? (() => !1), this.dom.addEventListener("pointerdown", this.onDown), this.dom.addEventListener("pointermove", this.onMove), this.dom.addEventListener("pointerup", this.onUp), this.dom.addEventListener("pointercancel", this.onUp);
-  }
-  capture(e, t) {
-    var s, i;
-    try {
-      (i = (s = this.dom)[e]) == null || i.call(s, t);
-    } catch {
-    }
-  }
-  update() {
-    if (this.isPresenting() || !this.enabled) return;
-    const e = (90 - this.lat) * L, t = this.lon * L;
-    this.camera.lookAt(
-      Math.sin(e) * Math.sin(t),
-      Math.cos(e),
-      -Math.sin(e) * Math.cos(t)
-    );
-  }
-  reset() {
-    this.lon = 0, this.lat = 0;
-  }
-  setEnabled(e) {
-    this.enabled = e, e || (this.lon = 0, this.lat = 0, this.camera.lookAt(0, 0, -1));
-  }
-  getAngles() {
-    return { lon: this.lon, lat: this.lat };
-  }
-  dispose() {
-    this.dom.removeEventListener("pointerdown", this.onDown), this.dom.removeEventListener("pointermove", this.onMove), this.dom.removeEventListener("pointerup", this.onUp), this.dom.removeEventListener("pointercancel", this.onUp);
-  }
-}
-class G {
-  constructor() {
-    this.hls = null;
-  }
-  async attach(e, t, s = {}) {
-    this.dispose();
-    const i = s.crossOrigin === void 0 ? "anonymous" : s.crossOrigin;
-    i === null ? e.removeAttribute("crossorigin") : e.crossOrigin = i, e.playsInline = !0;
-    const { url: r, format: n } = t, o = n === "hls" || n === "dash", h = e.canPlayType("application/vnd.apple.mpegurl") !== "";
-    return new Promise((u, c) => {
-      const p = () => {
-        e.removeEventListener("loadedmetadata", g), e.removeEventListener("error", d);
-      }, g = () => {
-        p(), u();
-      }, d = () => {
-        p();
-        const f = e.error ? e.error.code : "unknown";
-        c(new Error(`Video failed to load (media error ${f}). Is the source reachable and CORS-clean?`));
-      };
-      e.addEventListener("loadedmetadata", g), e.addEventListener("error", d), o && !h ? import("hls.js").then(({ default: f }) => {
-        if (!f.isSupported()) {
-          p(), c(new Error("HLS/DASH stream needs hls.js, which is unsupported in this browser."));
-          return;
-        }
-        this.hls = new f({ enableWorker: !0 }), this.hls.on(f.Events.ERROR, (Q, b) => {
-          b.fatal && (p(), this.dispose(), c(new Error(`HLS fatal error: ${b.type} / ${b.details}`)));
-        }), this.hls.loadSource(r), this.hls.attachMedia(e);
-      }).catch(() => {
-        p(), c(new Error('This looks like an HLS/DASH stream but hls.js could not be loaded. Install "hls.js".'));
-      }) : (e.src = r, e.load());
-    });
-  }
-  dispose() {
-    this.hls && (this.hls.destroy(), this.hls = null);
-  }
-}
-export {
-  $ as L,
-  m as M,
-  z as P,
-  j as S,
-  G as V,
-  U as a,
-  _ as b,
-  D as c,
-  k as d,
-  R as f,
-  H as i
-};
-//# sourceMappingURL=VideoSource-Cx7XPpvZ.js.map