@displayxr/inline3d 1.27.0 → 1.29.0

package/js/call/qr.js

@@ -0,0 +1,283 @@
+// call/qr.js — a small, dependency-free QR Code encoder for the invite link (a tablet scanning a
+// laptop screen, RFC §6). Byte mode only, versions 1-10, error correction L or M: plenty for an
+// invite URL (10-M holds 213 bytes). The algorithm follows ISO/IEC 18004 as laid out in Project
+// Nayuki's reference encoder (MIT); verified against OpenCV's decoder while developing, and pinned
+// by a golden matrix in test/call.test.mjs.
+
+// Error-correction codewords per block, and number of blocks, indexed [ecl][version]; ecl L=0, M=1.
+const ECC_PER_BLOCK = [
+  [-1, 7, 10, 15, 20, 26, 18, 20, 24, 30, 18],
+  [-1, 10, 16, 26, 18, 24, 16, 18, 22, 22, 26],
+];
+const NUM_BLOCKS = [
+  [-1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 4],
+  [-1, 1, 1, 1, 2, 2, 4, 4, 4, 5, 5],
+];
+const FORMAT_BITS = [1, 0]; // L, M
+const MAX_VERSION = 10;
+
+function rawDataModules(ver) {
+  let r = (16 * ver + 128) * ver + 64;
+  if (ver >= 2) {
+    const n = Math.floor(ver / 7) + 2;
+    r -= (25 * n - 10) * n - 55;
+    if (ver >= 7) r -= 36;
+  }
+  return r;
+}
+const dataCodewords = (ver, e) => Math.floor(rawDataModules(ver) / 8) - ECC_PER_BLOCK[e][ver] * NUM_BLOCKS[e][ver];
+
+function gfMul(x, y) {
+  let z = 0;
+  for (let i = 7; i >= 0; i--) {
+    z = (z << 1) ^ ((z >>> 7) * 0x11d);
+    z ^= ((y >>> i) & 1) * x;
+  }
+  return z;
+}
+function rsDivisor(degree) {
+  const r = new Array(degree - 1).fill(0);
+  r.push(1);
+  let root = 1;
+  for (let i = 0; i < degree; i++) {
+    for (let j = 0; j < r.length; j++) {
+      r[j] = gfMul(r[j], root);
+      if (j + 1 < r.length) r[j] ^= r[j + 1];
+    }
+    root = gfMul(root, 0x02);
+  }
+  return r;
+}
+function rsRemainder(data, divisor) {
+  const r = divisor.map(() => 0);
+  for (const b of data) {
+    const f = b ^ r.shift();
+    r.push(0);
+    divisor.forEach((c, i) => (r[i] ^= gfMul(c, f)));
+  }
+  return r;
+}
+
+/**
+ * Encode `text` (UTF-8) as a QR matrix.
+ * @param {string} text
+ * @param {{ ecl?: 'L'|'M', mask?: number }} [opts]  `mask` forces one of the 8 masks (tests)
+ * @returns {{ version: number, size: number, mask: number, modules: boolean[][] }}  true = dark
+ */
+export function qrEncode(text, opts = {}) {
+  const e = opts.ecl === 'L' ? 0 : 1;
+  const bytes = [...new TextEncoder().encode(String(text))];
+  let ver = 1;
+  for (; ver <= MAX_VERSION; ver++) {
+    const ccBits = ver <= 9 ? 8 : 16;
+    if (4 + ccBits + bytes.length * 8 <= dataCodewords(ver, e) * 8) break;
+  }
+  if (ver > MAX_VERSION) throw new Error(`qrEncode: ${bytes.length} bytes is too long for a version-${MAX_VERSION} code`);
+
+  // Data bits: mode 0100 (byte), count, payload, terminator, byte pad, 0xEC/0x11 fill.
+  const bits = [];
+  const put = (v, n) => {
+    for (let i = n - 1; i >= 0; i--) bits.push((v >>> i) & 1);
+  };
+  put(0b0100, 4);
+  put(bytes.length, ver <= 9 ? 8 : 16);
+  for (const b of bytes) put(b, 8);
+  const cap = dataCodewords(ver, e) * 8;
+  put(0, Math.min(4, cap - bits.length));
+  put(0, (8 - (bits.length % 8)) % 8);
+  for (let pad = 0xec; bits.length < cap; pad ^= 0xec ^ 0x11) put(pad, 8);
+  const data = [];
+  for (let i = 0; i < bits.length; i += 8) data.push(bits.slice(i, i + 8).reduce((a, b) => (a << 1) | b, 0));
+
+  // Split into blocks, add Reed-Solomon ECC, interleave.
+  const nb = NUM_BLOCKS[e][ver];
+  const eccLen = ECC_PER_BLOCK[e][ver];
+  const raw = Math.floor(rawDataModules(ver) / 8);
+  const nShort = nb - (raw % nb);
+  const shortLen = Math.floor(raw / nb);
+  const div = rsDivisor(eccLen);
+  const blocks = [];
+  for (let i = 0, k = 0; i < nb; i++) {
+    const dat = data.slice(k, k + shortLen - eccLen + (i < nShort ? 0 : 1));
+    k += dat.length;
+    const ecc = rsRemainder(dat, div);
+    if (i < nShort) dat.push(0);
+    blocks.push(dat.concat(ecc));
+  }
+  const codewords = [];
+  for (let i = 0; i < blocks[0].length; i++) {
+    for (let j = 0; j < blocks.length; j++) if (i !== shortLen - eccLen || j >= nShort) codewords.push(blocks[j][i]);
+  }
+
+  // Function patterns.
+  const size = ver * 4 + 17;
+  const mod = Array.from({ length: size }, () => new Array(size).fill(false));
+  const fn = Array.from({ length: size }, () => new Array(size).fill(false));
+  const set = (x, y, dark) => {
+    mod[y][x] = dark;
+    fn[y][x] = true;
+  };
+  for (let i = 0; i < size; i++) {
+    set(6, i, i % 2 === 0);
+    set(i, 6, i % 2 === 0);
+  }
+  const finder = (cx, cy) => {
+    for (let dy = -4; dy <= 4; dy++)
+      for (let dx = -4; dx <= 4; dx++) {
+        const d = Math.max(Math.abs(dx), Math.abs(dy));
+        const x = cx + dx;
+        const y = cy + dy;
+        if (x >= 0 && x < size && y >= 0 && y < size) set(x, y, d !== 2 && d !== 4);
+      }
+  };
+  finder(3, 3);
+  finder(size - 4, 3);
+  finder(3, size - 4);
+  const align = [];
+  if (ver > 1) {
+    const n = Math.floor(ver / 7) + 2;
+    const step = Math.ceil((ver * 4 + 4) / (n * 2 - 2)) * 2;
+    align.push(6);
+    for (let pos = size - 7; align.length < n; pos -= step) align.splice(1, 0, pos);
+  }
+  for (let i = 0; i < align.length; i++)
+    for (let j = 0; j < align.length; j++) {
+      if ((i === 0 && j === 0) || (i === 0 && j === align.length - 1) || (i === align.length - 1 && j === 0)) continue;
+      for (let dy = -2; dy <= 2; dy++)
+        for (let dx = -2; dx <= 2; dx++) set(align[i] + dx, align[j] + dy, Math.max(Math.abs(dx), Math.abs(dy)) !== 1);
+    }
+  const drawFormat = (mask) => {
+    const d = (FORMAT_BITS[e] << 3) | mask;
+    let rem = d;
+    for (let i = 0; i < 10; i++) rem = (rem << 1) ^ ((rem >>> 9) * 0x537);
+    const b = ((d << 10) | rem) ^ 0x5412;
+    const bit = (i) => ((b >>> i) & 1) !== 0;
+    for (let i = 0; i <= 5; i++) set(8, i, bit(i));
+    set(8, 7, bit(6));
+    set(8, 8, bit(7));
+    set(7, 8, bit(8));
+    for (let i = 9; i < 15; i++) set(14 - i, 8, bit(i));
+    for (let i = 0; i < 8; i++) set(size - 1 - i, 8, bit(i));
+    for (let i = 8; i < 15; i++) set(8, size - 15 + i, bit(i));
+    set(8, size - 8, true);
+  };
+  drawFormat(0); // reserve the format areas before placing data
+  if (ver >= 7) {
+    let rem = ver;
+    for (let i = 0; i < 12; i++) rem = (rem << 1) ^ ((rem >>> 11) * 0x1f25);
+    const b = (ver << 12) | rem;
+    for (let i = 0; i < 18; i++) {
+      const dark = ((b >>> i) & 1) !== 0;
+      const a = size - 11 + (i % 3);
+      const c = Math.floor(i / 3);
+      set(a, c, dark);
+      set(c, a, dark);
+    }
+  }
+
+  // Data, zig-zag from the bottom-right, skipping the vertical timing column.
+  let i = 0;
+  for (let right = size - 1; right >= 1; right -= 2) {
+    if (right === 6) right = 5;
+    for (let vert = 0; vert < size; vert++)
+      for (let j = 0; j < 2; j++) {
+        const x = right - j;
+        const up = ((right + 1) & 2) === 0;
+        const y = up ? size - 1 - vert : vert;
+        if (!fn[y][x] && i < codewords.length * 8) {
+          mod[y][x] = ((codewords[i >>> 3] >>> (7 - (i & 7))) & 1) !== 0;
+          i++;
+        }
+      }
+  }
+
+  const applyMask = (m) => {
+    for (let y = 0; y < size; y++)
+      for (let x = 0; x < size; x++) {
+        if (fn[y][x]) continue;
+        let inv;
+        switch (m) {
+          case 0: inv = (x + y) % 2 === 0; break;
+          case 1: inv = y % 2 === 0; break;
+          case 2: inv = x % 3 === 0; break;
+          case 3: inv = (x + y) % 3 === 0; break;
+          case 4: inv = (Math.floor(x / 3) + Math.floor(y / 2)) % 2 === 0; break;
+          case 5: inv = ((x * y) % 2) + ((x * y) % 3) === 0; break;
+          case 6: inv = (((x * y) % 2) + ((x * y) % 3)) % 2 === 0; break;
+          default: inv = (((x + y) % 2) + ((x * y) % 3)) % 2 === 0;
+        }
+        if (inv) mod[y][x] = !mod[y][x];
+      }
+  };
+
+  let mask = Number.isInteger(opts.mask) ? opts.mask : -1;
+  if (mask < 0) {
+    let best = Infinity;
+    for (let m = 0; m < 8; m++) {
+      applyMask(m);
+      drawFormat(m);
+      const p = penalty(mod, size);
+      if (p < best) {
+        best = p;
+        mask = m;
+      }
+      applyMask(m); // XOR again = undo
+    }
+  }
+  applyMask(mask);
+  drawFormat(mask);
+  return { version: ver, size, mask, modules: mod };
+}
+
+/** The standard mask penalty (N1 runs, N2 2x2 blocks, N3 finder-like runs, N4 balance). */
+function penalty(m, size) {
+  let p = 0;
+  const lines = [];
+  for (let y = 0; y < size; y++) lines.push(m[y]);
+  for (let x = 0; x < size; x++) lines.push(m.map((row) => row[x]));
+  for (const line of lines) {
+    let run = 1;
+    for (let i = 1; i <= size; i++) {
+      if (i < size && line[i] === line[i - 1]) run++;
+      else {
+        if (run >= 5) p += run - 2;
+        run = 1;
+      }
+    }
+    const s = line.map((v) => (v ? '1' : '0')).join('');
+    for (const pat of ['10111010000', '00001011101']) {
+      for (let at = s.indexOf(pat); at >= 0; at = s.indexOf(pat, at + 1)) p += 40;
+    }
+  }
+  let dark = 0;
+  for (let y = 0; y < size; y++)
+    for (let x = 0; x < size; x++) {
+      if (m[y][x]) dark++;
+      if (x < size - 1 && y < size - 1) {
+        const c = m[y][x];
+        if (c === m[y][x + 1] && c === m[y + 1][x] && c === m[y + 1][x + 1]) p += 3;
+      }
+    }
+  const total = size * size;
+  p += Math.floor(Math.abs(dark * 20 - total * 10) / total) * 10;
+  return p;
+}
+
+/**
+ * Draw a QR code for `text` into a 2D canvas (with the standard 4-module quiet zone). A plain 2D
+ * canvas, never registered with the wall — it is chrome, not content.
+ * @param {HTMLCanvasElement} canvas
+ * @param {string} text
+ * @param {{ px?: number, dark?: string, light?: string, ecl?: 'L'|'M' }} [opts]
+ */
+export function drawQr(canvas, text, { px = 4, dark = '#000', light = '#fff', ecl = 'M' } = {}) {
+  const q = qrEncode(text, { ecl });
+  const n = q.size + 8;
+  canvas.width = canvas.height = n * px;
+  const g = canvas.getContext('2d');
+  g.fillStyle = light;
+  g.fillRect(0, 0, n * px, n * px);
+  g.fillStyle = dark;
+  for (let y = 0; y < q.size; y++) for (let x = 0; x < q.size; x++) if (q.modules[y][x]) g.fillRect((x + 4) * px, (y + 4) * px, px, px);
+  return q;
+}

package/js/call/sdp.js

@@ -0,0 +1,86 @@
+// call/sdp.js — video codec preference: VP9 > VP8 > AV1, then whatever else the browser offers.
+//
+// The DisplayXR Browser is a proprietary-codec-free build: it has NO H.264. A call must never
+// require H.264, so it is never preferred — it stays in the list (after ours) only so a peer that
+// can do nothing else still negotiates. Safari negotiates VP8 (and VP9 on recent builds).
+//
+// Two mechanisms, same order: `RTCRtpTransceiver.setCodecPreferences` where it exists (every
+// current engine), and SDP munging of the `m=video` line as the fallback. Both are pure here.
+
+/** Preferred video codecs, best first (mime subtype, upper case). */
+export const VIDEO_CODEC_ORDER = Object.freeze(['VP9', 'VP8', 'AV1']);
+
+/** Rank of a codec name: its index in VIDEO_CODEC_ORDER, or order.length for everything else. */
+export function codecRank(name, order = VIDEO_CODEC_ORDER) {
+  const i = order.indexOf(String(name || '').toUpperCase());
+  return i < 0 ? order.length : i;
+}
+
+/**
+ * Sort `RTCRtpCodecCapability[]` (from `RTCRtpReceiver.getCapabilities('video').codecs`) into
+ * our preference order. Stable within a rank, so the browser's own order among VP9 profiles, and
+ * RTX/RED/FEC placement, is kept. Pure.
+ */
+export function sortCodecCapabilities(codecs, order = VIDEO_CODEC_ORDER) {
+  const rank = (c) => codecRank(String(c.mimeType || '').split('/')[1], order);
+  return codecs
+    .map((c, i) => ({ c, i, r: rank(c) }))
+    .sort((a, b) => a.r - b.r || a.i - b.i)
+    .map((x) => x.c);
+}
+
+/**
+ * Reorder the payload types on the `m=video` line so VP9 > VP8 > AV1 come first, each followed
+ * by its RTX (`a=fmtp:<rtx> apt=<pt>`). Everything else keeps its relative order behind them.
+ * Returns the SDP unchanged if there is no video section. Pure.
+ * @param {string} sdp
+ */
+export function preferVideoCodecs(sdp, order = VIDEO_CODEC_ORDER) {
+  if (!sdp) return sdp;
+  const eol = sdp.includes('\r\n') ? '\r\n' : '\n';
+  const lines = sdp.split(eol);
+  const mi = lines.findIndex((l) => l.startsWith('m=video'));
+  if (mi < 0) return sdp;
+  let end = lines.findIndex((l, i) => i > mi && l.startsWith('m='));
+  if (end < 0) end = lines.length;
+  const section = lines.slice(mi, end);
+  const nameOf = new Map(); // pt -> codec name
+  const rtxFor = new Map(); // apt -> [rtx pts]
+  for (const l of section) {
+    const m = l.match(/^a=rtpmap:(\d+) ([\w-]+)\//);
+    if (m) nameOf.set(m[1], m[2].toUpperCase());
+    const f = l.match(/^a=fmtp:(\d+) apt=(\d+)/);
+    if (f) {
+      if (!rtxFor.has(f[2])) rtxFor.set(f[2], []);
+      rtxFor.get(f[2]).push(f[1]);
+    }
+  }
+  const parts = lines[mi].split(' ');
+  const pts = parts.slice(3);
+  const picked = [];
+  for (const want of order) {
+    for (const pt of pts) {
+      if (nameOf.get(pt) === want && !picked.includes(pt)) {
+        picked.push(pt);
+        for (const rtx of rtxFor.get(pt) || []) if (pts.includes(rtx) && !picked.includes(rtx)) picked.push(rtx);
+      }
+    }
+  }
+  if (!picked.length) return sdp;
+  const rest = pts.filter((p) => !picked.includes(p));
+  lines[mi] = [...parts.slice(0, 3), ...picked, ...rest].join(' ');
+  return lines.join(eol);
+}
+
+/** The codec names on the `m=video` line, in order (for tests and diagnostics). */
+export function videoCodecOrder(sdp) {
+  const lines = String(sdp || '').split(/\r?\n/);
+  const mi = lines.findIndex((l) => l.startsWith('m=video'));
+  if (mi < 0) return [];
+  const names = new Map();
+  for (const l of lines) {
+    const m = l.match(/^a=rtpmap:(\d+) ([\w-]+)\//);
+    if (m) names.set(m[1], m[2].toUpperCase());
+  }
+  return lines[mi].split(' ').slice(3).map((pt) => names.get(pt) || pt);
+}

package/js/call/signaling.js

@@ -0,0 +1,203 @@
+// call/signaling.js — the SignalingAdapter seam, and the adapter the SDK ships.
+//
+// A SignalingAdapter is ANY object with `join(room, hooks) → Promise<SignalingSession>`:
+//
+//   join(room, {
+//     id,            // this peer's id (the transport picks it; stable across reconnects)
+//     maxPeers,      // the room size this peer asks for
+//     onPeerJoined(id), onPeerLeft(id), onSignal(fromId, data),
+//     onDisconnect(err?), onReconnect(peerIds),
+//   }) → Promise<{ id, peers: string[], iceServers?: RTCIceServer[], send(to, data), leave() }>
+//
+// It rejects with an Error whose `code` is 'room-full' when the room is at capacity. That is the
+// whole contract: presence, a relay for opaque offer/answer/ICE blobs, and leaving. Bring your
+// own (your accounts, your push service) by implementing it — see call.d.ts.
+//
+//   dxrSignaling(url)  the `dxr-signal/1` JSON-over-WebSocket protocol (signaling/README.md), served
+//                      by the reference Cloudflare Worker or `node signaling/dev-server.mjs`.
+//   (peerjsCloud, the demo adapter over the public PeerJS broker, left the package in 1.29 —
+//    RFC 0003 Decision 12 — and lives in samples/call/peerjs-cloud.js as a worked example.)
+
+import { backoffMs } from './wire.js';
+
+export const SIGNAL_PROTOCOL = 'dxr-signal/1';
+
+function codedError(code, message) {
+  const e = new Error(`@displayxr/inline3d/call: ${message}`);
+  /** @type {any} */ (e).code = code;
+  return e;
+}
+
+/** SHA-256 hex of the room id: the only room-derived value that goes into a URL. */
+export async function roomKey(room) {
+  const digest = await globalThis.crypto.subtle.digest('SHA-256', new TextEncoder().encode(String(room)));
+  return [...new Uint8Array(digest)].map((b) => b.toString(16).padStart(2, '0')).join('');
+}
+
+/**
+ * The `dxr-signal/1` client. `url` is the server's base (`wss://signal.example.com` or
+ * `ws://localhost:8787`); the adapter connects to `<url>/v1/connect?k=<sha256(room)>`.
+ *
+ * A dropped socket is reconnected with backoff and the SAME peer id, so media that is flowing
+ * peer-to-peer is not torn down by a signalling blip.
+ *
+ * @param {string} url
+ * @param {{ WebSocket?: any, pingMs?: number, key?: string }} [opts]  `key`: a publishable key for
+ *        the hosted service (RFC 0003 §5a), sent as a query parameter on connect. Public by design
+ *        (it sits in page source); a server that does not know keys ignores it.
+ */
+/**
+ * The hosted DisplayXR `dxr-signal/1` server (a Cloudflare Worker running `signaling/worker.mjs`,
+ * config in `signaling/deploy/displayxr.toml`). It also mints short-lived TURN credentials per
+ * join. `dxrSignaling()` with no URL uses it; pass your own URL to self-host.
+ */
+export const DXR_SIGNAL_DEFAULT = 'wss://dxr-signal.displayxr.workers.dev';
+
+export function dxrSignaling(url = DXR_SIGNAL_DEFAULT, opts = {}) {
+  if (!url || typeof url !== 'string') {
+    throw codedError(
+      'no-signaling-url',
+      'dxrSignaling(url): url must be a ws:// or wss:// string (omit it for the hosted DisplayXR server)'
+    );
+  }
+  const base = url.replace(/\/+$/, '');
+  const WS = opts.WebSocket || globalThis.WebSocket;
+  const pingMs = opts.pingMs || 20000;
+
+  return {
+    name: 'dxr',
+    url: base,
+    async join(room, hooks) {
+      const key = await roomKey(room);
+      const endpoint = `${base}/v1/connect?k=${key}${typeof opts.key === 'string' && opts.key ? `&key=${encodeURIComponent(opts.key)}` : ''}`;
+      let ws = null;
+      let left = false;
+      let attempt = 0;
+      let pingTimer = null;
+      let known = new Set();
+      let queue = [];
+
+      const open = (isReconnect) =>
+        new Promise((resolve, reject) => {
+          let settled = false;
+          let joined = false;
+          const sock = new WS(endpoint);
+          ws = sock;
+          const fail = (err) => {
+            if (!settled) {
+              settled = true;
+              try {
+                sock.close(); // a failed join never leaves a socket behind
+              } catch {
+                /* already closing */
+              }
+              reject(err);
+            }
+          };
+          sock.onopen = () => {
+            sock.send(JSON.stringify({ t: 'join', v: 1, room, id: hooks.id, max: hooks.maxPeers }));
+          };
+          sock.onmessage = (ev) => {
+            let msg;
+            try {
+              msg = JSON.parse(typeof ev.data === 'string' ? ev.data : String(ev.data));
+            } catch {
+              return;
+            }
+            switch (msg.t) {
+              case 'welcome': {
+                attempt = 0;
+                const peers = Array.isArray(msg.peers) ? msg.peers.filter((p) => typeof p === 'string') : [];
+                clearInterval(pingTimer);
+                pingTimer = setInterval(() => sendRaw({ t: 'ping' }), pingMs);
+                const flush = queue;
+                queue = [];
+                for (const m of flush) sendRaw(m);
+                if (isReconnect) {
+                  const now = new Set(peers);
+                  for (const p of known) if (!now.has(p)) hooks.onPeerLeft?.(p);
+                  known = now;
+                  hooks.onReconnect?.(peers);
+                } else known = new Set(peers);
+                settled = true;
+                joined = true;
+                resolve({ id: msg.id, peers, iceServers: Array.isArray(msg.iceServers) ? msg.iceServers : undefined, max: msg.max });
+                break;
+              }
+              case 'full':
+                left = true;
+                fail(codedError('room-full', `this call is full (${msg.max} participants)`));
+                break;
+              case 'error':
+                if (!settled && ['bad-room', 'bad-id', 'bad-version'].includes(msg.code)) {
+                  left = true;
+                  fail(codedError(msg.code, msg.message || msg.code));
+                } else if (!settled && msg.code === 'id-taken') {
+                  // A reconnect raced the server noticing the old socket close: retry shortly.
+                  fail(codedError('id-taken', 'peer id still held; retrying'));
+                }
+                break;
+              case 'peer-joined':
+                if (typeof msg.id === 'string' && !known.has(msg.id)) {
+                  known.add(msg.id);
+                  hooks.onPeerJoined?.(msg.id);
+                }
+                break;
+              case 'peer-left':
+                if (typeof msg.id === 'string') {
+                  known.delete(msg.id);
+                  hooks.onPeerLeft?.(msg.id);
+                }
+                break;
+              case 'signal':
+                if (typeof msg.from === 'string') hooks.onSignal?.(msg.from, msg.data);
+                break;
+            }
+          };
+          sock.onerror = () => fail(codedError('signaling-unreachable', `cannot reach ${base}`));
+          sock.onclose = () => {
+            clearInterval(pingTimer);
+            fail(codedError('signaling-closed', 'signalling closed before joining'));
+            if (joined && !left && ws === sock) reconnect();
+          };
+        });
+
+      const sendRaw = (m) => {
+        if (ws && ws.readyState === 1) ws.send(JSON.stringify(m));
+        else if (!left) queue.push(m);
+      };
+
+      const reconnect = () => {
+        hooks.onDisconnect?.();
+        const tryAgain = () => {
+          if (left) return;
+          open(true).catch((err) => {
+            if (left || (err && err.code === 'room-full')) {
+              hooks.onDisconnect?.(err);
+              return;
+            }
+            setTimeout(tryAgain, backoffMs(attempt++, { baseMs: 500, maxMs: 15000 }));
+          });
+        };
+        setTimeout(tryAgain, backoffMs(attempt++, { baseMs: 300, maxMs: 15000 }));
+      };
+
+      const first = await open(false);
+      return {
+        ...first,
+        send: (to, data) => sendRaw({ t: 'signal', to, data }),
+        leave: () => {
+          if (left) return;
+          left = true;
+          clearInterval(pingTimer);
+          try {
+            if (ws && ws.readyState === 1) ws.send(JSON.stringify({ t: 'leave' }));
+            ws && ws.close(1000, 'leave');
+          } catch {
+            /* ignore */
+          }
+        },
+      };
+    },
+  };
+}