@leftoff/cli 0.9.0 → 0.9.3

package/ui/relay-client.js

@@ -7,6 +7,10 @@
 // your Macs through /_relay/api. The relay passes ciphertext. The live-update
 // stream becomes a long-poll over the same tunnel. Which Mac: the one you
 // picked in the status popover, else the most recently active one.
+//
+// 0.9.3: on a Mac that runs Leftoff itself, the same sealed calls go straight
+// to its daemon on 127.0.0.1 (ui/direct.js), and back through the relay the
+// moment that path fails.
 import { sealRequest, openResponse } from './relay-crypto.js'
 
 const meta = typeof document !== 'undefined' && document.querySelector('meta[name="leftoff-relay"]')
@@ -41,6 +45,18 @@ export async function forgetDeviceKey() {
 // ------------------------------------------------------------ state
 
 const relay = { user: RELAY_USER, device: null, key: null, status: null, mac: null, ready: null, latencyMs: null }
+// ui/direct.js loads only on the board itself (never on pair.html, which the
+// relay serves before a browser is paired and where this file is imported too).
+let route = null, directOrRelay = null
+async function loadDirect() {
+  try {
+    const d = await import('./direct.js')
+    route = new d.DirectRoute({ user: RELAY_USER, fetchImpl: realFetch, ua: navigator.userAgent, maxTouchPoints: navigator.maxTouchPoints || 0 })
+    directOrRelay = d.directOrRelay
+  } catch { route = null }
+}
+const INIT_WAIT_MS = 1200 // how long the first paint waits for this Mac's own answer
+const RELOAD_KEY = 'leftoff.direct.reloaded'
 
 function pickedMac() { try { return localStorage.getItem(MAC_KEY) } catch { return null } }
 function remember(mac) {
@@ -55,9 +71,12 @@ async function refreshStatus() {
   relay.status = await res.json()
   relay.latencyMs = Math.round(performance.now() - t0)
   const online = relay.status.macs.filter((m) => m.online).map((m) => m.machine)
-  const want = pickedMac()
-  relay.mac = want && online.includes(want) ? want : relay.status.default
-  cookieMac(relay.mac)
+  // on this Mac's direct path the board stays on this Mac, whatever the relay sees
+  if (!onDirect()) {
+    const want = pickedMac()
+    relay.mac = want && online.includes(want) ? want : relay.status.default
+    cookieMac(relay.mac)
+  }
   return relay.status
 }
 
@@ -65,8 +84,60 @@ async function init() {
   const rec = await loadDeviceKey()
   if (!rec || !rec.key || (rec.user && rec.user !== RELAY_USER)) { needsKey(); throw new Error('no device key') }
   relay.device = rec.device; relay.key = rec.key
-  await refreshStatus()
+  // Ask this computer's own Leftoff while the relay answers; a quick yes goes direct.
+  await loadDirect()
+  const probing = probeDirect()
+  const [, quick] = await Promise.all([refreshStatus(), Promise.race([probing, new Promise((r) => setTimeout(() => r(undefined), INIT_WAIT_MS))])])
+  if (quick) goDirect(quick)
+  else if (quick === undefined) probing.then((m) => { if (m) lateDirect(m) })
   if (!relay.mac) { asleep(); throw new Error('asleep') }
+  watchDirect()
+}
+
+// ------------------------------------------------------------ direct (0.9.3)
+
+function probeDirect() {
+  return route ? route.probe({ picked: pickedMac(), verify: verifyDirect }) : Promise.resolve(null)
+}
+// A sealed round trip through this Mac's daemon: only our own Mac can answer it.
+async function verifyDirect(machine) {
+  const env = await sealRequest(relay.key, { device: relay.device, machine, body: { m: 'GET', p: '/v1/remote/ping', b: null, h: {} } })
+  const out = await openResponse(relay.key, env, await route.send(env))
+  return out.s === 200
+}
+function onDirect() { return !!(route && route.on && route.machine === relay.mac) }
+function routeChanged() { try { window.dispatchEvent(new CustomEvent('leftoff-route', { detail: { route: onDirect() ? 'direct' : 'relay', mac: relay.mac } })) } catch {} }
+// A sealed response -> a fetch Response (204/304 carry no body).
+function toResponse(out) { return new Response(out.s === 204 || out.s === 205 || out.s === 304 ? null : out.b, { status: out.s, headers: out.h }) }
+function goDirect(machine) {
+  route.use(machine)
+  if (relay.mac !== machine) { relay.mac = machine; cookieMac(machine) }
+  routeChanged()
+}
+// The first answer came after the board had loaded. Same Mac: just switch.
+// Another Mac (the relay's pick), and you didn't choose it: load once more so
+// the whole board comes from this one (once per tab, so a slow daemon can't loop).
+function lateDirect(machine) {
+  if (!route || route.on) return
+  if (machine === relay.mac) return goDirect(machine)
+  if (pickedMac()) return
+  try { if (sessionStorage.getItem(RELOAD_KEY)) return; sessionStorage.setItem(RELOAD_KEY, '1') } catch { return }
+  location.reload()
+}
+function dropDirect() { routeChanged() }
+// Back on the relay: look again every minute and when the tab comes back.
+// A later yes only switches the path for the Mac already on screen.
+let watching = false
+function watchDirect() {
+  if (watching || !route || route.never) return
+  watching = true
+  const again = (focus) => {
+    if (!route.due({ focus })) return
+    probeDirect().then((m) => { if (m && !route.on && m === relay.mac) goDirect(m) })
+  }
+  setInterval(() => again(false), 15000)
+  window.addEventListener('focus', () => again(true))
+  document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible') again(true) })
 }
 
 // ------------------------------------------------------------ the tunnel
@@ -79,17 +150,38 @@ async function tunnel(url, init = {}, retried = false) {
   const h = {}
   const hdrs = new Headers(init.headers || {})
   if (hdrs.get('content-type')) h['content-type'] = hdrs.get('content-type')
-  const env = await sealRequest(relay.key, { device: relay.device, machine: relay.mac, body: { m: method, p: url.pathname + url.search, b, h } })
+  const body = { m: method, p: url.pathname + url.search, b, h }
+  if (!onDirect()) return viaRelay(body, init, retried)
+  return directOrRelay({
+    route,
+    signal: init.signal,
+    direct: async () => {
+      const env = await sealRequest(relay.key, { device: relay.device, machine: route.machine, body })
+      return toResponse(await openResponse(relay.key, env, await route.send(env, { signal: init.signal })))
+    },
+    relay: () => viaRelay(body, init, retried),
+    onDrop: dropDirect,
+  })
+}
+
+async function viaRelay(body, init, retried) {
+  const gone = relay.mac
+  const env = await sealRequest(relay.key, { device: relay.device, machine: gone, body })
   const res = await realFetch('/_relay/api', { method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' }, body: JSON.stringify(env), signal: init.signal, cache: 'no-store' })
-  if (res.status === 200) {
-    const out = await openResponse(relay.key, env, await res.json())
-    return new Response(out.b, { status: out.s, headers: out.h })
-  }
+  if (res.status === 200) return toResponse(await openResponse(relay.key, env, await res.json()))
   const j = await res.clone().json().catch(() => ({}))
   if (res.status === 401) { notPaired(j.code === 'unknown_device'); return res }
   if (res.status === 503 && j.code === 'mac_offline' && !retried) {
     // the Mac you were on went to sleep: another one takes over, or the asleep page
-    if (j.default && j.default !== relay.mac) { relay.mac = j.default; cookieMac(relay.mac); window.dispatchEvent(new CustomEvent('leftoff-relay', { detail: { mac: relay.mac, switched: true } })); return tunnel(url, init, true) }
+    // another call already moved the board to the Mac that took over: follow it
+    if (relay.mac && relay.mac !== gone) return viaRelay(body, init, true)
+    if (j.default && j.default !== gone) { relay.mac = j.default; cookieMac(relay.mac); window.dispatchEvent(new CustomEvent('leftoff-relay', { detail: { mac: relay.mac, switched: true } })); return viaRelay(body, init, true) }
+    // 0.9.3: the relay can still list a Mac that just went away (its socket
+    // closing as we asked, e.g. this Mac's daemon stopping under the direct
+    // path): look again in a moment before calling it asleep.
+    await new Promise((r) => setTimeout(r, 1500))
+    await refreshStatus().catch(() => {})
+    if (relay.mac && relay.mac !== gone) { window.dispatchEvent(new CustomEvent('leftoff-relay', { detail: { mac: relay.mac, switched: true } })); return viaRelay(body, init, true) }
     asleep()
   }
   return res
@@ -176,6 +268,9 @@ export const leftoffRelay = {
   get mac() { return relay.mac },
   get device() { return relay.device },
   get latencyMs() { return relay.latencyMs },
+  // 0.9.3: 'direct' (this Mac's own daemon over 127.0.0.1) or 'relay'
+  get route() { return onDirect() ? 'direct' : 'relay' },
+  get directLatencyMs() { return route ? route.latencyMs : null },
   status: () => refreshStatus(),
   // Switch Macs: the board reloads from the other one.
   pick(mac) { remember(mac); cookieMac(mac); location.reload() },