instbyte 1.9.4 → 1.10.0

package/README.md

@@ -102,147 +102,19 @@ For teams who want auth, custom retention, or branding — create `instbyte.conf
 
 Then run `npx instbyte` in the same directory. The config is picked up automatically.
 
-### Keeping It Running
-For persistent team use, run it as a background process:
-
-```bash
-# using pm2
-npm install -g pm2
-pm2 start "npx instbyte" --name instbyte
-pm2 save
-```
-
-Or use any process manager you already have — systemd, screen, tmux.
+For persistent deployment options including pm2, systemd, and Docker, see the [Deployment Guide](docs/deployment.md).
 
 ---
 
 ## Docker
 
-The fastest way to run Instbyte with Docker:
-```bash
-docker compose up -d
-```
-
-Or with plain Docker:
-```bash
-docker run -d \
-  -p 3000:3000 \
-  -v $(pwd)/instbyte-data:/data \
-  -e INSTBYTE_DATA=/data \
-  -e INSTBYTE_UPLOADS=/data/uploads \
-  --name instbyte \
-  mohitgauniyal/instbyte
-```
-
-Data persists in `./instbyte-data` on your host. The same folder used by `npx instbyte` — so switching between the two preserves all your data.
-
-### With a config file
-
-Mount your config file into the container:
-```yaml
-services:
-  instbyte:
-    image: mohitgauniyal/instbyte
-    ports:
-      - "3000:3000"
-    volumes:
-      - ./instbyte-data:/data
-      - ./instbyte.config.json:/app/instbyte.config.json
-    environment:
-      - INSTBYTE_DATA=/data
-      - INSTBYTE_UPLOADS=/data/uploads
-    restart: unless-stopped
-```
-
-### Changing the port
-
-Edit the host port in `docker-compose.yml`:
-```yaml
-ports:
-  - "8080:3000"  # now runs on port 8080
-```
-
-> **Note:** File uploads may not work correctly on Windows Docker Desktop due to network limitations. For Windows, use `npx instbyte` directly or deploy on a Linux server.
+For Docker setup, persistent data, and config file mounting, see [Deployment Guide](docs/deployment.md).
 
 ---
 
 ## Reverse Proxy
 
-For teams who want to access Instbyte over HTTPS or from outside their local network, running it behind a reverse proxy is the standard approach.
-
-> **Important:** Instbyte uses WebSockets for real-time sync. Your proxy must be configured to forward WebSocket connections — otherwise the app will load but live updates will stop working.
-
-### Nginx
-```nginx
-server {
-    listen 80;
-    server_name instbyte.yourdomain.com;
-
-    # Redirect HTTP to HTTPS
-    return 301 https://$host$request_uri;
-}
-
-server {
-    listen 443 ssl;
-    server_name instbyte.yourdomain.com;
-
-    ssl_certificate     /etc/letsencrypt/live/instbyte.yourdomain.com/fullchain.pem;
-    ssl_certificate_key /etc/letsencrypt/live/instbyte.yourdomain.com/privkey.pem;
-
-    # Increase max upload size to match Instbyte's limit
-    client_max_body_size 2G;
-
-    location / {
-        proxy_pass http://localhost:3000;
-        proxy_http_version 1.1;
-
-        # Required for WebSocket support
-        proxy_set_header Upgrade $http_upgrade;
-        proxy_set_header Connection "upgrade";
-
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
-
-        # Prevent proxy timeouts on large uploads
-        proxy_read_timeout 300s;
-        proxy_send_timeout 300s;
-    }
-}
-```
-
-Get a free SSL certificate with Certbot:
-```bash
-certbot --nginx -d instbyte.yourdomain.com
-```
-
-### Caddy
-
-Caddy automatically handles HTTPS certificates — no Certbot needed.
-```caddy
-instbyte.yourdomain.com {
-    reverse_proxy localhost:3000
-}
-```
-
-Caddy handles WebSocket forwarding and HTTPS automatically. That's all you need.
-
-### With Docker
-
-If running Instbyte via Docker, proxy to the mapped host port:
-```nginx
-proxy_pass http://localhost:3000;
-```
-
-Or use Docker's internal network — replace `localhost` with the container name:
-```nginx
-proxy_pass http://instbyte:3000;
-```
-
-### Keeping it LAN-only
-
-If you don't want external access but still want HTTPS on your local network, tools like [Tailscale](https://tailscale.com) or [Cloudflare Tunnel](https://developers.cloudflare.com/cloudflare-one/connections/connect-networks/) are good options that require no open ports.
+For Nginx, Caddy, and HTTPS setup, see [Deployment Guide](docs/deployment.md).
 
 ---
 
@@ -305,6 +177,8 @@ The difference between *a tool you use* and *a tool you own.*
 
 **Presence awareness** — see how many people are currently connected in real time.
 
+**Live broadcast** — share your screen in real time with everyone on the network. Viewers join instantly from their browser, no plugins or installs needed. Built on WebRTC for smooth, low-latency video. Includes mic audio, viewer mute/unmute, raise hand, and screen capture to channel.
+
 **Read receipts** — see how many devices have viewed each shared item. Updates live as teammates open the page.
 
 **Item management** — add optional titles to label any item for future reference. Edit text items inline without deleting and re-pasting. Pinned items are protected from both manual deletion and auto-cleanup.
@@ -315,8 +189,35 @@ The difference between *a tool you use* and *a tool you own.*
 
 ---
 
+## Broadcasting
+
+One person shares their screen — everyone else on the network watches live in their browser. No plugins, no accounts, no external services. Built on WebRTC for smooth, low-latency video.
+
+### How to broadcast
+
+Click **📡 Broadcast** in the composer. Your browser will ask you to choose a screen, window, or tab to share. Once you pick one, a live bar appears at the top for all connected devices — teammates click **Join** to watch.
+
+While broadcasting you can still use Instbyte normally — send text, drop files, switch channels. The broadcast runs in the background.
+
+To stop, click **⏹ Stop** in the composer or use the browser's built-in "Stop sharing" bar.
+
+### As a viewer
+
+When a broadcast is live, a bar appears at the top of the page. Click **Join** to open the viewer panel. The panel is draggable and resizable — move it anywhere on your screen.
+
+- **📸 Capture** — saves the current frame as an image to the active channel
+- **✋ Raise hand** — notifies the broadcaster with a sound and toast
+- **🔇 / 🔊** — mute and unmute audio
+- **─** — minimize the panel without leaving the broadcast
+- **✕** — leave the broadcast entirely
+
+For HTTPS setup, enabling broadcast for all devices, and advanced network configuration, see the [Deployment Guide](docs/deployment.md#broadcasting).
+
+---
+
 ## Keyboard Shortcuts
 
+```
 | Key | Action |
 |---|---|
 | `/` | Focus search |
@@ -346,40 +247,13 @@ node server/server.js
 - Home lab file sharing without setting up NAS or cloud sync
 - Piping build logs or stack traces from CI or terminal directly into a shared channel
 - Sharing sensitive credentials or config files over LAN without leaving a cloud trail
+- Live screen sharing during standups, design reviews, or debugging sessions — no Zoom link needed
 
 ---
 
 ## Terminal Usage
 
-Since Instbyte exposes a simple HTTP API, you can push content directly from your terminal using `curl` — no browser needed.
-
-**Send a log file:**
-```bash
-curl -X POST http://192.168.x.x:3000/text \
-  -H "Content-Type: application/json" \
-  -d "{\"content\": \"$(cat error.log)\", \"channel\": \"general\", \"uploader\": \"terminal\"}"
-```
-
-**Pipe command output directly:**
-```bash
-npm run build 2>&1 | curl -X POST http://192.168.x.x:3000/text \
-  -H "Content-Type: application/json" \
-  --data-binary @-  \
-  -H "X-Channel: general" \
-  -H "X-Uploader: CI"
-```
-
-**Upload a file from the terminal:**
-```bash
-curl -X POST http://192.168.x.x:3000/upload \
-  -F "file=@./build.log" \
-  -F "channel=general" \
-  -F "uploader=terminal"
-```
-
-Replace `192.168.x.x:3000` with the URL shown when Instbyte starts. If auth is enabled, add `-b "instbyte_auth=your-token"` to each request.
-
-Useful for piping stack traces, build logs, or environment dumps straight into a channel your whole team can see instantly.
+Push content from your terminal using curl — no browser needed. See [Terminal Usage Guide](docs/terminal-usage.md).
 
 ---
 
@@ -393,7 +267,7 @@ Instbyte follows [Semantic Versioning](https://semver.org). See [Releases](https
 
 Instbyte is intentionally lightweight and LAN-first. If you want to extend it — CLI tools, themes, integrations — open an issue or submit a pull request.
 
-The codebase has a full test suite (184 tests across unit and integration). Run `npm test` before submitting anything. Issues tagged **good first issue** are a good starting point.
+The codebase has a full test suite (195 tests across unit and integration). Run `npm test` before submitting anything. Issues tagged **good first issue** are a good starting point.
 
 ---
 

package/bin/instbyte.js

@@ -25,4 +25,5 @@ process.env.INSTBYTE_UPLOADS = uploadsDir;
 // ========================
 // BOOT
 // ========================
+process.env.INSTBYTE_BOOT = '1';
 require("../server/server.js");

package/client/css/app.css

@@ -1079,6 +1079,264 @@ input[type=text]:focus {
     transition: background 1.5s ease, border-color 1.5s ease;
 }
 
+/* ============================================================
+   BROADCAST
+   ============================================================ */
+
+/* Bar — sits below header, visible to all when live */
+.broadcast-bar {
+    background: #111827;
+    color: #fff;
+    padding: 8px 20px;
+    position: sticky;
+    top: 0;
+    z-index: 100;
+    border-bottom: 1px solid #1f2937;
+}
+
+.broadcast-bar-inner {
+    max-width: 900px;
+    margin: 0 auto;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+}
+
+.broadcast-pulse {
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    background: #ef4444;
+    border-radius: 50%;
+    flex-shrink: 0;
+    animation: broadcastPulse 1.5s ease-in-out infinite;
+}
+
+@keyframes broadcastPulse {
+
+    0%,
+    100% {
+        opacity: 1;
+        transform: scale(1);
+    }
+
+    50% {
+        opacity: 0.4;
+        transform: scale(0.85);
+    }
+}
+
+#broadcastLabel {
+    font-size: 13px;
+    font-weight: 500;
+    flex: 1;
+}
+
+.broadcast-viewers {
+    font-size: 12px;
+    color: #9ca3af;
+}
+
+.broadcast-bar-actions {
+    display: flex;
+    gap: 8px;
+}
+
+.broadcast-join-btn {
+    background: #2563eb;
+    color: #fff;
+    border: none;
+    border-radius: 6px;
+    padding: 5px 14px;
+    font-size: 13px;
+    cursor: pointer;
+}
+
+.broadcast-join-btn:hover {
+    background: #1d4ed8;
+}
+
+.broadcast-end-btn {
+    background: #ef4444;
+    color: #fff;
+    border: none;
+    border-radius: 6px;
+    padding: 5px 14px;
+    font-size: 13px;
+    cursor: pointer;
+}
+
+.broadcast-end-btn:hover {
+    background: #dc2626;
+}
+
+/* Start button in composer */
+.broadcast-start-btn {
+    background: #374151;
+    color: #fff;
+    border: none;
+    border-radius: 6px;
+    padding: 10px 14px;
+    font-size: 13px;
+    cursor: pointer;
+    white-space: nowrap;
+}
+
+.broadcast-start-btn:hover {
+    background: #4b5563;
+}
+
+.broadcast-start-btn.is-live {
+    background: #ef4444;
+}
+
+.broadcast-start-btn.is-live:hover {
+    background: #dc2626;
+}
+
+/* ─── VIEWER PANEL ─────────────────────────────────────────── */
+
+.viewer-panel {
+    position: fixed;
+    top: 60px;
+    right: 20px;
+    width: 480px;
+    max-width: calc(100vw - 40px);
+    background: #fff;
+    border: 1px solid #e5e7eb;
+    border-radius: 12px;
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
+    z-index: 500;
+    display: flex;
+    flex-direction: column;
+    overflow: auto;
+    resize: both;
+    min-width: 280px;
+    min-height: 200px;
+}
+
+.viewer-panel-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 10px 14px;
+    background: #f9fafb;
+    border-bottom: 1px solid #e5e7eb;
+    flex-shrink: 0;
+    cursor: grab;
+    user-select: none;
+}
+
+.viewer-panel-header:active {
+    cursor: grabbing;
+}
+
+.viewer-minimize-btn {
+    background: #f3f4f6;
+    border: 1px solid #e5e7eb;
+    border-radius: 6px;
+    padding: 4px 10px;
+    font-size: 12px;
+    cursor: pointer;
+    color: #374151;
+}
+
+.viewer-minimize-btn:hover {
+    background: #fef9c3;
+    border-color: #fde68a;
+    color: #92400e;
+}
+
+.viewer-panel.minimized .viewer-frame,
+.viewer-panel.minimized .viewer-panel-actions .viewer-capture-btn,
+.viewer-panel.minimized .viewer-panel-actions .viewer-raise-btn,
+.viewer-panel.minimized .viewer-panel-actions .viewer-close-btn {
+    display: none;
+}
+
+.viewer-panel.minimized {
+    min-height: unset;
+    resize: none;
+}
+
+#viewerLabel {
+    font-size: 13px;
+    font-weight: 600;
+    color: #111827;
+}
+
+.viewer-panel-actions {
+    display: flex;
+    gap: 6px;
+}
+
+.viewer-capture-btn,
+.viewer-raise-btn,
+.viewer-close-btn {
+    background: #f3f4f6;
+    border: 1px solid #e5e7eb;
+    border-radius: 6px;
+    padding: 4px 10px;
+    font-size: 12px;
+    cursor: pointer;
+    color: #374151;
+}
+
+.viewer-capture-btn:hover {
+    background: #dbeafe;
+    border-color: #bfdbfe;
+    color: #1d4ed8;
+}
+
+.viewer-raise-btn:hover {
+    background: #fef9c3;
+    border-color: #fde68a;
+    color: #92400e;
+}
+
+.viewer-close-btn:hover {
+    background: #fee2e2;
+    border-color: #fecaca;
+    color: #b91c1c;
+}
+
+.viewer-frame {
+    width: 100%;
+    display: block;
+    background: #0f1117;
+    min-height: 180px;
+    object-fit: contain;
+}
+
+/* ─── RAISE HAND TOAST ─────────────────────────────────────── */
+
+.raise-hand-toast {
+    position: fixed;
+    bottom: 80px;
+    left: 50%;
+    transform: translateX(-50%);
+    background: #111827;
+    color: #fff;
+    padding: 8px 16px;
+    border-radius: 20px;
+    font-size: 13px;
+    z-index: 9999;
+    pointer-events: none;
+    animation: raiseHandIn 0.2s ease;
+}
+
+@keyframes raiseHandIn {
+    from {
+        opacity: 0;
+        transform: translateX(-50%) translateY(8px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateX(-50%) translateY(0);
+    }
+}
+
 /* ============================================================
    MOBILE
    ============================================================ */
@@ -1322,6 +1580,36 @@ input[type=text]:focus {
             transform: translateY(0);
         }
     }
+
+    .broadcast-bar {
+        padding: 8px 12px;
+    }
+
+    .broadcast-bar-inner {
+        gap: 8px;
+    }
+
+    #broadcastLabel {
+        font-size: 12px;
+    }
+
+    .broadcast-start-btn {
+        display: none;
+    }
+
+    .viewer-panel {
+        position: fixed;
+        top: auto;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        width: 100%;
+        max-width: 100%;
+        border-radius: 16px 16px 0 0;
+        resize: none;
+        max-height: 85vh;
+    }
+
 }
 
 
@@ -1728,6 +2016,45 @@ input[type=text]:focus {
             background: #1a1d27 !important;
             color: #e5e7eb !important;
         }
+
+        .broadcast-bar {
+            background: #0f1117;
+            border-bottom-color: #1f2937;
+        }
+
+        .broadcast-start-btn {
+            background: #1f2937;
+        }
+
+        .broadcast-start-btn:hover {
+            background: #374151;
+        }
+
+        .viewer-panel {
+            background: #1e2433;
+            border-color: #2d3748;
+        }
+
+        .viewer-panel-header {
+            background: #161b27;
+            border-bottom-color: #2d3748;
+        }
+
+        #viewerLabel {
+            color: #f9fafb;
+        }
+
+        .viewer-capture-btn,
+        .viewer-raise-btn,
+        .viewer-close-btn {
+            background: #2d3748;
+            border-color: #374151;
+            color: #d1d5db;
+        }
+
+        .raise-hand-toast {
+            background: #1f2937;
+        }
     }
 }
 
@@ -2126,4 +2453,43 @@ input[type=text]:focus {
         background: #1a1d27 !important;
         color: #e5e7eb !important;
     }
+
+    .broadcast-bar {
+        background: #0f1117;
+        border-bottom-color: #1f2937;
+    }
+
+    .broadcast-start-btn {
+        background: #1f2937;
+    }
+
+    .broadcast-start-btn:hover {
+        background: #374151;
+    }
+
+    .viewer-panel {
+        background: #1e2433;
+        border-color: #2d3748;
+    }
+
+    .viewer-panel-header {
+        background: #161b27;
+        border-bottom-color: #2d3748;
+    }
+
+    #viewerLabel {
+        color: #f9fafb;
+    }
+
+    .viewer-capture-btn,
+    .viewer-raise-btn,
+    .viewer-close-btn {
+        background: #2d3748;
+        border-color: #374151;
+        color: #d1d5db;
+    }
+
+    .raise-hand-toast {
+        background: #1f2937;
+    }
 }

package/client/index.html

@@ -37,6 +37,34 @@
     </div>
   </header>
 
+  <div id="broadcastBar" class="broadcast-bar" style="display:none">
+    <div class="broadcast-bar-inner">
+      <span class="broadcast-pulse"></span>
+      <span id="broadcastLabel">Someone is broadcasting</span>
+      <span id="broadcastViewers" class="broadcast-viewers"></span>
+      <div class="broadcast-bar-actions">
+        <button id="broadcastJoinBtn" class="broadcast-join-btn" onclick="joinBroadcast()">Join</button>
+        <button id="broadcastEndBtn" class="broadcast-end-btn" onclick="stopBroadcast()" style="display:none">End
+          broadcast</button>
+      </div>
+    </div>
+  </div>
+
+  <div id="viewerPanel" class="viewer-panel" style="display:none">
+    <div class="viewer-panel-header">
+      <span id="viewerLabel">Broadcast</span>
+      <div class="viewer-panel-actions">
+        <button onclick="captureToChannel()" class="viewer-capture-btn" title="Save frame to channel">📸
+          Capture</button>
+        <button onclick="raiseHand()" class="viewer-raise-btn" title="Raise hand">✋</button>
+        <button onclick="toggleAudio()" class="viewer-audio-btn" id="audioToggleBtn" title="Unmute audio">🔇</button>
+        <button onclick="toggleMinimize()" class="viewer-minimize-btn" title="Minimize">─</button>
+        <button onclick="leaveBroadcast()" class="viewer-close-btn" title="Leave broadcast">✕</button>
+      </div>
+    </div>
+    <video id="viewerFrame" class="viewer-frame" autoplay playsinline muted></video>
+  </div>
+
   <div class="container">
     <div class="channel-bar">
       <div class="channels" id="channels"></div>
@@ -49,6 +77,9 @@
       <button onclick="sendText()">Send</button>
       <input type="file" id="fileInput" hidden multiple>
       <button onclick="fileInput.click()">Upload</button>
+      <button id="startBroadcastBtn" onclick="startBroadcast()" class="broadcast-start-btn"
+        title="Start broadcasting your screen">📡 Broadcast</button>
+
     </div>
     <div class="drop" id="drop">Drag files anywhere to upload</div>
     <div id="uploadStatus"

package/client/js/app.js

@@ -6,6 +6,27 @@ let retention = 24 * 60 * 60 * 1000; // default 24h, overwritten on init
 const newItemIds = new Set();
 const seenEmitted = new Set(); // item IDs this session has already emitted seen for
 
+// BROADCAST STATE
+let isBroadcasting = false;
+let broadcastStream = null;
+let broadcastChannel = 'general';
+let audioCtx = null;
+
+// WebRTC — broadcaster maintains one peer connection per viewer
+// key: viewerId (socket id), value: RTCPeerConnection
+const peerConnections = new Map();
+
+// WebRTC — viewer holds a single peer connection to broadcaster
+let viewerPeerConnection = null;
+let broadcasterId = null;
+
+const STUN_SERVERS = {
+    iceServers: [
+        { urls: 'stun:stun.l.google.com:19302' },
+        { urls: 'stun:stun1.l.google.com:19302' }
+    ]
+};
+
 const seenObserver = new IntersectionObserver((entries) => {
     entries.forEach(entry => {
         if (!entry.isIntersecting) return;
@@ -161,7 +182,7 @@ function escapeHtml(str) {
 
 function playChime() {
     try {
-        const ctx = new (window.AudioContext || window.webkitAudioContext)();
+        const ctx = audioCtx || new (window.AudioContext || window.webkitAudioContext)();
 
         const gain = ctx.createGain();
         gain.connect(ctx.destination);
@@ -1271,7 +1292,7 @@ document.addEventListener("paste", async e => {
     });
 });
 
-async function uploadFiles(files) {
+async function uploadFiles(files, overrideChannel) {
     if (!files || !files.length) return;
 
     const status = document.getElementById("uploadStatus");
@@ -1279,7 +1300,7 @@ async function uploadFiles(files) {
     const text = document.getElementById("uploadText");
 
     const total = files.length;
-    const targetChannel = channel; // capture at start, won't change if user switches
+    const targetChannel = overrideChannel || channel; // capture at start, won't change if user switches
 
     for (let i = 0; i < total; i++) {
         const file = files[i];
@@ -1679,6 +1700,473 @@ function closeAllBottomSheets() {
     }
 }
 
+// ============================================================
+// BROADCAST
+// ============================================================
+
+async function startBroadcast() {
+    if (!window.isSecureContext) {
+        showBroadcastSecureWarning();
+        return;
+    }
+
+    const statusRes = await fetch('/broadcast/status');
+    const status = await statusRes.json();
+    if (status.live) {
+        alert(`${status.uploader} is already broadcasting. Only one broadcast at a time.`);
+        return;
+    }
+
+    const channelNames = channels.map(c => c.name);
+    broadcastChannel = channelNames.includes('general') ? 'general' : channelNames[0];
+
+    let stream;
+    try {
+        stream = await navigator.mediaDevices.getDisplayMedia({
+            video: { frameRate: { ideal: 30 }, width: { ideal: 1920 }, height: { ideal: 1080 } },
+            audio: true
+        });
+
+        // Mix in microphone if available — failure is silent, broadcast continues without mic
+        try {
+            const micStream = await navigator.mediaDevices.getUserMedia({ audio: true });
+            micStream.getAudioTracks().forEach(track => stream.addTrack(track));
+        } catch (e) {
+            // Mic denied or unavailable — continue without it
+        }
+    } catch (e) {
+        return;
+    }
+
+    const startRes = await fetch('/broadcast/start', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ uploader, channel: broadcastChannel, socketId: socket.id })
+    });
+
+    if (!startRes.ok) {
+        const err = await startRes.json();
+        alert(err.error || 'Could not start broadcast');
+        stream.getTracks().forEach(t => t.stop());
+        return;
+    }
+
+    broadcastStream = stream;
+    isBroadcasting = true;
+
+    try {
+        audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+        await audioCtx.resume();
+    } catch (e) { }
+
+    const startBtn = document.getElementById('startBroadcastBtn');
+    if (startBtn) {
+        startBtn.textContent = '⏹ Stop';
+        startBtn.classList.add('is-live');
+        startBtn.onclick = stopBroadcast;
+    }
+
+    stream.getVideoTracks()[0].addEventListener('ended', () => {
+        stopBroadcast();
+    });
+}
+
+async function stopBroadcast() {
+    if (!isBroadcasting) return;
+
+    isBroadcasting = false;
+
+    // Reset UI immediately — before any async calls that might fail
+    const startBtn = document.getElementById('startBroadcastBtn');
+    if (startBtn) {
+        startBtn.textContent = '📡 Broadcast';
+        startBtn.classList.remove('is-live');
+        startBtn.onclick = startBroadcast;
+    }
+
+    // Close all peer connections to viewers
+    peerConnections.forEach(pc => pc.close());
+    peerConnections.clear();
+
+    if (broadcastStream) {
+        broadcastStream.getTracks().forEach(t => t.stop());
+        broadcastStream = null;
+    }
+
+    // Best effort — server may already be down
+    try { await fetch('/broadcast/end', { method: 'POST' }); } catch (e) { }
+}
+
+// Called when broadcaster gets notified a new viewer joined
+async function handleViewerJoined(viewerId) {
+    if (!broadcastStream) return;
+
+    const pc = new RTCPeerConnection(STUN_SERVERS);
+    peerConnections.set(viewerId, pc);
+
+    // Add all tracks from the screen share stream
+    broadcastStream.getTracks().forEach(track => {
+        pc.addTrack(track, broadcastStream);
+    });
+
+    // Send ICE candidates to this viewer as they're discovered
+    pc.onicecandidate = ({ candidate }) => {
+        if (candidate) {
+            socket.emit('webrtc-ice', { candidate, targetId: viewerId });
+        }
+    };
+
+    pc.onconnectionstatechange = () => {
+        if (pc.connectionState === 'disconnected' || pc.connectionState === 'failed') {
+            pc.close();
+            peerConnections.delete(viewerId);
+        }
+    };
+
+    // Create and send offer to viewer
+    const offer = await pc.createOffer();
+    await pc.setLocalDescription(offer);
+    socket.emit('webrtc-offer', { offer, viewerId });
+}
+
+function showBroadcastBar(data) {
+    const bar = document.getElementById('broadcastBar');
+    const label = document.getElementById('broadcastLabel');
+    const endBtn = document.getElementById('broadcastEndBtn');
+    const joinBtn = document.getElementById('broadcastJoinBtn');
+
+    if (!bar) return;
+
+    label.textContent = `${data.uploader} is broadcasting`;
+    bar.style.display = 'block';
+
+    // Show end button only to the broadcaster
+    if (data.uploader === uploader) {
+        endBtn.style.display = 'inline-block';
+        joinBtn.style.display = 'none';
+    } else {
+        endBtn.style.display = 'none';
+        joinBtn.style.display = 'inline-block';
+    }
+}
+
+function hideBroadcastBar() {
+    const bar = document.getElementById('broadcastBar');
+    if (!bar) return;
+
+    // Show ended toast for 5 seconds then hide bar
+    const label = document.getElementById('broadcastLabel');
+    label.textContent = 'Broadcast ended';
+
+    setTimeout(() => {
+        bar.style.display = 'none';
+    }, 5000);
+}
+
+function joinBroadcast() {
+    const panel = document.getElementById('viewerPanel');
+    const label = document.getElementById('viewerLabel');
+    if (!panel) return;
+
+    label.textContent = `${document.getElementById('broadcastLabel').textContent}`;
+    panel.style.display = 'flex';
+
+    // Hide join button while viewing
+    const joinBtn = document.getElementById('broadcastJoinBtn');
+    if (joinBtn) joinBtn.style.display = 'none';
+
+    // Reset position to default top-right on each join
+    panel.style.left = '';
+    panel.style.top = '';
+    panel.style.right = '20px';
+
+    makeDraggable(panel);
+    socket.emit('broadcast-join');
+}
+
+function leaveBroadcast() {
+    const panel = document.getElementById('viewerPanel');
+    if (panel) panel.style.display = 'none';
+
+    // Restore join button
+    const joinBtn = document.getElementById('broadcastJoinBtn');
+    if (joinBtn) joinBtn.style.display = 'inline-block';
+
+    // Reset audio button to muted state
+    const audioBtn = document.getElementById('audioToggleBtn');
+    if (audioBtn) {
+        audioBtn.textContent = '🔇';
+        audioBtn.title = 'Unmute audio';
+    }
+
+    // Clean up viewer peer connection
+    if (viewerPeerConnection) {
+        viewerPeerConnection.close();
+        viewerPeerConnection = null;
+    }
+    broadcasterId = null;
+
+    // Stop video stream and reset audio on viewer element
+    const video = document.getElementById('viewerFrame');
+    if (video) {
+        video.srcObject = null;
+        video.muted = true;
+    }
+}
+
+async function captureToChannel() {
+    const video = document.getElementById('viewerFrame');
+    if (!video || !video.srcObject) return;
+
+    // Draw current video frame to canvas and convert to blob
+    const canvas = document.createElement('canvas');
+    canvas.width = video.videoWidth || 1280;
+    canvas.height = video.videoHeight || 720;
+    const ctx = canvas.getContext('2d');
+    ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
+
+    canvas.toBlob((blob) => {
+        if (!blob) return;
+        const file = new File([blob], `broadcast-${Date.now()}.jpg`, { type: 'image/jpeg' });
+        uploadFiles([file], broadcastChannel);
+    }, 'image/jpeg', 0.9);
+}
+
+function raiseHand() {
+    socket.emit('broadcast-reaction', { from: uploader });
+
+    // Visual feedback for the person raising hand
+    const toast = document.createElement('div');
+    toast.className = 'raise-hand-toast';
+    toast.textContent = '✋ Raised hand';
+    document.body.appendChild(toast);
+    setTimeout(() => toast.remove(), 2000);
+}
+
+function showBroadcastSecureWarning() {
+    const bar = document.getElementById('broadcastBar');
+    const label = document.getElementById('broadcastLabel');
+    if (!bar || !label) return;
+
+    bar.style.display = 'block';
+    label.innerHTML = `Broadcasting requires HTTPS or localhost. 
+        <a href="https://github.com/mohitgauniyal/instbyte#reverse-proxy" 
+           target="_blank" 
+           style="color:#60a5fa;text-decoration:underline">
+           Learn more
+        </a>`;
+
+    // Hide after 6 seconds
+    setTimeout(() => {
+        bar.style.display = 'none';
+        label.textContent = 'Someone is broadcasting';
+    }, 6000);
+}
+
+function toggleMinimize() {
+    const panel = document.getElementById('viewerPanel');
+    if (!panel) return;
+    panel.classList.toggle('minimized');
+}
+
+function toggleAudio() {
+    const video = document.getElementById('viewerFrame');
+    const btn = document.getElementById('audioToggleBtn');
+    if (!video || !btn) return;
+
+    video.muted = !video.muted;
+    btn.textContent = video.muted ? '🔇' : '🔊';
+    btn.title = video.muted ? 'Unmute audio' : 'Mute audio';
+}
+
+function makeDraggable(panel) {
+    const header = panel.querySelector('.viewer-panel-header');
+    if (!header) return;
+
+    let isDragging = false;
+    let startX, startY, startLeft, startTop;
+
+    header.addEventListener('mousedown', (e) => {
+        // Don't drag if clicking a button
+        if (e.target.tagName === 'BUTTON') return;
+
+        isDragging = true;
+        startX = e.clientX;
+        startY = e.clientY;
+
+        const rect = panel.getBoundingClientRect();
+        startLeft = rect.left;
+        startTop = rect.top;
+
+        // Switch from right-anchored to left-anchored positioning
+        panel.style.right = 'auto';
+        panel.style.left = startLeft + 'px';
+        panel.style.top = startTop + 'px';
+
+        e.preventDefault();
+    });
+
+    document.addEventListener('mousemove', (e) => {
+        if (!isDragging) return;
+
+        const dx = e.clientX - startX;
+        const dy = e.clientY - startY;
+
+        let newLeft = startLeft + dx;
+        let newTop = startTop + dy;
+
+        // Keep within viewport
+        newLeft = Math.max(0, Math.min(newLeft, window.innerWidth - panel.offsetWidth));
+        newTop = Math.max(0, Math.min(newTop, window.innerHeight - panel.offsetHeight));
+
+        panel.style.left = newLeft + 'px';
+        panel.style.top = newTop + 'px';
+    });
+
+    document.addEventListener('mouseup', () => {
+        isDragging = false;
+    });
+}
+
+// ─── SOCKET LISTENERS ────────────────────────────────────────
+
+socket.on('broadcast-started', (data) => {
+    showBroadcastBar(data);
+});
+
+socket.on('broadcast-ended', () => {
+    hideBroadcastBar();
+    leaveBroadcast();
+
+    if (isBroadcasting) {
+        isBroadcasting = false;
+        const startBtn = document.getElementById('startBroadcastBtn');
+        if (startBtn) {
+            startBtn.textContent = '📡 Broadcast';
+            startBtn.classList.remove('is-live');
+            startBtn.onclick = startBroadcast;
+        }
+    }
+});
+
+// ─── WEBRTC — BROADCASTER SIDE ───────────────────────────────
+
+// A new viewer joined — broadcaster initiates peer connection
+socket.on('webrtc-viewer-joined', ({ viewerId }) => {
+    if (!isBroadcasting) return;
+    handleViewerJoined(viewerId);
+});
+
+// Broadcaster receives answer from a viewer
+socket.on('webrtc-answer', async ({ answer, viewerId }) => {
+    const pc = peerConnections.get(viewerId);
+    if (!pc) return;
+    try {
+        await pc.setRemoteDescription(new RTCSessionDescription(answer));
+    } catch (e) {
+        console.error('Error setting remote description on broadcaster:', e);
+    }
+});
+
+// ─── WEBRTC — VIEWER SIDE ────────────────────────────────────
+
+// Viewer receives offer from broadcaster
+socket.on('webrtc-offer', async ({ offer, broadcasterId: bid }) => {
+    broadcasterId = bid;
+
+    // Clean up any existing peer connection
+    if (viewerPeerConnection) {
+        viewerPeerConnection.close();
+        viewerPeerConnection = null;
+    }
+
+    const pc = new RTCPeerConnection(STUN_SERVERS);
+    viewerPeerConnection = pc;
+
+    // When stream arrives, attach to video element
+    pc.ontrack = ({ streams }) => {
+        const video = document.getElementById('viewerFrame');
+        if (video && streams[0]) {
+            video.srcObject = streams[0];
+        }
+    };
+
+    // Send ICE candidates back to broadcaster
+    pc.onicecandidate = ({ candidate }) => {
+        if (candidate) {
+            socket.emit('webrtc-ice', { candidate, targetId: broadcasterId });
+        }
+    };
+
+    pc.onconnectionstatechange = () => {
+        if (pc.connectionState === 'disconnected' || pc.connectionState === 'failed') {
+            pc.close();
+            viewerPeerConnection = null;
+        }
+    };
+
+    await pc.setRemoteDescription(new RTCSessionDescription(offer));
+    const answer = await pc.createAnswer();
+    await pc.setLocalDescription(answer);
+    socket.emit('webrtc-answer', { answer, broadcasterId });
+});
+
+// ICE candidates — both broadcaster and viewer use same handler
+socket.on('webrtc-ice', async ({ candidate, fromId }) => {
+    // Broadcaster receives from viewer
+    if (isBroadcasting) {
+        const pc = peerConnections.get(fromId);
+        if (pc) {
+            try { await pc.addIceCandidate(new RTCIceCandidate(candidate)); } catch (e) { }
+        }
+        return;
+    }
+
+    // Viewer receives from broadcaster
+    if (viewerPeerConnection) {
+        try { await viewerPeerConnection.addIceCandidate(new RTCIceCandidate(candidate)); } catch (e) { }
+    }
+});
+
+socket.on('disconnect', () => {
+    // Trigger the same cleanup flow as a normal broadcast-ended event
+    if (isBroadcasting || viewerPeerConnection) {
+        isBroadcasting = false;
+
+        peerConnections.forEach(pc => pc.close());
+        peerConnections.clear();
+
+        if (broadcastStream) {
+            broadcastStream.getTracks().forEach(t => t.stop());
+            broadcastStream = null;
+        }
+
+        const startBtn = document.getElementById('startBroadcastBtn');
+        if (startBtn) {
+            startBtn.textContent = '📡 Broadcast';
+            startBtn.classList.remove('is-live');
+            startBtn.onclick = startBroadcast;
+        }
+
+        hideBroadcastBar();
+        leaveBroadcast();
+    }
+});
+
+// ─── RAISE HAND ──────────────────────────────────────────────
+
+socket.on('broadcast-reaction-received', ({ from }) => {
+    if (!isBroadcasting) return;
+
+    playChime();
+
+    const toast = document.createElement('div');
+    toast.className = 'raise-hand-toast';
+    toast.textContent = `✋ ${from} raised their hand`;
+    document.body.appendChild(toast);
+    setTimeout(() => toast.remove(), 8000);
+});
+
 (async function init() {
     await applyBranding();
     await initName();
@@ -1690,4 +2178,11 @@ function closeAllBottomSheets() {
     retention = info.retention; // null if "never", ms value otherwise
     await loadChannels();
     load();
+
+    // Check if a broadcast is already live when page loads
+    const broadcastRes = await fetch('/broadcast/status');
+    const broadcastStatus = await broadcastRes.json();
+    if (broadcastStatus.live) {
+        showBroadcastBar(broadcastStatus);
+    }
 })();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "instbyte",
-  "version": "1.9.4",
+  "version": "1.10.0",
   "description": "A self-hosted LAN sharing utility for fast, frictionless file, link, and snippet exchange across devices — no cloud required.",
   "main": "bin/instbyte.js",
   "bin": {

package/server/server.js

@@ -364,6 +364,13 @@ const channelLimiter = rateLimit({
   message: { error: "Too many requests,  try again later" }
 });
 
+const broadcastLimiter = rateLimit({
+  windowMs: 60 * 1000,
+  max: 5,
+  skip: () => process.env.NODE_ENV === 'test',
+  message: { error: "Too many broadcast attempts, slow down" }
+});
+
 /* LOGIN POST */
 app.post("/login", loginLimiter, (req, res) => {
   if (!config.auth.passphrase) return res.redirect("/");
@@ -812,6 +819,62 @@ app.get("/health", (req, res) => {
   });
 });
 
+/*   BROADCAST*/
+/* GET /broadcast/status — returns current broadcast or null */
+app.get("/broadcast/status", (req, res) => {
+  if (!currentBroadcast) return res.json({ live: false });
+  res.json({
+    live: true,
+    uploader: currentBroadcast.uploader,
+    channel: currentBroadcast.channel,
+    startedAt: currentBroadcast.startedAt
+  });
+});
+
+/* POST /broadcast/start */
+app.post("/broadcast/start", broadcastLimiter, (req, res) => {
+
+  if (currentBroadcast) {
+    return res.status(409).json({
+      error: "Broadcast already in progress",
+      uploader: currentBroadcast.uploader
+    });
+  }
+
+  const { uploader, channel, socketId } = req.body;
+  if (!uploader || !channel) {
+    return res.status(400).json({ error: "uploader and channel required" });
+  }
+
+  currentBroadcast = {
+    uploader,
+    channel,
+    startedAt: Date.now(),
+    lastFrame: null,
+    socketId
+  };
+
+  io.emit("broadcast-started", {
+    uploader: currentBroadcast.uploader,
+    channel: currentBroadcast.channel,
+    startedAt: currentBroadcast.startedAt
+  });
+
+  console.log(`Broadcast started by ${uploader}`);
+  res.json({ ok: true, ...currentBroadcast });
+});
+
+/* POST /broadcast/end */
+app.post("/broadcast/end", (req, res) => {
+  if (!currentBroadcast) return res.status(400).json({ error: "No broadcast in progress" });
+
+  const uploader = currentBroadcast.uploader;
+  currentBroadcast = null;
+
+  io.emit("broadcast-ended", { uploader });
+  console.log(`Broadcast ended by ${uploader}`);
+  res.json({ ok: true });
+});
 
 /* FAVICON */
 app.get("/favicon-dynamic.png", async (req, res) => {
@@ -867,6 +930,9 @@ app.get("/logo-dynamic.png", (req, res) => {
 // resets on server restart, no DB needed
 const seenBy = new Map();
 
+// Broadcast state — null when IDLE, populated when LIVE
+let currentBroadcast = null;
+
 let connectedUsers = 0;
 
 io.on("connection", (socket) => {
@@ -889,10 +955,56 @@ io.on("connection", (socket) => {
     io.emit("seen-update", { id, count });
   });
 
+  // WebRTC — viewer joins, notify broadcaster to initiate peer connection
+  socket.on("broadcast-join", () => {
+    if (!currentBroadcast) return;
+    // tell broadcaster a new viewer has joined, pass viewer's socket id
+    const broadcasterSocket = io.sockets.sockets.get(currentBroadcast.socketId);
+    if (broadcasterSocket) {
+      broadcasterSocket.emit("webrtc-viewer-joined", { viewerId: socket.id });
+    }
+  });
+
+  // WebRTC — broadcaster sends offer to a specific viewer
+  socket.on("webrtc-offer", ({ offer, viewerId }) => {
+    const viewerSocket = io.sockets.sockets.get(viewerId);
+    if (viewerSocket) {
+      viewerSocket.emit("webrtc-offer", { offer, broadcasterId: socket.id });
+    }
+  });
+
+  // WebRTC — viewer sends answer back to broadcaster
+  socket.on("webrtc-answer", ({ answer, broadcasterId }) => {
+    const broadcasterSocket = io.sockets.sockets.get(broadcasterId);
+    if (broadcasterSocket) {
+      broadcasterSocket.emit("webrtc-answer", { answer, viewerId: socket.id });
+    }
+  });
+
+  // WebRTC — ICE candidate exchange, both directions
+  socket.on("webrtc-ice", ({ candidate, targetId }) => {
+    const targetSocket = io.sockets.sockets.get(targetId);
+    if (targetSocket) {
+      targetSocket.emit("webrtc-ice", { candidate, fromId: socket.id });
+    }
+  });
+
+  // Broadcast — raise hand, relay to broadcaster
+  socket.on("broadcast-reaction", ({ from }) => {
+    if (!currentBroadcast) return;
+    io.emit("broadcast-reaction-received", { from });
+  });
+
   socket.on("disconnect", () => {
     connectedUsers--;
     console.log(username + " disconnected | total:", connectedUsers);
     io.emit("user-count", connectedUsers);
+
+    if (currentBroadcast && currentBroadcast.socketId === socket.id) {
+      currentBroadcast = null;
+      io.emit("broadcast-ended");
+      console.log("Broadcast ended — broadcaster disconnected");
+    }
   });
 });
 
@@ -941,19 +1053,21 @@ const PREFERRED = parseInt(process.env.PORT) || config.server.port;
 const localIP = getLocalIP();
 
 let PORT;
-findFreePort(PREFERRED).then(p => {
-  PORT = p;
-  server.listen(PORT, () => {
-    console.log("\nInstbyte running");
-    console.log("Local:   http://localhost:" + PORT);
-    console.log("Network: http://" + localIP + ":" + PORT);
-    if (PORT !== PREFERRED) {
-      console.log(`(port ${PREFERRED} was busy, switched to ${PORT})`);
-    }
-    console.log("");
-    scanOrphans();
+if (process.env.INSTBYTE_BOOT === '1') {
+  findFreePort(PREFERRED).then(p => {
+    PORT = p;
+    server.listen(PORT, () => {
+      console.log("\nInstbyte running");
+      console.log("Local:   http://localhost:" + PORT);
+      console.log("Network: http://" + localIP + ":" + PORT);
+      if (PORT !== PREFERRED) {
+        console.log(`(port ${PREFERRED} was busy, switched to ${PORT})`);
+      }
+      console.log("");
+      scanOrphans();
+    });
   });
-});
+}
 
 module.exports = { app, server, sessions };