@displayxr/inline3d 1.26.0 → 1.28.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);
+}