voice-poc: wire up screen share button (S shortcut, active/disabled states)

voice-poc/public/app.js

@@ -93,6 +93,7 @@ async function joinVoice(room) {
   }
   els.mic.disabled = !S.micStream;
   S.muted = false;
+  $('#btn-share').disabled = false;
 
   // audio context must exist after a user gesture — the channel click is one
   if (!S.audioCtx) S.audioCtx = new AudioContext();
@@ -117,6 +118,7 @@ function leaveVoice(reason) {
   if (S.ws) { try { S.ws.close(); } catch {} S.ws = null; }
   if (S.micStream) { S.micStream.getTracks().forEach((t) => t.stop()); S.micStream = null; }
   els.mic.disabled = false;
+  $('#btn-share').disabled = true;
   updateMicButton();
   document.querySelectorAll('.channel.voice').forEach((c) => c.classList.remove('active'));
   S.room = null;
@@ -402,6 +404,7 @@ async function startScreenShare() {
   stream.getVideoTracks()[0].addEventListener('ended', () => stopScreenShare());
   renderScreens();
   renderTiles();
+  $('#btn-share').classList.add('active');
   toast('You are sharing your screen', 'ok');
 }
 
@@ -426,6 +429,7 @@ function stopScreenShare(silent) {
   send({ type: 'state', state: { muted: S.muted, deafened: S.deafened, sharing: false } });
   renderScreens();
   renderTiles();
+  $('#btn-share').classList.remove('active');
   if (!silent) toast('Screen share stopped');
 }
 
@@ -703,6 +707,7 @@ function toggleDeafen() {
 
 els.mic.onclick = toggleMic;
 els.deafen.onclick = toggleDeafen;
+$('#btn-share').onclick = () => (S.sharing ? stopScreenShare() : startScreenShare());
 $('#btn-settings').onclick = openSettings;
 
 els.nick.value = S.name;
@@ -748,6 +753,7 @@ window.addEventListener('keydown', (ev) => {
   if (ev.target.tagName === 'INPUT' || ev.target.tagName === 'TEXTAREA') return;
   if (ev.key === 'm') toggleMic();
   if (ev.key === 'd') toggleDeafen();
+  if (ev.key === 's' && S.room) $('#btn-share').click();
 });
 window.addEventListener('beforeunload', () => { try { leaveVoice(); } catch {} });
 

voice-poc/public/index.html

@@ -37,6 +37,7 @@
       <div class="user-buttons">
         <button id="btn-mic" class="ctl" title="Toggle mic (M)">&#127908;</button>
         <button id="btn-deafen" class="ctl" title="Toggle deafen (D)">&#128064;</button>
+        <button id="btn-share" class="ctl" title="Share your screen" disabled>&#128421;&#65039;</button>
         <button id="btn-settings" class="ctl" title="Voice &amp; ICE settings">&#9881;&#65039;</button>
       </div>
     </footer>
@@ -87,6 +88,6 @@
 
 <div id="toasts"></div>
 
-<script src="app.js?v=4"></script>
+<script src="app.js?v=5"></script>
 </body>
 </html>

voice-poc/public/style.css

@@ -87,6 +87,7 @@ body {
   background: var(--red); transform: rotate(-40deg); border-radius: 1px;
 }
 .ctl:disabled { opacity: .35; cursor: not-allowed; }
+.ctl.active { color: var(--green); }
 
 /* main */
 #main { flex: 1; display: flex; flex-direction: column; min-width: 0; }