engineering/www.unturf.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

zebra-report: deploy applyPublishStateUI for share/stop buttons

Browse source
This commit is contained in:
russell@unturf.com 2026-06-04 13:58:05 -04:00
parent 1f19037c6f
commit 8d6bf481fe
No known key found for this signature in database
1 changed files with 37 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

50
zebra-report/zebra-spaces.html
View file

@ -2547,8 +2547,8 @@ async function sfuPublishScreen(){
/* render a muted local preview so the publisher sees what they're
* sharing — SFU does not echo the publisher's own stream back */
renderScreenTile(myKeys.pubHex, stream, { local: true });
$('btn-screen-share').classList.add('hidden');
$('btn-screen-stop').classList.remove('hidden');
/* share / stop button visibility is driven by applyPublishStateUI
* via the publishSpec observer (pubs.screen state). */
}
/* sfuRebuildScreenPC — silent recovery path used by the screen
* publisher's onconnectionstatechange when the PC fails BUT the
@ -2626,8 +2626,8 @@ async function sfuUnpublishScreen(){
try { await fetch(SFU_BASE + '/unpublish?room=' + encodeURIComponent(roomID) + '&peer=' + pid, { method:'POST' }); } catch(_){}
}
fsm.send('DONE');
$('btn-screen-share').classList.remove('hidden');
$('btn-screen-stop').classList.add('hidden');
/* share / stop visibility is driven by applyPublishStateUI from
* the publishSpec 'off' state. */
logLine('', 'screen share stopped');
}
@ -2766,8 +2766,8 @@ async function sfuPublishCamera(){
() => { sfuCameraPC = null; sfuCameraPeerID = null; sfuCameraStream = null; fsm.send('STOP'); fsm.send('DONE'); });
logLine('', 'sfu: camera on as '+sfuCameraPeerID);
renderCameraTile(myKeys.pubHex, stream, { local: true });
$('btn-camera-share').classList.add('hidden');
$('btn-camera-stop').classList.remove('hidden');
/* share / stop visibility is driven by applyPublishStateUI via
* the publishSpec observer (pubs.camera state). */
try { sessionStorage.setItem(ACTIVE_CAM_KEY, '1'); } catch(_){}
}
async function sfuUnpublishCamera(){
@ -2782,8 +2782,8 @@ async function sfuUnpublishCamera(){
try { await fetch(SFU_BASE + '/unpublish?room=' + encodeURIComponent(roomID) + '&peer=' + pid, { method:'POST' }); } catch(_){}
}
fsm.send('DONE');
$('btn-camera-share').classList.remove('hidden');
$('btn-camera-stop').classList.add('hidden');
/* share / stop visibility is driven by applyPublishStateUI from
* the publishSpec 'off' state. */
logLine('', 'camera off');
try { sessionStorage.removeItem(ACTIVE_CAM_KEY); } catch(_){}
}
@ -3690,9 +3690,7 @@ roomMachines.call.observe(({ state, prev, ctx }) => {
/* Publish-FSM trace observers — one per kind (mic / screen / camera).
* Logs every transition so the page log shows the publish lifecycle
* synchronously with the imperative sfuPublish* / sfuUnpublish* flow.
* Future side-effect migrations can hang off these observers (the
* imperative code path will shrink as transitions take over). */
* synchronously with the imperative sfuPublish* / sfuUnpublish* flow. */
for (const kind of ['mic', 'screen', 'camera']){
const m = roomMachines.pubs[kind];
if (!m) continue;
@ -3702,6 +3700,32 @@ for (const kind of ['mic', 'screen', 'camera']){
});
}
/* Share-button visibility observer — derives btn-{kind}-share /
* btn-{kind}-stop visibility from the publishSpec state. Single
* source of truth: the buttons reflect the FSM, not whoever last
* called sfuPublishX. Fox 2026-06-04 directive — every system as a
* state machine, scattered classList writes converge into one
* observer per FSM. */
function applyPublishStateUI(kind, state){
const share = $('btn-'+kind+'-share');
const stop = $('btn-'+kind+'-stop');
if (!share || !stop) return;
/* sharing = anywhere between START and STOP. The 'stopping' state
* is transient and we treat it as "still showing the stop button"
* so the UI doesn't flicker during teardown. */
const isSharing = state === 'acquiring' || state === 'negotiating' || state === 'live' || state === 'stopping';
share.classList.toggle('hidden', isSharing);
stop.classList.toggle('hidden', !isSharing);
}
for (const kind of ['screen', 'camera']){
const m = roomMachines.pubs[kind];
if (!m) continue;
m.observe(({ state, prev }) => {
if (prev === null || state === prev) return;
try { applyPublishStateUI(kind, state); } catch(e){ logLine('err','pub.'+kind+' UI: '+e.message); }
});
}
let ws = null, wantConnected = false, sigKey = null, sigReconnect = null;
function send(obj){ if (ws && ws.readyState===1) ws.send(JSON.stringify(obj)); }
@ -5768,8 +5792,8 @@ logLine('', 'ready — pick a handle, type a rendezvous code, enter the space');
<footer style="margin:2.2rem auto 0;font-size:0.65rem;color:#999;line-height:1.7;word-break:break-all;font-family:monospace">
<span id="pi-seal" style="color:#777;cursor:default;user-select:none" title="">page integrity</span> &nbsp;·&nbsp; built <span class="stamp-date">2026-06-04</span><br>
md5 <span class="stamp-md5">bf20196804c9e6115349da69eae1a7ce</span><br>
sha256 <span class="stamp-sha">19a14b121c397a48bce3dacec5ef2f2c7b35d4112e5f959339e7072a612367bb</span><br>
md5 <span class="stamp-md5">019065ca233443b76d222b5a51544179</span><br>
sha256 <span class="stamp-sha">b4d78f2ff6a88a511abfacce8af816db2c6d235f80e0ebcd154abad002463e27</span><br>
<span style="color:#bbb">hashes are of this page with these two fields zeroed — to verify, blank them and re-hash</span><br>
<span style="color:#bbb">one self-contained file — <strong>save a copy</strong> and verify against these hashes; point at your own servers with ?signal= and ?turncred=, or <a href="host-your-own.html" style="color:#999">host your own community</a></span>
</footer>