Skip to content

feat: add live screen recording preview #319

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
hamidlabs wants to merge 9 commits into
base: main
Choose a base branch
from
Open

feat: add live screen recording preview #319

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
e402b9f
feat: add Linux PipeWire/Wayland screen capture support
hamidlabs Apr 4, 2026
6112ed7
feat: resize HUD overlay window for live preview
hamidlabs Apr 4, 2026
f3ea1cb
feat: add Wayland/X11 session type detection IPC
hamidlabs Apr 4, 2026
f3e81e3
feat: add usePreviewStream hook for live preview stream management
hamidlabs Apr 4, 2026
851fbe4
feat: add LivePreview canvas compositor component
hamidlabs Apr 4, 2026
327a571
feat: support preview stream handoff in useScreenRecorder
hamidlabs Apr 4, 2026
c69debc
feat: redesign LaunchWindow with integrated live preview
hamidlabs Apr 4, 2026
90539bf
Merge branch 'main' into feature/live-preview
hamidlabs Apr 5, 2026
853603d
Merge branch 'main' into feature/live-preview
hamidlabs Apr 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions electron/electron-env.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ declare namespace NodeJS {
// Used in Renderer process, expose in `preload.ts`
interface Window {
electronAPI: {
getSessionType: () => Promise<string>;
getSources: (opts: Electron.SourcesOptions) => Promise<ProcessedDesktopSource[]>;
switchToEditor: () => Promise<void>;
openSourceSelector: () => Promise<void>;
Expand Down
5 changes: 5 additions & 0 deletions electron/ipc/handlers.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -218,6 +218,11 @@ export function registerIpcHandlers(
getSourceSelectorWindow: () => BrowserWindow | null,
onRecordingStateChange?: (recording: boolean, sourceName: string) => void,
) {
ipcMain.handle("get-session-type", () => {
if (process.platform !== "linux") return "x11";
return process.env.XDG_SESSION_TYPE || (process.env.WAYLAND_DISPLAY ? "wayland" : "x11");
});

ipcMain.handle("get-sources", async (_, opts) => {
const sources = await desktopCapturer.getSources(opts);
return sources.map((source) => ({
Expand Down
6 changes: 6 additions & 0 deletions electron/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,12 @@ if (process.platform === "darwin") {
app.commandLine.appendSwitch("disable-features", "MacCatapLoopbackAudioForScreenShare");
}

// Enable PipeWire screen capture on Linux (required for Wayland screen sharing)
if (process.platform === "linux") {
app.commandLine.appendSwitch("enable-features", "WebRTCPipeWireCapturer");
app.commandLine.appendSwitch("ozone-platform-hint", "auto");
}

export const RECORDINGS_DIR = path.join(app.getPath("userData"), "recordings");

async function ensureRecordingsDir() {
Expand Down
3 changes: 3 additions & 0 deletions electron/preload.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ contextBridge.exposeInMainWorld("electronAPI", {
// ask main process for the correct base path (production vs dev)
return await ipcRenderer.invoke("get-asset-base-path");
},
getSessionType: async () => {
return await ipcRenderer.invoke("get-session-type");
},
getSources: async (opts: Electron.SourcesOptions) => {
return await ipcRenderer.invoke("get-sources", opts);
},
Expand Down
20 changes: 10 additions & 10 deletions electron/windows.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,26 +21,26 @@ export function createHudOverlayWindow(): BrowserWindow {
const primaryDisplay = screen.getPrimaryDisplay();
const { workArea } = primaryDisplay;

const windowWidth = 500;
const windowHeight = 155;
const windowWidth = 480;
const windowHeight = 420;

const x = Math.floor(workArea.x + (workArea.width - windowWidth) / 2);
const y = Math.floor(workArea.y + workArea.height - windowHeight - 5);
const x = Math.floor(workArea.x + workArea.width - windowWidth - 20);
const y = Math.floor(workArea.y + workArea.height - windowHeight - 20);

const win = new BrowserWindow({
width: windowWidth,
height: windowHeight,
minWidth: 500,
maxWidth: 500,
minHeight: 155,
maxHeight: 155,
minWidth: 380,
minHeight: 320,
maxWidth: 640,
maxHeight: 560,
x: x,
y: y,
frame: false,
transparent: true,
resizable: false,
resizable: true,
alwaysOnTop: true,
skipTaskbar: true,
skipTaskbar: false,
hasShadow: false,
show: !HEADLESS,
webPreferences: {
Expand Down
Loading