feat(call): full-screen call when a phone is turned sideways (#126)
CI / Build & Quality Checks (push) Skipped
CI / Secret scan (gitleaks) (push) Skipped
CI / Playwright smoke (e2e) (push) Skipped
CI / Build & Quality Checks (pull_request) Successful in 3m31s
CI / Trigger Desktop Build (pull_request) Skipped
CI / Docker image build & smoke test (pull_request) Skipped
CI / Secret scan (gitleaks) (pull_request) Successful in 11s
CI / Playwright smoke (e2e) (pull_request) Successful in 18m48s

Landscape, at most 500px tall, touch input (a sideways phone is ~840px
wide, the Tablet size class, so the trigger is the screen shape), in this
room's joined call, chat closed: the call takes the whole screen. No room
header, sidebar or call-status bar; safe-area insets respected.

- Taps inside the call frame never reach the app, so while the controls
  are hidden a transparent layer covers the call: the first tap shows the
  call bar plus Chat / Exit full screen, which hide again after 4 s
  without a touch; with them up the call underneath stays usable.
- In an Android browser tab the first tap also enters the browser's own
  full screen (hides the address bar); left again on rotate back, hang
  up or exit. No effect on iPhone or the installed app.
- Exit full screen lasts until the phone is upright again.
- The frame is transparent (room wallpaper), so in full screen it gets an
  opaque base colour under the wallpaper.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017PCb59uY3UKqDqt7B6hzd5
This commit is contained in:
Lotus CI
2026-10-24 22:50:01 -04:00
co-authored by Claude Opus 5.5
parent 5379eb046d
commit 6e6213a43b
8 changed files with 284 additions and 10 deletions
+9 -2
View File
@@ -37,7 +37,7 @@ import {
useCallThemeSync,
useCallStart,
} from '../hooks/useCallEmbed';
import { callChatAtom, callEmbedAtom } from '../state/callEmbed';
import { callChatAtom, callEmbedAtom, immersiveCallAtom } from '../state/callEmbed';
import { toastQueueAtom } from '../state/toast';
import { CallEmbed, useCallControlState, useScreensharePromptOpen } from '../plugins/call';
import { hangupCallAndWait } from '../plugins/call/hangup';
@@ -954,6 +954,7 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
const inCallRoom = callEmbed && selectedRoom === callEmbed.roomId;
const callActive = callEmbed && joined;
const callVisible = inCallRoom && callActive && !chatOnlyView;
const immersiveCall = useAtomValue(immersiveCallAtom);
const pipMode = callActive && !inCallRoom;
const pipPromptOpen = useScreensharePromptOpen(callEmbed?.control);
const { navigateRoom } = useRoomNavigate();
@@ -1458,7 +1459,13 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
...(pipMode
? { background: color.Surface.Container }
: callVisible
? wallpaperStyle
? {
// [Gitea #126] Full screen: the frame is transparent, so give
// it an opaque base under the wallpaper or the room's
// sidebar / call bar show through.
...(immersiveCall ? { backgroundColor: color.Background.Container } : {}),
...wallpaperStyle,
}
: {}),
}}
ref={callEmbedRef}