🌌 Webchat: The Ultimate Serverless P2P Ecosystem

An air-gapped, WebRTC-powered communication protocol disguised as a beautiful chat app.

---

⚡ Core Philosophy

Webchat is not just a messaging app; it is a demonstration of extreme client-side engineering. By pushing WebRTC data channels, the Web Audio API, Canvas 2D, and File System APIs to their absolute limits, this application functions entirely without a backend database or messaging server.

---

🎴 Feature Cards

📡 Air-Gapped QR Fountain Connect completely offline. The app slices connection keys into dynamic animated QR carousels (15+ chunks) streaming at 400ms for frictionless optical pairing.	🎨 Dual-Engine Canvas Switch between Draw on Chat (overlay) and Draw on Canvas (solid isolation). Includes live multi-peer syncing, high-res downloads, and Web Share API.	🗂️ Direct-to-Disk Streaming Bypass RAM limits. Using the File System Access API, incoming files stream directly to a designated local folder, allowing infinite gigabyte transfers without crashing.
🔋 Silent Audio Keep-Alive Maintains PWA background connection using a 1-sample inaudible audio loop hack, tricking mobile OS limiters into keeping WebRTC active when minimized.	📱 True Black OLED Mode Dynamic theme-color manipulation and strict #000000 hex values save OLED battery life while protecting eyes with contrast-balanced blue typography.	💬 Contextual Smart UX Single emojis automatically scale 300%. Features WhatsApp-style targeted replies, smart scroll-down badges, and ghost-typing text previews.

---

📐 Architecture & Flowcharts

How exactly does a serverless app connect? Webchat utilizes two distinct architectural bridges, mapped out below in zero-dependency ASCII flowcharts.

1. The Cloud OTP Bridge (Online Mode)

Uses an ephemeral Google Apps Script solely for an initial 5-second handshake.

[ Peer A (Host) ]                             [ Signaling Script ]                            [ Peer B (Guest) ]
       │                                               │                                              │
       │ 1. Generate WebRTC Offer (SDP)                │                                              │
       │──────────────────────────────────────────────>│                                              │
       │    POST Offer with PIN (e.g. "secret45")      │                                              │
       │                                               │ (Holds data for 5s)                          │
       │                                               │<─────────────────────────────────────────────│
       │                                               │         GET Offer using PIN                  │
       │                                               │                                              │
       │                                               │               2. Apply Offer, Generate Answer│
       │                                               │<─────────────────────────────────────────────│
       │                                               │         POST Answer to PIN                   │
       │<──────────────────────────────────────────────│                                              │
       │              GET Answer                       │                                              │
       │                                               X (Connection Abandoned)                       │
       │                                                                                              │
       │====================== 3. Secure P2P DTLS Pipe Established ===================================│
       │<────────────────────────────────────────────────────────────────────────────────────────────>│
       │                            Direct Encrypted Chat & Files                                     │