Expand description
<CameraPreview /> — Leptos canvas painted by raw BGRA frames
pulled from the CameraFrameSlot (M-PIX.8 of M-RECORD-EXPORT-REAL-PIXELS).
Owns the RecorderPreviewState enum that drives the four UX
states (Initialising / AwaitingPermission / PermissionDenied
/ Live), and a <canvas> element painted at 15 fps by an
setInterval worker that polls the
latest_camera_frame_bgra Tauri command (raw ArrayBuffer
over tauri::ipc::Response — zero JSON overhead).
`CanvasRenderingContext2D::putImageData` expects RGBA in linear
byte order. The capture pipeline emits BGRA (the macOS /
GStreamer / SCK default for screen + camera). We swap the R/B
channels in-place in JS before constructing the `ImageData`.M-PIX.8 paints the raw rectangular BGRA frame into the canvas
and uses `border-radius: 50%` to render it as a circle. The
wisp-baked mask (described in earlier comments) lives in the
ENCODER side: `RecordingScene` masks the cam sprite into a
circle in the .mp4 output. The UI preview uses CSS so we
don't need a separate wisp pipeline running in the webview
just for the preview.Structs§
- Camera
Preview Props - Props for the
CameraPreviewcomponent.
Enums§
- Recorder
Preview State - Four-state UX machine for the camera preview surface (M-CAM.3 / AUT-257).
Constants§
- CANVAS_
DOM_ ID - Stable DOM id for the
<canvas>element. M-CAM.3’s Rust-side pipeline finds the canvas bydocument.getElementById(...)andputImageDatas frames into its 2D context. - PREVIEW_
CANVAS_ BYTES - Bytes per frame (BGRA × width × height).
- PREVIEW_
CANVAS_ HEIGHT - Frame height (square: matches the preview pipeline).
- PREVIEW_
CANVAS_ WIDTH - Frame width the camera preview canvas paints at — must match the
capture size (
screen_app::preview::pipeline::PREVIEW_WIDTH, 720 since M-QUAL.3) so the polled BGRA bytes fit the canvas pixel-for-pixel (putImageDatadoes not scale). The two crates can’t share a constant (native vs wasm), so keep them in lockstep. - PREVIEW_
POLL_ MS - 15 fps preview poll interval in milliseconds. Sufficient for a “see your face” UX; IPC traffic ~31 MB/s at 720×720.
Functions§
- Camera
Preview <CameraPreview />— the recorder surface’s webcam preview.- install_
camera_ 🔒frame_ poll - paint_
one_ 🔒frame