feat(film): high-visibility cursor, lead-in trim, and rich storm-intel template

Replace the tiny SVG pointer with a solid brand-blue disc (white border + glow + bold click pulse) visible on any background. Orchestrator measures and trims the login/nav lead-in via ffmpeg -ss. Configurable FILM_BASE_URL. storm-intel becomes the rich hero template: waits for each load, drops a pin, waits for its storm history, clicks a storm event to visualise its polygon on the map, widens the range, and holds on the payoff.
This commit is contained in:
Satyam Rastogi
2026-05-30 21:57:00 +05:30
parent 8602c70eea
commit e58428126f
4 changed files with 91 additions and 46 deletions
@@ -8,7 +8,7 @@ import { newestWebm, webmToMp4, probeSeconds, secondsToFrames } from "./lib/reco
const __dirname = dirname(fileURLToPath(import.meta.url));
const ROOT = join(__dirname, "..");
const BASE_URL = "http://localhost:5173";
const BASE_URL = process.env.FILM_BASE_URL || "http://localhost:5173";
const FPS = 30;
const VIEWPORT = { width: 1920, height: 1080 };
@@ -48,6 +48,7 @@ async function main() {
deviceScaleFactor: 1, // recordVideo records CSS px; keep 1 for exact 1080p
recordVideo: { dir: tmpVideoDir, size: VIEWPORT },
});
const tCtx = Date.now(); // recording starts at context creation; measure the lead-in
await context.addInitScript("try{localStorage.setItem('theme','dark')}catch(e){}");
await context.addInitScript(CURSOR_INIT_SCRIPT);
const page = await context.newPage();
@@ -61,7 +62,8 @@ async function main() {
}
await page.waitForTimeout(800);
console.log(`▶ recording ${clip.id} (${clip.role}) ...`);
const leadInSec = Math.max(0, (Date.now() - tCtx) / 1000 - 0.3); // trim login+nav, keep 0.3s pad
console.log(`▶ recording ${clip.id} (${clip.role}) ... (trimming ${leadInSec.toFixed(1)}s lead-in)`);
await scene(page, cursor, {
baseUrl: BASE_URL,
spaNavigate,
@@ -73,7 +75,7 @@ async function main() {
await context.close(); // flush the .webm
const webm = await newestWebm(tmpVideoDir);
const mp4 = join(outDir, `${clip.id}.mp4`);
await webmToMp4(webm, mp4, FPS);
await webmToMp4(webm, mp4, FPS, leadInSec);
await rm(tmpVideoDir, { recursive: true, force: true });
const seconds = await probeSeconds(mp4);