From 1ddc7d2ab4c4ceb0314dc04d66b11026032a7643 Mon Sep 17 00:00:00 2001
From: "prompt.ac/@jeffrey" <mail@aesthetic.computer>
Date: Fri, 24 Apr 2026 14:44:35 -0700
Subject: [PATCH] camera: restore landscape constraint + EXIF-6 rotation;
 bypass SW for bios/disk
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Research from webrtcHacks, Snap Camera Kit, and addpipe confirmed two
things:

1. iOS Safari (and modern Android Chrome) hand drawImage(video) the raw
   landscape sensor buffer — they do NOT pre-rotate to match device
   orientation. The CSS-rotated <video> display is decoupled from the
   pixel buffer that drawImage / MediaRecorder receive.
2. The robust pattern is to always request landscape constraints (the
   sensor's native orientation), and rotate manually in canvas — iPhone
   tags portrait captures EXIF orientation 6 (= rotate 90° CW for
   display), so canvas.rotate(+PI/2) is the correct default.

Restored from my earlier (mistaken) "let the browser auto-rotate"
attempt:

bios.mjs:
- getDevice(): re-add the width/height swap on mobile portrait so
  getUserMedia gets a landscape request. Otherwise iOS may stick the
  stream at whatever orientation getUserMedia was first called in.
- Default rotationAngle is now Math.PI / 2 (CW) for both rear and front
  cameras. The selfie mirror still flips X separately. The
  ?camrot=0|cw|180|ccw URL override stays available for on-device
  bisecting.

sw.js:
- Bump CACHE_NAME → ac-modules-v8 so existing v7 SWs reactivate and
  drop their stale entries.
- Pull bios.mjs and lib/disk.mjs out of PRECACHE_MODULES and add them
  to NEVER_CACHE while we iterate. They're at the heart of the
  rotation/telemetry feedback loop and the stale-while-revalidate
  pattern is what kept the iPhone running pre-fix code for hours
  after deploys. Will revert this once the rotation default is
  locked in.
---
 system/public/aesthetic.computer/bios.mjs | 46 ++++++++++++++---------
 system/public/sw.js                       | 14 +++++--
 2 files changed, 38 insertions(+), 22 deletions(-)

diff --git a/system/public/aesthetic.computer/bios.mjs b/system/public/aesthetic.computer/bios.mjs
index ad4a5dfd30..5a9d63a809 100644
--- a/system/public/aesthetic.computer/bios.mjs
+++ b/system/public/aesthetic.computer/bios.mjs
@@ -19862,7 +19862,7 @@ async function boot(parsed, bpm = 60, resolution, debug) {
         async function getDevice(facingModeChoice) {
           // Use local copies so we don't mutate the outer cWidth/cHeight
           // across repeated calls (camera swap, resize, etc.).
-          const reqWidth = cWidth,
+          let reqWidth = cWidth,
             reqHeight = cHeight;
 
           const constraints = {
@@ -19870,12 +19870,24 @@ async function boot(parsed, bpm = 60, resolution, debug) {
             frameRate: { ideal: 30 },
           };
 
-          // Ask for what we actually want. On mobile portrait, iOS Safari
-          // and modern Android Chrome already present the stream oriented
-          // to match the device (auto-rotated for the <video> element and
-          // drawImage()), so we do NOT swap width/height to force a
-          // landscape request. If the browser gives us a landscape stream
-          // anyway, the detection path in process() will rotate it to fit.
+          // Mobile camera sensors are physically landscape. Per Snap and
+          // webrtcHacks: always request landscape constraints, even on a
+          // portrait device — otherwise iOS Safari may refuse the request
+          // or hand back a stream stuck at the orientation present at
+          // getUserMedia time. We then rotate the canvas in process()
+          // below to fit the portrait buffer.
+          if (
+            (iOS || Android) &&
+            typeof window !== "undefined" &&
+            window.matchMedia?.("(orientation: portrait)")?.matches &&
+            (facingModeChoice === "environment" ||
+              facingModeChoice === "user")
+          ) {
+            const tmp = reqWidth;
+            reqWidth = reqHeight;
+            reqHeight = tmp;
+          }
+
           constraints.width = { ideal: reqWidth };
           constraints.height = { ideal: reqHeight };
 
@@ -20158,17 +20170,15 @@ async function boot(parsed, bpm = 60, resolution, debug) {
         // Mirror the front camera for selfie framing. Desktop webcams are
         // conventionally mirrored too. Mobile rear camera stays unmirrored.
         const needsMirror = facingMode === "user" || (!iOS && !Android);
-        // Rotation direction for sensor→buffer orientation mismatch.
-        // Front cameras are mounted mirrored relative to rear cameras, so the
-        // rotation that lands the subject upright is opposite: front = +90° CW,
-        // rear = -90° CCW. Desktop webcams behave like front cameras.
-        // 🧪 URL override for camera rotation while we bisect the correct
-        // angle on device: ?camrot=0|cw|180|ccw (0 = no rotation). Also
-        // ?camforce=1 forces the rotation path even when dims say no.
-        let rotationAngle =
-          facingMode === "user" || (!iOS && !Android)
-            ? Math.PI / 2
-            : -Math.PI / 2;
+        // EXIF orientation 6 — the convention iPhone (and most Android
+        // devices) tag portrait camera captures with — means "rotate 90°
+        // CW for display". The raw landscape sensor buffer has the
+        // subject's "up" direction at column 0, and rotating +PI/2 CW
+        // brings column 0 to the top of the rendered frame.
+        // 🧪 URL override while we bisect on device:
+        //   ?camrot=0|cw|180|ccw   manually pick the angle
+        //   ?camforce=1            force rotation even when dims say no
+        let rotationAngle = Math.PI / 2;
         let forceRotation = false;
         if (typeof location !== "undefined" && location.search) {
           const camParams = new URLSearchParams(location.search);
diff --git a/system/public/sw.js b/system/public/sw.js
index 80d859a7d7..adf1c6b3b2 100644
--- a/system/public/sw.js
+++ b/system/public/sw.js
@@ -1,15 +1,16 @@
 // Aesthetic Computer Service Worker
 // Caches JavaScript modules for faster subsequent loads
 
-const CACHE_NAME = 'ac-modules-v7'; // Bump to force fresh udp.mjs with robust respond() parsing (fixes arena:snap drops)
+const CACHE_NAME = 'ac-modules-v8'; // Bump: pull bios.mjs/disk.mjs out of the cache pipeline while we iterate on camera + telemetry
 const CACHE_DURATION = 60 * 60 * 1000; // 1 hour in ms (dev-friendly)
 
-// Critical modules to precache on install
+// Critical modules to precache on install. NOTE: bios.mjs and lib/disk.mjs
+// are intentionally absent — they sit at the heart of the rotation/telemetry
+// loop and need to ship updates within seconds, not stale-while-revalidate
+// cycles. NEVER_CACHE below also bypasses runtime caching for them.
 const PRECACHE_MODULES = [
   '/aesthetic.computer/boot.mjs',
-  '/aesthetic.computer/bios.mjs',
   '/aesthetic.computer/lib/parse.mjs',
-  '/aesthetic.computer/lib/disk.mjs',
   '/aesthetic.computer/lib/graph.mjs',
   '/aesthetic.computer/lib/num.mjs',
   '/aesthetic.computer/lib/help.mjs',
@@ -44,6 +45,11 @@ const NEVER_CACHE = [
   /\/disks\/.*\.mjs$/, // User pieces should always be fresh
   /\?v=/, // Cache-busted URLs
   /localhost:8889/, // Session server
+  // 🚧 Pinned-to-network while iterating on camera rotation + piece-runs
+  // telemetry. Restore caching for these once the rotation default is
+  // locked in.
+  /\/aesthetic\.computer\/bios\.mjs$/,
+  /\/aesthetic\.computer\/lib\/disk\.mjs$/,
 ];
 
 self.addEventListener('install', (event) => {
-- 
2.51.2