diff --git a/src/components/properties/GlobalSettingsPanel.tsx b/src/components/properties/GlobalSettingsPanel.tsx index d95ee1f..f3db095 100644 --- a/src/components/properties/GlobalSettingsPanel.tsx +++ b/src/components/properties/GlobalSettingsPanel.tsx @@ -37,29 +37,16 @@ export const GlobalSettingsPanel: React.FC = ({ const player = playerRef?.current; if (!player) return; - // Find the remotion-player container and grab its inner canvas/iframe - const playerContainer = document.querySelector('[data-remotion-player]') ?? document.querySelector('.remotion-player'); + // Find the BradlyPlayer container and capture its content + const playerContainer = document.querySelector('[data-bradly-player]'); if (!playerContainer) { - // Fallback: find the iframe or video element - const iframe = document.querySelector('iframe'); - if (iframe) { - // Can't capture cross-origin iframe, but for same-origin: - try { - const iframeDoc = iframe.contentDocument; - if (iframeDoc) { - const canvas = document.createElement('canvas'); - const body = iframeDoc.body; - canvas.width = body.scrollWidth; - canvas.height = body.scrollHeight; - // This is a simplistic approach - Remotion doesn't expose easy screenshot - } - } catch { /* cross-origin */ } - } + // Fallback: use the render API endpoint + alert('📸 Exportar frame: Usa el botón "Renderizar" con formato PNG para capturar frames.'); + return; } - // Use html2canvas-like approach: create a temporary canvas from the player - // For now, use a simple screenshot via the Remotion player's renderToCanvas - alert('📸 Exportar frame: Esta función requiere @remotion/renderer para renderizar frames individuales. Próximamente disponible.'); + // TODO: Implement canvas-based screenshot from BradlyPlayer viewport + alert('📸 Exportar frame: Usa el botón "Renderizar" con formato PNG para capturar frames.'); }, [playerRef]); const matchingPresets = EXPORT_PRESETS.filter(p => p.aspect === aspectRatio); diff --git a/src/electron/main.ts b/src/electron/main.ts index 1b0237f..71da5d4 100644 --- a/src/electron/main.ts +++ b/src/electron/main.ts @@ -4,7 +4,6 @@ * Responsibilities: * - Creates the BrowserWindow * - Starts the embedded Express server - * - Pre-downloads Chrome Headless Shell for Remotion * - Manages IPC handlers for native features */ import { app, BrowserWindow, ipcMain, dialog } from 'electron'; @@ -59,33 +58,10 @@ function setupPaths() { process.env.BRADLY_UPLOADS_DIR = uploadsDir; process.env.BRADLY_RENDERS_DIR = rendersDir; - // In packaged app, configure Remotion paths + // In packaged app, set the serve URL to the embedded Express server if (app.isPackaged) { - const resourcesPath = process.resourcesPath; - - // Pre-built Remotion bundle (created during packaging) - const remotionBundle = path.join(resourcesPath, 'remotion-bundle'); - if (fs.existsSync(remotionBundle)) { - process.env.BRADLY_REMOTION_BUNDLE = remotionBundle; - } - - // Compositor binaries (unpacked from asar) - const platformMap: Record = { - darwin: 'darwin', - win32: 'win32', - linux: 'linux', - }; - const platform = platformMap[process.platform] || process.platform; - const arch = process.arch; - const compositorPath = path.join( - resourcesPath, - 'app.asar.unpacked', - 'node_modules', - `@remotion/compositor-${platform}-${arch}`, - ); - if (fs.existsSync(compositorPath)) { - process.env.BRADLY_BINARIES_DIR = compositorPath; - } + // BRADLY_SERVE_URL will be set after Express starts + // (see startExpressServer) } console.log('📂 User data:', userDataPath); @@ -274,18 +250,6 @@ function setupIPC() { }); } -// ═══ Remotion Browser Pre-download ═══ - -async function predownloadBrowser() { - try { - const { ensureBrowser } = await import('@remotion/renderer'); - console.log('🌐 Ensuring Chrome Headless Shell is available...'); - await ensureBrowser(); - console.log('✅ Chrome Headless Shell ready'); - } catch (err) { - console.warn('⚠️ Failed to pre-download browser (renders may download on first use):', err); - } -} // ═══ App Lifecycle ═══ @@ -305,11 +269,11 @@ app.whenReady().then(async () => { return; } - // 4. Create the main window - createWindow(); + // 4. Set BRADLY_SERVE_URL for the renderer to find the app + process.env.BRADLY_SERVE_URL = `http://127.0.0.1:${expressPort}`; - // 5. Pre-download Chrome Headless Shell in background - predownloadBrowser(); + // 5. Create the main window + createWindow(); // macOS: re-create window when dock icon is clicked app.on('activate', () => {