Live rings and going live. A face whose person is streaming wears a red ring (LIVE under the bigger ones) and opens the stream. Go live (the composer's red dot, or your profile) sends your camera or screen to coinos's live server (coinosv3-server live/: the recording over a WebSocket, HLS out), announces it as your kind 30311 once three segments exist (Chrome's own player won't start a live playlist with fewer), refreshes it each minute with how many watch, reconnects to the same stream if the link drops, and ends it with its recording. Needs a coinos name. Also: the service worker leaves /live/ and /vmedia/hls alone (it froze a live playlist at its first copy).

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_013ZDf1cyCQLkfjftYhymZAg

7 files changed, 495 insertions, 19 deletions

diff --git a/build.js b/build.js
index 163e9dc..6a10eda 100644
--- a/build.js
+++ b/build.js
@@ -86,6 +86,10 @@ self.addEventListener('fetch', (e) => {
 
   // Feed snapshots have their own short HTTP lifetime; never freeze one in Cache Storage.
   if (u.pathname === '/api/feed') return;
+  // Streams: a live playlist grows every two seconds (frozen at its first
+  // copy, the player stalled and failed), and video segments would fill the
+  // cache with what's already been watched.
+  if (u.pathname.startsWith('/live/') || u.pathname.startsWith('/vmedia/hls')) return;
 
   if (req.mode === 'navigate') {
     // A note page comes back with its thread rendered into it (the server's
diff --git a/src/app.js b/src/app.js
index 4f6a8d9..079cf7b 100644
--- a/src/app.js
+++ b/src/app.js
@@ -909,7 +909,7 @@ wallet.subscribe(scheduleRender);
 // lightbox: a full-screen photo is a place too — the phone's Back must close
 // it, not pop the screen under it (which once walked a viewer straight back
 // to the start page, so the photo's × then looked like a logout).
-const NAV_FIELDS = ['screen', 'tab', 'txDetail', 'arkMoveDetail', 'arkReconDetail', 'arkExitDetail', 'giftDetail', 'bump', 'giftMode', 'claimStep', 'chatOpen', 'msgView', 'feedId', 'pubProf', 'arkCoinsPage', 'arkExitPage', 'msgCommunity', 'msgPeer', 'profilePk', 'profEdit', 'profEditFilled', 'profOverThread', 'settingsPage', 'nameEditOpen', 'noteThread', 'liveStream', 'userSearch', 'zapSetup', 'hatShop', 'lightbox', 'mediaPager', 'feedEdit', 'settingsView'];
+const NAV_FIELDS = ['screen', 'tab', 'txDetail', 'arkMoveDetail', 'arkReconDetail', 'arkExitDetail', 'giftDetail', 'bump', 'giftMode', 'claimStep', 'chatOpen', 'msgView', 'feedId', 'pubProf', 'arkCoinsPage', 'arkExitPage', 'msgCommunity', 'msgPeer', 'profilePk', 'profEdit', 'profEditFilled', 'profOverThread', 'settingsPage', 'nameEditOpen', 'noteThread', 'liveStream', 'goLive', 'userSearch', 'zapSetup', 'hatShop', 'lightbox', 'mediaPager', 'feedEdit', 'settingsView'];
 function navSnapshot() {
   const s = {};
   for (const f of NAV_FIELDS) s[f] = ui[f] ?? null;
@@ -1921,7 +1921,7 @@ function identities() {
 function clearFeatureNav() {
   ui.arkCoinsPage = null; ui.arkExitPage = null;
   ui.profilePk = null; ui.profEdit = null; ui.profEditFilled = false;
-  ui.chatOpen = false; ui.userSearch = null; ui.noteThread = null; ui.liveStream = null; ui.zapSetup = null;
+  ui.chatOpen = false; ui.userSearch = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.zapSetup = null;
 }
 
 // Sign out of the CURRENT identity only. "Log out" locks every account on
@@ -3221,7 +3221,7 @@ function goHome() {
     ui.profilePk = null;
     ui.profEdit = null;
     ui.userSearch = null;
-    ui.noteThread = null; ui.liveStream = null;
+    ui.noteThread = null; ui.liveStream = null; ui.goLive = null;
     ui.zapSetup = null;
     ui.arkExitPage = null;
     ui.settingsPage = null;
diff --git a/src/features/messages.js b/src/features/messages.js
index 6179404..33ba903 100644
--- a/src/features/messages.js
+++ b/src/features/messages.js
@@ -3888,6 +3888,14 @@ export function messagesFeature(ctx) {
       node.onclick = (e) => { e.stopPropagation(); openProfile(pk); };
       (node._evs || (node._evs = new Set())).add('onpointerdown').add('onclick');
     }
+    // streaming now: a red ring, and the face opens the stream (the name
+    // beside it still opens the profile, which says they're on too)
+    let on = null;
+    try { on = liveHostNow(pk); } catch {} // (an avatar drawn while the feature is still being built)
+    if (on) {
+      node.classList.add('live-ring');
+      if (clickable) node.onclick = (e) => { e.stopPropagation(); openLive(on); };
+    }
     return hook('wrapAvatar', pk, node) || hatStamp(pk, node) || node;
   };
 
@@ -5785,7 +5793,7 @@ export function messagesFeature(ctx) {
     const own = p.pk === mePk() ? st().feeds.find((f) => f.d === p.d) : null;
     const id = own ? own.id : 'list:' + packKey(p);
     if (!own) adhocFeeds.set(id, { id, name: p.title || p.d, packs: [{ pk: p.pk, d: p.d, kind: p.kind === PACK_KIND ? undefined : p.kind, relays: [], title: p.title || '' }] });
-    ui.userSearch = null; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.feedEdit = null; ui.profOverThread = false;
+    ui.userSearch = null; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.feedEdit = null; ui.profOverThread = false;
     ui.chatOpen = true; ui.msgView = 'feed';
     switchFeed(id);
   }
@@ -5832,7 +5840,7 @@ export function messagesFeature(ctx) {
           onClick: () => {
             ui.listPick = null;
             // the editor lives on the feed screen; the profile gives way to it
-            ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.userSearch = null;
+            ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.userSearch = null;
             ui.chatOpen = true; ui.msgView = 'feed';
             openFeedEditor(null);
             ui.feedEdit.authors = [pk];
@@ -6151,7 +6159,7 @@ export function messagesFeature(ctx) {
   // Every kind of feed has a URL, and a visitor with no wallet can read it.
   const isVisitor = () => !wallet.mnemonic && !wallet.xpub && !wallet.xprv;
   const showFeed = (id) => {
-    ui.userSearch = null; ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.feedEdit = null;
+    ui.userSearch = null; ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.feedEdit = null;
     ui.chatOpen = true; ui.msgView = 'feed';
     if (ui.screen === 'wallet') ui.pubProf = null; // the wallet's chrome owns it
     switchFeed(id);
@@ -6352,7 +6360,7 @@ export function messagesFeature(ctx) {
     const saved = relays.length ? null : st().feeds.find((f) => !f.follows && !(f.authors || []).length && feedTopics(f).length === 1 && feedTopics(f)[0] === tag);
     const id = saved ? saved.id : 'topic:' + tag + (relays.length ? '@' + relays.join(',') : '');
     if (!saved && !adhocFeeds.has(id)) adhocFeeds.set(id, { id, name: '#' + tag, topics: [tag], relays });
-    ui.userSearch = null; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.feedEdit = null;
+    ui.userSearch = null; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.feedEdit = null;
     ui.chatOpen = true; ui.msgView = 'feed';
     switchFeed(id);
   }
@@ -8471,8 +8479,26 @@ export function messagesFeature(ctx) {
       const cur = liveSeen.get(a);
       if (!cur || cur.created_at < ev.created_at) { liveSeen.set(a, ev); changed = true; }
     }
+    if (changed) liveHostsAt = 0;
     return changed;
   }
+  // who is on now (host -> their stream), for the rings round faces: worked
+  // out again when a stream changes and every half minute (one goes stale)
+  let liveHostsAt = 0, liveHosts = new Map();
+  function liveHostNow(pk) {
+    if (!liveSeen.size) return null;
+    if (Date.now() - liveHostsAt > 30_000) {
+      liveHostsAt = Date.now();
+      const now = Date.now() / 1000;
+      liveHosts = new Map();
+      for (const ev of liveSeen.values()) {
+        if (!isLiveNow(ev, now) || !liveShowable(ev)) continue;
+        const h = liveHost(ev), cur = liveHosts.get(h);
+        if (!cur || cur.created_at < ev.created_at) liveHosts.set(h, ev);
+      }
+    }
+    return liveHosts.get(pk) || null;
+  }
   const liveSince = () => Math.floor(Date.now() / 1000) - 6 * 3600;
   function refreshLive() {
     if (liveAsking || Date.now() - liveAt < 120_000) return;
@@ -8610,7 +8636,7 @@ export function messagesFeature(ctx) {
   // leaves it alone from then on (it would strip the src hls.js set).
   function mountLivePlayer() {
     const w = liveWatch;
-    const el = document.querySelector('video.live-video');
+    const el = document.querySelector('video.live-video:not(.bc-preview)');
     if (!w || !el || el === w.video) return;
     stopLivePlayer(w);
     const ev = liveSeen.get(w.a);
@@ -8642,6 +8668,10 @@ export function messagesFeature(ctx) {
   // it (a <video> taken out of the page plays on, unheard and unseen)
   let liveShown = false;
   function liveAfterRender() {
+    // the camera shown before going live: let go of it once that screen is left
+    if (!ui.goLive && bc && bc.phase === 'setup') { bcStopMedia(); bc = null; }
+    const pv = document.querySelector('video.bc-preview');
+    if (pv && bc && bc.media && pv.srcObject !== bc.media) { pv._skipMorph = true; pv.srcObject = bc.media; pv.play().catch(() => {}); }
     if (!ui.liveStream) { stopLiveWatch(); return; }
     if (!liveShown) { stopLivePlayer(); return; }
     mountLivePlayer();
@@ -8689,6 +8719,9 @@ export function messagesFeature(ctx) {
     const s = ui.liveStream;
     const w = watchLive(s);
     liveShown = true;
+    // your own stream, going out: the camera itself, not the stream seconds behind it
+    const mine = !!bc && bc.phase === 'live' && bc.a === s.a;
+    if (mine) setTimeout(scheduleRepaint, 1000); // the clock
     const ev = liveSeen.get(s.a) || s.seed;
     const host = liveHost(ev), status = liveStatus(ev), n = liveViewers(ev);
     const src = livePlayable(ev);
@@ -8707,10 +8740,20 @@ export function messagesFeature(ctx) {
       ctx.brandHeader(!ui.pubProf && wallet.loaded),
       h('div', { class: 'card col', style: 'gap:10px' },
         h('div', { class: 'row gap6', style: 'align-items:center' },
-          backBtn(() => { ui.liveStream = null; }),
+          mine ? h('button', { class: 'iconbtn chat-back', onClick: () => { if (confirm(t('goLiveEndAsk'))) endBroadcast(); } }, '‹')
+            : backBtn(() => { ui.liveStream = null; }),
           h('h3', { class: 'live-title' }, liveTitle(ev) || t('liveUntitled')),
           liveBadge(ev)),
-        h('div', { class: 'live-player', 'data-key': 'live-player:' + s.a },
+        mine ? h('div', { class: 'row gap6 bc-bar', style: 'align-items:center' },
+          h('span', { class: 'bc-clock' }, clockOf(Date.now() / 1000 - bc.starts)),
+          h('span', { class: 'small muted' }, t('liveWatching', { n: bc.viewers || 0 })),
+          bc.reconnecting ? h('span', { class: 'small', style: 'color:var(--red)' }, t('goLiveReconnecting'))
+            : bc.behind ? h('span', { class: 'small', style: 'color:var(--red)' }, t('goLiveBehind')) : null,
+          h('button', { class: 'btn-sm bc-end', style: 'margin-left:auto', onClick: () => { if (confirm(t('goLiveEndAsk'))) endBroadcast(); } }, t('goLiveEnd'))) : null,
+        mine ? h('div', { class: 'live-player', 'data-key': 'bc-player:' + s.a },
+          h('div', { class: 'live-frame', 'data-key': 'bc-frame:' + (bc.media ? bc.media.id : '') },
+            h('video', { class: 'live-video bc-preview' + (bc.source === 'camera' && bc.facing === 'user' ? ' mirror' : ''), muted: '', playsinline: '', autoplay: '' })))
+        : h('div', { class: 'live-player', 'data-key': 'live-player:' + s.a },
           // the frame is keyed by what plays in it: the <video> itself is
           // never morphed, so a stream that ends or drops swaps the frame
           src && !w.err
@@ -8744,6 +8787,243 @@ export function messagesFeature(ctx) {
       ...noteOverlays());
   }
 
+  // ---- going live -----------------------------------------------------------
+  // The camera (or the screen) recorded in half-second chunks and sent over a
+  // WebSocket to coinos's live server (coinosv3-server live/), which makes HLS
+  // of it; the stream is announced as your kind 30311, refreshed every minute
+  // with how many watch, and ended with its recording. A coinos name's owner
+  // only: the server asks the registrar. One at a time.
+  const liveIngest = () => {
+    const local = typeof location !== 'undefined' && /^(localhost|127\.0\.0\.1)$/.test(location.hostname);
+    return (local ? location.origin : APP_BASE).replace(/^http/, 'ws') + '/live/ingest';
+  };
+  const recType = () => {
+    if (typeof MediaRecorder === 'undefined') return null;
+    return ['video/webm;codecs=h264,opus', 'video/webm;codecs=vp8,opus', 'video/webm', 'video/mp4'].find((m) => { try { return MediaRecorder.isTypeSupported(m); } catch { return false; } }) || null;
+  };
+  const canGoLive = () => !isVisitor() && typeof navigator !== 'undefined' && !!navigator.mediaDevices?.getUserMedia && !!recType();
+  const clockOf = (sec) => { sec = Math.max(0, Math.floor(sec)); const hh = Math.floor(sec / 3600), mm = Math.floor(sec / 60) % 60, ss = sec % 60; return (hh ? hh + ':' + String(mm).padStart(2, '0') : String(mm)) + ':' + String(ss).padStart(2, '0'); };
+  let bc = null; // the broadcast: { phase, title, source, facing, media, rec, ws, id, a, ev, err, ... }
+  function openGoLive() {
+    if (bc && bc.a && bc.phase === 'live') { openLive(bc.ev); return; }
+    bc = { phase: 'setup', title: '', source: 'camera', facing: 'user', media: null, err: null };
+    ui.goLive = true;
+    ui.liveStream = null;
+    render();
+    bcPreview().catch(() => {});
+  }
+  function bcStopMedia() {
+    if (bc && bc.media) for (const tr of bc.media.getTracks()) { try { tr.stop(); } catch {} }
+    if (bc) bc.media = null;
+  }
+  // the picture to send: the camera (with its microphone), or the screen
+  // (with the microphone beside it, and the tab's sound when shared)
+  async function bcPreview() {
+    const b = bc;
+    if (!b) return;
+    bcStopMedia();
+    b.err = null;
+    try {
+      let media;
+      if (b.source === 'screen') {
+        media = await navigator.mediaDevices.getDisplayMedia({ video: { frameRate: 30 }, audio: true });
+        const mic = await navigator.mediaDevices.getUserMedia({ audio: true }).catch(() => null);
+        if (mic && !media.getAudioTracks().length) for (const tr of mic.getAudioTracks()) media.addTrack(tr);
+        // the browser's own "Stop sharing" ends the stream
+        media.getVideoTracks()[0]?.addEventListener('ended', () => { if (bc === b && b.phase === 'live') endBroadcast(); });
+      } else {
+        media = await navigator.mediaDevices.getUserMedia({
+          video: { facingMode: b.facing, width: { ideal: 1280 }, height: { ideal: 720 }, frameRate: { ideal: 30 } },
+          audio: { echoCancellation: true, noiseSuppression: true },
+        });
+      }
+      if (bc !== b) { for (const tr of media.getTracks()) tr.stop(); return; }
+      b.media = media;
+      // a switch mid-stream: the recorder carries on with the new picture
+      if (b.phase === 'live') bcRecord(b, true);
+    } catch (e) {
+      if (bc === b) b.err = t(b.source === 'screen' ? 'goLiveNoScreen' : 'goLiveNoCamera');
+    }
+    render();
+  }
+  async function liveAuth(b) {
+    const id = await requireIdentity();
+    const partial = { kind: 27235, created_at: Math.floor(Date.now() / 1000), content: '',
+      tags: [['u', APP_BASE + '/live/ingest'], ['method', 'GET']] };
+    const evt = id.signer instanceof Uint8Array ? finalizeEvent(partial, id.signer) : await id.signer.signEvent(partial);
+    b.pk = id.pubkey;
+    return btoa(JSON.stringify(evt));
+  }
+  // one connection to the server: its first word is where the stream is
+  function bcConnect(b, resume) {
+    return liveAuth(b).then((auth) => new Promise((resolve, reject) => {
+      const name = (hook('namesAddress') || '').split('@')[0];
+      const ws = new WebSocket(liveIngest() + '?auth=' + encodeURIComponent(auth) + '&name=' + encodeURIComponent(name) + (resume ? '&resume=' + resume : ''));
+      ws.binaryType = 'arraybuffer';
+      let hello = false;
+      ws.onmessage = (e) => {
+        if (hello || typeof e.data !== 'string') return;
+        hello = true;
+        try { resolve({ ws, info: JSON.parse(e.data) }); } catch (err) { reject(err); }
+      };
+      ws.onerror = () => { if (!hello) reject(new Error(t('goLiveRefused'))); };
+      ws.onclose = () => {
+        if (!hello) { reject(new Error(t('goLiveRefused'))); return; }
+        if (bc === b && b.ws === ws && b.phase === 'live') bcReconnect(b);
+      };
+    }));
+  }
+  // a recorder over the current picture, its chunks to the server; a new one
+  // (a new connection, a new camera) starts a fresh recording, header and all
+  function bcRecord(b, again = false) {
+    if (b.rec) { try { b.rec.ondataavailable = null; b.rec.stop(); } catch {} }
+    if (again && b.ws) { try { b.ws.close(1000, 'switch'); } catch {} return; } // the reconnect brings the new recording
+    const rec = new MediaRecorder(b.media, { mimeType: recType(), videoBitsPerSecond: 2_500_000, audioBitsPerSecond: 128_000 });
+    rec.ondataavailable = (e) => {
+      if (!e.data || !e.data.size || bc !== b || !b.ws || b.ws.readyState !== 1) return;
+      // more than a few seconds unsent: the link can't keep up
+      b.behind = b.ws.bufferedAmount > 4_000_000;
+      e.data.arrayBuffer().then((buf) => { if (b.ws && b.ws.readyState === 1) b.ws.send(buf); });
+    };
+    rec.start(500);
+    b.rec = rec;
+  }
+  async function bcReconnect(b) {
+    if (b.reconnecting) return;
+    b.reconnecting = true;
+    b.ws = null;
+    render();
+    for (let i = 0; i < 10 && bc === b && b.phase === 'live'; i++) {
+      try {
+        const { ws, info } = await bcConnect(b, b.id);
+        if (bc !== b || b.phase !== 'live') { ws.close(); break; }
+        b.ws = ws;
+        bcRecord(b);
+        b.reconnecting = false;
+        if (info.id !== b.id) toast(t('goLiveRestarted'));
+        render();
+        return;
+      } catch {}
+      await new Promise((r) => setTimeout(r, 3000));
+    }
+    b.reconnecting = false;
+    if (bc === b && b.phase === 'live') { toast(t('goLiveLost')); endBroadcast(); }
+  }
+  // the announcement: your 30311, and its copies as the stream goes on
+  async function bcAnnounce(b, status) {
+    const id = await requireIdentity();
+    const relays = [...new Set([...LIVE_RELAYS, ...wallet.nostrRelays()])];
+    const me = profileOf(id.pubkey) || {};
+    const tags = [['d', b.id], ['title', b.title || t('goLiveDefaultTitle', { name: displayName(id.pubkey) })],
+      ['status', status], ['streaming', b.liveUrl], ['starts', String(b.starts)],
+      ['p', id.pubkey, '', 'Host'], ['relays', ...relays.slice(0, 6)], CLIENT_TAG];
+    if (me.picture) tags.push(['image', me.picture]);
+    if (status === 'live' && b.viewers != null) tags.push(['current_participants', String(b.viewers)]);
+    if (status === 'ended') tags.push(['ends', String(Math.floor(Date.now() / 1000))], ['recording', b.recording]);
+    const partial = { kind: LIVE_KIND, content: '', created_at: Math.floor(Date.now() / 1000), tags };
+    const evt = id.signer instanceof Uint8Array ? finalizeEvent(partial, id.signer) : await id.signer.signEvent(partial);
+    takeLive([evt]);
+    b.ev = evt;
+    scheduleRepaint();
+    return publishOn(relays, evt);
+  }
+  async function startBroadcast() {
+    const b = bc;
+    if (!b || b.phase !== 'setup' || !b.media) return;
+    b.phase = 'starting'; b.err = null;
+    render();
+    try {
+      const { ws, info } = await bcConnect(b, null);
+      if (bc !== b) { ws.close(); return; }
+      Object.assign(b, { ws, id: info.id, liveUrl: info.live, recording: info.recording, starts: Math.floor(Date.now() / 1000), viewers: 0 });
+      b.phase = 'live';
+      b.a = LIVE_KIND + ':' + b.pk + ':' + b.id;
+      bcRecord(b);
+      try { b.lock = await navigator.wakeLock?.request('screen'); } catch {}
+      // the stream is a few seconds behind the camera: announced once it has
+      // three segments — Chrome's own player won't start a live playlist with
+      // fewer (it fails to parse it), so a viewer who comes at once would get
+      // an error, not the stream
+      for (let i = 0; i < 40 && bc === b && b.phase === 'live'; i++) {
+        await new Promise((r) => setTimeout(r, 500));
+        const pl = await fetch(b.liveUrl, { cache: 'no-store' }).then((r) => r.text()).catch(() => '');
+        if ((pl.match(/\.ts\s*$/gm) || []).length >= 3) break;
+      }
+      if (bc !== b || b.phase !== 'live') return;
+      await bcAnnounce(b, 'live');
+      b.tick = setInterval(() => bcTick(b), 60_000);
+      ui.goLive = null;
+      openLive(b.ev);
+    } catch (e) {
+      if (bc !== b) return;
+      b.phase = 'setup';
+      b.err = (e && e.message) || t('goLiveRefused');
+      try { b.ws && b.ws.close(); } catch {}
+      render();
+    }
+  }
+  // every minute: how many watch, into a fresh copy of the announcement
+  async function bcTick(b) {
+    if (bc !== b || b.phase !== 'live') return;
+    try {
+      const st = await (await fetch(b.liveUrl.replace(/live\.m3u8$/, 'stats'))).json();
+      b.viewers = st.viewers;
+    } catch {}
+    bcAnnounce(b, 'live').catch(() => {});
+  }
+  async function endBroadcast() {
+    const b = bc;
+    if (!b || b.phase === 'ended') return;
+    const was = b.phase;
+    b.phase = 'ended';
+    clearInterval(b.tick);
+    try { b.rec && b.rec.stop(); } catch {}
+    try { if (b.ws && b.ws.readyState === 1) b.ws.send('end'); } catch {}
+    setTimeout(() => { try { b.ws && b.ws.close(1000, 'ended'); } catch {} }, 500);
+    bcStopMedia();
+    try { b.lock && b.lock.release(); } catch {}
+    bc = null;
+    ui.goLive = null;
+    render();
+    if (was === 'live' && b.id) {
+      await bcAnnounce(b, 'ended').catch(() => {});
+      toast(t('goLiveEnded'));
+    }
+  }
+  // the screen before going live: what to send, a title, the picture itself
+  function goLiveScreen() {
+    if (!bc) { bc = { phase: 'setup', title: '', source: 'camera', facing: 'user', media: null, err: null }; queueMicrotask(() => bcPreview().catch(() => {})); } // (a reload, back on this screen)
+    const b = bc;
+    const name = hook('namesAddress');
+    const screenOk = !!navigator.mediaDevices?.getDisplayMedia;
+    queueMicrotask(() => {
+      const v = document.querySelector('video.bc-preview');
+      if (v && b.media && v.srcObject !== b.media) { v._skipMorph = true; v.srcObject = b.media; v.play().catch(() => {}); }
+    });
+    const pick = (src) => { if (b.source === src) return; b.source = src; render(); bcPreview(); };
+    return h('div', { class: 'col live-page', style: 'gap:12px' },
+      ctx.brandHeader(true),
+      h('div', { class: 'card col', style: 'gap:12px' },
+        h('div', { class: 'row gap6', style: 'align-items:center' },
+          backBtn(() => { bcStopMedia(); bc = null; ui.goLive = null; }),
+          h('h3', { style: 'margin:0' }, t('goLive'))),
+        !name ? h('div', { class: 'notice small' }, t('goLiveNeedsName')) : null,
+        h('div', { class: 'live-player', 'data-key': 'bc-player:' + b.source },
+          b.media
+            ? h('div', { class: 'live-frame', 'data-key': 'bc-frame:' + b.media.id }, h('video', { class: 'live-video bc-preview' + (b.source === 'camera' && b.facing === 'user' ? ' mirror' : ''), muted: '', playsinline: '', autoplay: '' }))
+            : h('div', { class: 'live-cover live-still', 'data-key': 'bc-still' }, h('span', { class: 'live-say' }, b.err || t('goLiveAsking')))),
+        h('div', { class: 'row gap6 wrap' },
+          h('button', { class: 'btn-sm' + (b.source === 'camera' ? ' on' : ''), onClick: () => pick('camera') }, t('goLiveCamera')),
+          screenOk ? h('button', { class: 'btn-sm' + (b.source === 'screen' ? ' on' : ''), onClick: () => pick('screen') }, t('goLiveScreen')) : null,
+          b.source === 'camera' ? h('button', { class: 'btn-sm', title: t('goLiveFlip'), onClick: () => { b.facing = b.facing === 'user' ? 'environment' : 'user'; bcPreview(); } }, '⇄ ' + t('goLiveFlip')) : null),
+        h('input', { type: 'text', class: 'go-live-title', placeholder: t('goLiveTitlePh'), value: b.title, maxlength: '120',
+          onInput: (e) => { b.title = e.target.value; } }),
+        b.err && b.media ? h('div', { class: 'notice err small' }, b.err) : null,
+        h('button', { class: 'btn-primary btn-block go-live-start', disabled: !name || !b.media || b.phase !== 'setup', onClick: startBroadcast },
+          b.phase === 'starting' ? h('span', { class: 'spinner sm' }) : null, ' ', t(b.phase === 'starting' ? 'goLiveStarting' : 'goLiveStart')),
+        h('div', { class: 'small faint' }, t('goLiveHint'))));
+  }
+
   // A quote inside a quote: one line of who and what, never a third level
   // of cards (a bare "view note" link said nothing about where it leads).
   function quoteMini(ref) {
@@ -9209,7 +9489,7 @@ export function messagesFeature(ctx) {
 
   // The header magnifier's search, opened with a name already typed.
   function openPeopleSearch(q) {
-    ui.chatOpen = false; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null;
+    ui.chatOpen = false; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null;
     ui.userSearch = { q, rows: null };
     warmSearch();
     userSearcher.update(q);
@@ -9530,7 +9810,7 @@ export function messagesFeature(ctx) {
     const next = (cur ? cur + '\n\n' : '') + ref;
     ui.profCompose = next;
     setDraft(POST_DRAFT, next);
-    ui.noteThread = null; ui.liveStream = null;
+    ui.noteThread = null; ui.liveStream = null; ui.goLive = null;
     ui.profilePk = null;
     ui.chatOpen = true;
     ui.msgView = 'feed';
@@ -11248,7 +11528,7 @@ export function messagesFeature(ctx) {
       // (or profile) and its scroll place. A thread opened straight from a
       // link has nothing of ours under it, so no button that invents one.
       !ctx.canGoBack || ctx.canGoBack()
-        ? h('button', { class: 'btn-ghost btn-block', onClick: () => ctx.goBack(() => { ui.noteThread = null; ui.liveStream = null; }) }, t('back'))
+        ? h('button', { class: 'btn-ghost btn-block', onClick: () => ctx.goBack(() => { ui.noteThread = null; ui.liveStream = null; ui.goLive = null; }) }, t('back'))
         : null,
       ...noteOverlays());
   }
@@ -11528,6 +11808,8 @@ export function messagesFeature(ctx) {
             // the hat pitch lives beside the avatar it decorates
             mine ? hook('hatShopEntry') : null)),
         ui.profEdit ? null : liveBanner(pk),
+        mine && !ui.profEdit && canGoLive() && !liveNowOf(pk) ? h('button', { class: 'btn-sm go-live-btn', style: 'align-self:flex-start', onClick: openGoLive },
+          h('span', { class: 'go-live-dot' }), t('goLive')) : null,
         // no spinner while the kind 0 loads — prefetch keeps this rare, and
         // an empty beat reads calmer than a spinner
         // The bio rides the same renderer as notes: npub mentions become
@@ -11654,7 +11936,7 @@ export function messagesFeature(ctx) {
                   // screen router shows an open thread before the chat, so
                   // a reply half-typed under their post used to win here
                   ui.profilePk = null; ui.profOverThread = false;
-                  ui.noteThread = null; ui.liveStream = null; ui.userSearch = null; ui.feedEdit = null;
+                  ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.userSearch = null; ui.feedEdit = null;
                   ui.chatOpen = true;
                   ui.msgView = 'dm';
                   ui.msgPeer = peer;
@@ -11668,7 +11950,7 @@ export function messagesFeature(ctx) {
                   // and the Send tab would never appear
                   ui.profilePk = null;
                   ui.profOverThread = false;
-                  ui.noteThread = null; ui.liveStream = null;
+                  ui.noteThread = null; ui.liveStream = null; ui.goLive = null;
                   ui.userSearch = null;
                   ui.chatOpen = false;
                   ctx.showSend({ fresh: true });
@@ -11895,7 +12177,9 @@ export function messagesFeature(ctx) {
           type: 'button', class: 'compose-tool', title: t('feedAttach'), 'aria-label': t('feedAttach'), disabled: !!ui.postUploading,
           onClick: () => document.getElementById('post-file')?.click(),
         }, ui.postUploading ? h('span', { class: 'spinner sm' }) : h('span', { style: 'display:flex', html: CLIP })) : null,
-        gifs.button('post', 'compose-tool gif-btn'))),
+        gifs.button('post', 'compose-tool gif-btn'),
+        canGoLive() ? h('button', { type: 'button', class: 'compose-tool go-live-tool', title: t('goLive'), 'aria-label': t('goLive'), onClick: openGoLive },
+          h('span', { class: 'go-live-dot' })) : null)),
       mentionList('.post-input'),
       ui.postPreview ? draftPreview(text) : null,
       mediaBar(),
@@ -12007,7 +12291,7 @@ export function messagesFeature(ctx) {
   function toFrontDoor() {
     rememberReturn();
     ui.signinAsk = null; ui.pubProf = null; ui.chatOpen = false; ui.msgView = null;
-    ui.userSearch = null; ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.feedRelayEdit = null;
+    ui.userSearch = null; ui.profilePk = null; ui.profOverThread = false; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.feedRelayEdit = null;
     render();
     try { window.scrollTo({ top: 0 }); } catch {}
   }
@@ -16449,6 +16733,7 @@ export function messagesFeature(ctx) {
         return null;
       }
       if (ui.zapSetup) return zapSetupScreen();
+      if (ui.goLive) return goLiveScreen();
       if (ui.liveStream) return liveScreen();
       if (ui.profOverThread && ui.profilePk) return profileScreen();
       if (ui.noteThread) return threadScreen();
@@ -16463,7 +16748,7 @@ export function messagesFeature(ctx) {
     userSearchAvailable() { return true; },
     // the desktop header's search field: typing there IS the search page's query
     userSearchQuery(q) {
-      if (!ui.userSearch) { if (!isVisitor()) ui.chatOpen = false; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.userSearch = { q: '', rows: null }; warmSearch(); }
+      if (!ui.userSearch) { if (!isVisitor()) ui.chatOpen = false; ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.userSearch = { q: '', rows: null }; warmSearch(); }
       ui.userSearch.q = q; userSearcher.update(q); render();
       return true;
     },
@@ -16572,7 +16857,7 @@ export function messagesFeature(ctx) {
     visitorSignIn() { toFrontDoor(); return true; },
     visitorSearch() {
       rememberReturn();
-      ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.profOverThread = false;
+      ui.profilePk = null; ui.noteThread = null; ui.liveStream = null; ui.goLive = null; ui.profOverThread = false;
       ui.userSearch = { q: '', rows: null };
       warmSearch();
       render();
diff --git a/src/i18n.js b/src/i18n.js
index fd70b6c..f14ba82 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -471,6 +471,27 @@ const STR = {
     liveOver: 'This stream has ended.',
     liveStartsAt: 'Starts {when}',
     liveNotFound: 'Couldn’t find that stream.',
+    goLive: 'Go live',
+    goLiveCamera: 'Camera',
+    goLiveScreen: 'Screen',
+    goLiveFlip: 'Flip',
+    goLiveTitlePh: 'What’s your stream about?',
+    goLiveDefaultTitle: '{name} is live',
+    goLiveStart: 'Go live',
+    goLiveStarting: 'Starting…',
+    goLiveAsking: 'Asking for the camera…',
+    goLiveNoCamera: 'The camera isn’t available. Check that the browser may use it.',
+    goLiveNoScreen: 'Screen sharing was cancelled or isn’t available.',
+    goLiveNeedsName: 'Going live needs a coinos name: claim one in Settings first.',
+    goLiveRefused: 'The live server didn’t take the stream.',
+    goLiveHint: 'Your stream is public: anyone can watch it and its recording, kept for a week. Keep this page open while you’re live.',
+    goLiveEnd: 'End',
+    goLiveEndAsk: 'End your stream?',
+    goLiveEnded: 'Your stream has ended.',
+    goLiveReconnecting: 'Reconnecting…',
+    goLiveBehind: 'Your connection is falling behind',
+    goLiveLost: 'Lost the connection to the live server.',
+    goLiveRestarted: 'The stream had to start over.',
     feedAttach: 'Attach a picture or video',
     postLike: 'Like',
     postBoost: 'Boost',
diff --git a/src/style.css b/src/style.css
index fbd1858..a0996f9 100644
--- a/src/style.css
+++ b/src/style.css
@@ -888,6 +888,12 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; }
 .addr-summary { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
 /* Live streams (NIP-53): the row of what's on above a feed, a profile's
    "on now", a post's card, and the stream's own page (player over chat). */
+/* a face whose person is streaming now: a red ring, and LIVE under the bigger ones */
+.chat-avatar.live-ring { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px #e0245e; position: relative; overflow: visible; }
+.chat-avatar.mini.live-ring { box-shadow: 0 0 0 1px var(--paper), 0 0 0 2.5px #e0245e; }
+.chat-avatar.live-ring:not(.mini)::after { content: 'LIVE'; position: absolute; left: 50%; bottom: -7px; transform: translateX(-50%);
+  padding: 0 4px; border-radius: 3px; font-size: 9px; font-weight: 700; line-height: 13px; letter-spacing: .04em;
+  color: #fff; background: #e0245e; box-shadow: 0 0 0 2px var(--paper); text-transform: none; }
 .live-strip { display: flex; gap: 10px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: none; }
 .live-strip::-webkit-scrollbar { display: none; }
 .live-tile { flex: 0 0 168px; display: flex; flex-direction: column; gap: 5px; padding: 0; text-align: left;
@@ -920,6 +926,11 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; }
 .live-line-body { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; line-height: 1.35; }
 .live-zap .live-line-body b { color: var(--accent); }
 .live-input { min-width: 0; }
+.bc-preview.mirror { transform: scaleX(-1); }
+.bc-bar .bc-clock { font-variant-numeric: tabular-nums; font-weight: 650; }
+.go-live-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #e0245e; box-shadow: 0 0 0 3px rgba(224, 36, 94, .25); }
+.go-live-btn { display: inline-flex; align-items: center; gap: 8px; }
+.go-live-title { width: 100%; }
 .article-title { font-size: 1.35em; font-weight: 700; line-height: 1.25; margin-bottom: 6px; white-space: normal; }
 .article-h1, .article-h2, .article-h3 { font-weight: 650; line-height: 1.3; margin: 10px 0 2px; white-space: normal; }
 .article-h1 { font-size: 1.2em; } .article-h2 { font-size: 1.1em; } .article-h3 { font-size: 1em; }
diff --git a/tools/go-live-test.js b/tools/go-live-test.js
new file mode 100644
index 0000000..82d6c7c
--- /dev/null
+++ b/tools/go-live-test.js
@@ -0,0 +1,150 @@
+// Going live: a wallet with a coinos name opens Go live from the composer,
+// sees its camera, starts — the recording goes over the WebSocket to the live
+// server (coinosv3-server live/, run here beside the built app), the stream is
+// announced as its kind 30311 pointing at the HLS — and someone else opening
+// the stream's link watches it. Ending says so in a last 30311 carrying the
+// recording, and the recording is complete.
+// Run: bun tools/go-live-test.js   (LIVE_SERVER=path to coinosv3-server/live/server.js; NO_BUILD=1 to reuse dist/)
+import puppeteer from './puppeteer.js';
+import { cacheKeyFor } from '../src/wallet.js';
+import { naddrEncode } from 'nostr-tools/nip19';
+import { mkdtempSync, rmSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+let ok = true;
+const check = (n, c, d = '') => { console.log(` ${c ? '✓' : '✗'} ${n}${d ? ' — ' + d : ''}`); if (!c) ok = false; };
+const PORT = 5304;
+const dir = mkdtempSync(tmpdir() + '/go-live-');
+
+if (!process.env.NO_BUILD && Bun.spawnSync(['bun', 'build.js']).exitCode !== 0) throw new Error('build failed');
+// the registrar, as the live server asks it: the name is whoever is sending's
+let owner = null;
+const names = Bun.serve({ port: 0, hostname: '127.0.0.1', fetch: (req) => Response.json(new URL(req.url).pathname.endsWith('/alice') && owner ? { taken: true, pubkey: owner } : { taken: false }) });
+process.env.LIVE_DATA = dir;
+process.env.NAMES_URL = names.url.origin;
+process.env.LIVE_BASE = `http://localhost:${PORT}/live`;
+const live = await import(process.env.LIVE_SERVER || '../../coinosv3-server/live/server.js');
+const server = Bun.serve({ port: PORT, websocket: live.websocket, fetch: async (req, srv) => {
+  const path = new URL(req.url).pathname;
+  if (path.startsWith('/live/')) {
+    if (path === '/live/ingest') try { owner = JSON.parse(atob(new URL(req.url).searchParams.get('auth'))).pubkey; } catch {}
+    return live.handle(req, srv);
+  }
+  const f = Bun.file('dist' + path);
+  return path.includes('.') && await f.exists() ? new Response(f) : new Response(Bun.file('dist/index.html'));
+} });
+const browser = await puppeteer.launch({ executablePath: '/usr/bin/google-chrome', headless: 'new',
+  args: ['--no-sandbox', '--use-fake-device-for-media-stream', '--use-fake-ui-for-media-stream', '--autoplay-policy=no-user-gesture-required'] });
+
+const relayStub = (fx) => {
+  window.__published = [];
+  const match = (f, e) => (!f.kinds || f.kinds.includes(e.kind)) && (!f.authors || f.authors.includes(e.pubkey))
+    && Object.keys(f).filter((k) => k[0] === '#').every((k) => e.tags.some((x) => x[0] === k.slice(1) && f[k].includes(x[1])));
+  const Real = window.WebSocket;
+  window.WebSocket = function (...a) {
+    const ws = new Real(...a);
+    if (/\/live\/ingest/.test(String(a[0]))) return ws; // the live server itself
+    const send = ws.send.bind(ws);
+    ws.send = (data) => {
+      try {
+        const m = JSON.parse(data);
+        if (m[0] === 'REQ' && m[2]) {
+          const hits = [...fx, ...window.__published].filter((e) => m.slice(2).some((f) => match(f, e)));
+          if (hits.length) setTimeout(() => { for (const e of hits) ws.dispatchEvent(new MessageEvent('message', { data: JSON.stringify(['EVENT', m[1], e]) })); }, 0);
+        }
+        if (m[0] === 'EVENT' && m[1]) window.__published.push(m[1]);
+      } catch {}
+      return send(data);
+    };
+    return ws;
+  };
+  window.WebSocket.prototype = Real.prototype;
+  Object.assign(window.WebSocket, { CONNECTING: 0, OPEN: 1, CLOSING: 2, CLOSED: 3 });
+};
+const helpers = (page) => ({
+  click: (x) => page.evaluate((x) => { const e = [...document.querySelectorAll('button')].find((n) => n.textContent.trim().toLowerCase().includes(x)); if (e) { e.click(); return true; } return false; }, x),
+  waitText: async (x, ms = 20000) => { for (let i = 0; i < ms / 250; i++) { if ((await page.evaluate(() => document.body.innerText)).toLowerCase().includes(x.toLowerCase())) return true; await sleep(250); } return false; },
+  waitFor: async (fn, ms = 10000, arg) => { for (let i = 0; i < ms / 200; i++) { if (await page.evaluate(fn, arg)) return true; await sleep(200); } return false; },
+});
+const lives = (page) => page.evaluate(() => window.__published.filter((e) => e.kind === 30311));
+
+try {
+  const page = await browser.newPage();
+  await page.setViewport({ width: 390, height: 844 });
+  await page.evaluateOnNewDocument(relayStub, []);
+  // the registrar on the open internet is not asked: the name below is what the wallet holds
+  await page.setRequestInterception(true);
+  page.on('request', (r) => (/names\.coinos\.io|nwcpush/.test(r.url()) ? r.respond({ status: 404, body: '{}' }) : r.continue()));
+  page.on('dialog', (d) => d.accept());
+  const errs = []; page.on('pageerror', (e) => errs.push(String(e)));
+  const { click, waitText, waitFor } = helpers(page);
+  await page.goto(`http://localhost:${PORT}/`, { waitUntil: 'domcontentloaded' });
+  await page.evaluate(() => localStorage.setItem('btc-wallet-network', 'regtest'));
+  await page.reload({ waitUntil: 'domcontentloaded' });
+  await sleep(400);
+  await click('create a new wallet'); await sleep(600);
+  await page.waitForSelector('.words .w .t');
+  const mn = (await page.$$eval('.words .w .t', (l) => l.map((e) => e.textContent.trim()))).join(' ');
+  await click('skip verification');
+  await waitText('receive');
+  const base = cacheKeyFor(mn + '\n');
+  await page.evaluate((k) => {
+    localStorage.setItem(k + ':names', JSON.stringify({ byDomain: { 'coinos.io': { name: 'alice', domain: 'coinos.io' } } }));
+    localStorage.setItem('btc-wallet-feed:' + k, 'following');
+  }, base);
+  await page.reload({ waitUntil: 'domcontentloaded' });
+  await waitText('receive');
+  await page.evaluate(() => document.querySelector('.app-nav-button[aria-label="Feed"]').click());
+
+  console.log('[getting ready]');
+  await waitFor(() => !!document.querySelector('.feed-post-fab'), 15000);
+  await page.evaluate(() => document.querySelector('.feed-post-fab').click());
+  check('the composer has a Go live button', await waitFor(() => !!document.querySelector('.go-live-tool'), 5000));
+  await page.evaluate(() => document.querySelector('.go-live-tool').click());
+  check('Go live shows the camera', await waitFor(() => { const v = document.querySelector('video.bc-preview'); return !!v && v.videoWidth > 0 && !v.paused; }, 10000));
+  check('...mirrored, as a front camera is', await page.evaluate(() => document.querySelector('video.bc-preview').classList.contains('mirror')));
+  await page.type('.go-live-title', 'Testing the live button');
+
+  console.log('\n[live]');
+  await page.evaluate(() => document.querySelector('.go-live-start').click());
+  check('starting opens the stream\'s page, with the clock and End', await waitFor(() => !!document.querySelector('.live-page .bc-bar .bc-end'), 40000));
+  const ann = (await lives(page)).at(-1);
+  const tag = (e, k) => (e.tags.find((x) => x[0] === k) || [])[1];
+  check('the stream is announced: a 30311 of yours, live, pointing at its HLS', !!ann && tag(ann, 'status') === 'live' && /\/live\/[0-9a-f]{16}\/live\.m3u8$/.test(tag(ann, 'streaming')) && tag(ann, 'title') === 'Testing the live button'
+    && ann.tags.some((x) => x[0] === 'p' && x[1] === ann.pubkey && x[3] === 'Host'), JSON.stringify(ann && ann.tags));
+  check('...by the key the server let in', ann && ann.pubkey === owner);
+  check('the page shows you, not the stream seconds behind', await waitFor(() => { const v = document.querySelector('.live-page video.bc-preview'); return !!v && v.videoWidth > 0 && !document.querySelector('.live-page video.live-video:not(.bc-preview)'); }, 5000));
+  const hls = tag(ann, 'streaming');
+  const m3u8 = await (await fetch(hls)).text();
+  check('the server is making HLS of it, three segments in when it\'s announced', (m3u8.match(/\.ts/g) || []).length >= 3 && !/ENDLIST/.test(m3u8), (m3u8.match(/\.ts/g) || []).length + ' segments');
+
+  console.log('\n[someone watching]');
+  const viewer = await browser.newPage();
+  await viewer.setViewport({ width: 390, height: 844 });
+  await viewer.evaluateOnNewDocument(relayStub, [ann]);
+  const v = helpers(viewer);
+  await viewer.goto(`http://localhost:${PORT}/` + naddrEncode({ kind: 30311, pubkey: ann.pubkey, identifier: tag(ann, 'd') }), { waitUntil: 'domcontentloaded' });
+  check('the stream\'s link opens it', await v.waitFor(() => !!document.querySelector('.live-page'), 15000) && await v.waitText('Testing the live button', 3000));
+  check('...and it plays', await v.waitFor(() => { const x = document.querySelector('video.live-video'); return !!x && !x.paused && x.currentTime > 1 && x.videoWidth > 0; }, 30000),
+    JSON.stringify(await viewer.evaluate(() => { const x = document.querySelector('video.live-video'); return x && { t: x.currentTime, w: x.videoWidth, err: x.error && x.error.code }; })));
+  const st = await (await fetch(hls.replace('live.m3u8', 'stats'))).json();
+  check('the server counts the watcher', st.viewers >= 1, JSON.stringify(st));
+  await viewer.close();
+
+  console.log('\n[the end]');
+  await page.evaluate(() => document.querySelector('.bc-end').click());
+  check('End leaves the stream\'s page', await waitFor(() => !document.querySelector('.bc-bar'), 5000));
+  check('...and lets go of the camera', await page.evaluate(() => !document.querySelector('video.bc-preview')));
+  check('a last 30311 says it ended, with the recording', await waitFor(() => window.__published.some((e) => e.kind === 30311 && e.tags.some((x) => x[0] === 'status' && x[1] === 'ended') && e.tags.some((x) => x[0] === 'recording')), 8000));
+  const fin = (await lives(page)).at(-1);
+  await sleep(1500);
+  const rec = await (await fetch(tag(fin, 'recording'))).text();
+  check('...and the recording is whole', /ENDLIST/.test(rec) && (rec.match(/\.ts/g) || []).length >= 3, (rec.match(/\.ts/g) || []).length + ' segments');
+  check('no page errors', !errs.length, errs.join(' | '));
+} catch (e) { console.error(e); ok = false; } finally {
+  await browser.close(); server.stop(true); names.stop(true);
+  await sleep(300);
+  if (!process.env.KEEP) rmSync(dir, { recursive: true, force: true }); else console.log('kept', dir);
+}
+console.log(ok ? '\n✅ going live: camera to stream to watcher' : '\n❌ failed');
+process.exit(ok ? 0 : 1);
diff --git a/tools/live-stream-test.js b/tools/live-stream-test.js
index 7bc0228..4b8172d 100644
--- a/tools/live-stream-test.js
+++ b/tools/live-stream-test.js
@@ -145,6 +145,11 @@ try {
   check('...titled, marked LIVE, with how many watch and who', tile.length && /LIVE/.test(tile[0]) && /12 watching/.test(tile[0]) && /Building coinos live/.test(tile[0]), JSON.stringify(tile));
   check('...and a stream unrefreshed for two hours is not there', tile.length === 1 && !(await page.evaluate(() => document.body.innerText.includes('Forgotten stream'))));
   check('a post linking the stream shows it as a card', await waitFor(() => !!document.querySelector('.notes-feed .live-card'), 15000));
+  check('the host\'s face on their post wears the live ring', await waitFor((pk) => !!document.querySelector('.notes-feed .note-post .note-avatar.live-ring'), 5000));
+  await page.evaluate(() => document.querySelector('.notes-feed .note-post .note-avatar.live-ring').click());
+  check('...and a tap on it opens the stream', await waitFor(() => !!document.querySelector('.live-page'), 5000));
+  await page.goBack();
+  await waitFor(() => !document.querySelector('.live-page') && !!document.querySelector('.live-strip'), 5000);
 
   console.log('\n[the stream\'s page]');
   await page.evaluate(() => document.querySelector('.live-strip .live-tile').click());