cinny/README.md

Lotus Chat

A Matrix client for Lotus Guild — forked from Cinny v4.11.1.

Deployed at chat.lotusguild.org.

---

Changes from upstream Cinny

Branding & Identity

• Package renamed to lotus-chat, description updated to "Lotus Chat — Matrix client for Lotus Guild"
• App title changed from "Cinny" to "Lotus Chat" throughout
• Favicon, PWA icons, and all icon sizes (57×57 → 180×180 Apple touch icons) replaced with Lotus.png variants
• Logo in About dialog and Auth page replaced with official Lotus.png
• Auth footer rewritten: shows dynamic version from package.json, links to lotusguild.org, chat.lotusguild.org, and matrix.lotusguild.org
• Welcome page tagline changed from "Yet another matrix client" to "A Matrix client for Lotus Guild"
• Encryption key export filename changed from cinny-keys.txt to lotus-keys.txt
• manifest.json updated with Lotus name, description, and branding colors

LotusGuild Terminal Design System (TDS) v1.2

A full custom theme engine layered on top of Cinny's vanilla-extract theming:

Dark mode (LotusTerminalTheme):

• CRT terminal aesthetic: scanline overlay, vignette, phosphor glow
• Palette: bg #030508, orange #FF6B00, cyan #00D4FF, green #00FF88, text #c4d9ee
• Monospace font stack, terminal-style scrollbars
• Custom hex-grid and circuit-board CSS background patterns
• Matrix-style boot messages on the welcome page
• CSS variables: --lt-* family covering colors, glow effects, borders, animations

Light mode (LotusTerminalLightTheme):

• Full light palette: bg #edf0f5, orange #c44e00, cyan #0062b8, green #006d35, text #111827
• No CRT effects (scanlines, vignette disabled)
• Light-mode scrollbars, adjusted code block colors, semantic color overrides
• Scoped to html[data-theme="light"] body.lotusTerminalBodyClass
• ThemeManager.tsx sets data-theme attribute based on active theme kind

Chat Backgrounds (18+ custom patterns, all TDS-aware):

• Blueprint grid, carbon fiber, starfield, topographic contours, herringbone, crosshatch
• Chevron, polka dots, triangles, plaid
• All patterns use CSS custom properties — adapt to both TDS dark and light themes
• Settings toggle for showing per-message sender profiles

Voice / Video Call Improvements

• Element Call 0.19.3: Upgraded from 0.16.3. Dist copied to public/element-call/ by vite at build time.
• Camera default OFF: Camera no longer persists across sessions via localStorage. Always starts disabled. Optional cameraOnJoin setting for explicit opt-in.
• Deafen button: Tooltip corrected to "Deafen" / "Undeafen" (was "Turn Off Sound" / "Turn On Sound")
• Screenshare confirmation: A confirm dialog appears before screenshare is broadcast to call participants
• Auto-revert spotlight on screenshare: When someone starts screensharing, EC normally forces all participants into spotlight view. Patched in CallControl.ts onControlMutation() — detects the screenshare button going primary and clicks gridButton after 600ms to revert to grid layout. Participants choose to watch screenshare manually.
• Push to Talk (PTT):
  • Configurable keybind (default: Space) via Settings > General > Calls
  • Mic activates on keydown, deactivates on keyup; mic muted on tab blur/focus to prevent stuck-on mic
  • Visual indicator: plain folds Chip by default; when LotusGuild TDS is active: orange PTT — Hold SPACE / green ● LIVE in JetBrains Mono
  • Listens on both main window and EC iframe contentWindow for reliable key capture
  • Implemented via CallControl.setMicrophone() public method on the widget bridge
• Noise suppression toggle: Settings > General > Calls — passes noiseSuppression URL parameter to the embedded Element Call widget
• DM calls: Phone button in DM room header starts a 1-on-1 call via useCallStart(true). Room.tsx switches to CallView layout when the DM has an active call embed. Standard voice rooms were already supported; this extends call support to all direct messages.
• Picture-in-picture (PiP): When navigating away from a call room while in an active call, the call embed shrinks to a 280×158px floating window in the bottom-right corner (above the message composer). Clicking it navigates back to the call room. Implemented via useEffect that imperatively overrides inline styles on callEmbedRef.current — a wrapper div cannot be used because useCallEmbedPlacementSync writes top/left/width/height directly onto that element.

GIF Picker

• Giphy integration: GIF button appears in the message composer next to Send when gifApiKey is present in config.json
• Uses Giphy JS/React SDK (@giphy/react-components, @giphy/js-fetch-api, styled-components)
• Selected GIF is fetched as a blob, uploaded via mx.uploadContent, and sent as m.image — appears inline in the timeline like any image
• FocusTrap wraps the picker: clicking outside or pressing Escape closes it
• Terminal theme: When LotusGuild TDS is active the picker switches to: dark navy background (#060c14), orange dim border, 4px angular radius, // GIF_SEARCH header in JetBrains Mono, Giphy SearchBar input overridden (dark bg, orange border/focus ring, JetBrains Mono font), custom orange scrollbar
• API key set in root config.json → gifApiKey (the root file is what vite copies to dist — public/config.json is not used)

Settings Additions

Settings > General > Calls (new section):

• Camera on join: toggle whether camera starts enabled
• Noise suppression: toggle noise suppression in calls (default: on)
• Push to Talk: enable PTT mode and configure the keybind

Editor

• Editor toolbar visibility is user-configurable (toggle added to message composer settings)

Technical

• All upstream Cinny URLs replaced (cinny.in → lotusguild.org, Cinny Matrix room → Lotus Guild room)
• Version string is dynamically read from package.json at build time — no hardcoded version strings
• useCallEmbed.ts: noise suppression setting wired through createCallEmbed → CallEmbed.getWidget() → Element Call URL params
• CallControl.ts: setMicrophone(enabled: boolean) public method for PTT mic control; onControlMutation() patched to detect screenshare start and auto-revert spotlight to grid
• callPreferences atom: never persists video: true to localStorage; camera state always resets to OFF on page load
• CallEmbedProvider.tsx: pipMode logic and useEffect for imperative style overrides; navigateRoom hook for PiP click-to-return
• GifPicker.tsx: useSetting(settingsAtom, 'lotusTerminal') drives conditional terminal styling; injected <style> scoped to [data-gif-terminal] overrides Giphy SDK styled-components without polluting global styles
• useClientConfig.ts: gifApiKey?: string added to ClientConfig type

---

Upstream

Based on Cinny — a Matrix client focusing on simple, elegant and secure interface.