# Lotus Chat A Matrix client for [Lotus Guild](https://lotusguild.org) — forked from [Cinny](https://github.com/cinnyapp/cinny) v4.11.1. Deployed at [chat.lotusguild.org](https://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 `