#!/usr/bin/env node
// Screenshots every static figure on its own, into tmp/figs/.
//
//   npm run build && node scripts/figure-shots.mjs
//
// The full-page shots from browser-test.mjs --shots are too coarse to judge a
// diagram by: text in these figures is placed by hand, so a label that fits at
// one width collides at another, and the only way to know is to look at each
// one at the size it is drawn.
import { spawn } from 'node:child_process'
import { mkdirSync } from 'node:fs'
import { dirname, join } from 'node:path'
import { fileURLToPath } from 'node:url'
import puppeteer from 'puppeteer'
const root = join(dirname(fileURLToPath(import.meta.url)), '..')
const PORT = 5199
const server = spawn('npx', ['vite', 'preview', '--port', String(PORT), '--strictPort'], { cwd: root, stdio: 'ignore', detached: true })
const stop = () => { try { process.kill(-server.pid, 'SIGKILL') } catch {} }
process.on('exit', stop)
const URL = `http://localhost:${PORT}/`
for (let i = 0; i < 120; i++) { try { const r = await fetch(URL); if (r.ok) break } catch {} await new Promise(r => setTimeout(r, 250)) }
mkdirSync(`${root}/tmp/figs`, { recursive: true })
const browser = await puppeteer.launch({ headless: true, args: ['--no-sandbox'] })
const page = await browser.newPage()
await page.setViewport({ width: 1000, height: 900 })
const chapters = ['introduction','exact','leapfrog','waveguide','square','order','round','open','images','fdtd']
let k = 0
for (const c of chapters) {
  await page.goto(`${URL}#/${c}`, { waitUntil: 'networkidle2' })
  await new Promise(r => setTimeout(r, 700))
  const figs = await page.$$('figure.static-figure')
  for (const f of figs) { await f.screenshot({ path: `${root}/tmp/figs/${String(++k).padStart(2,'0')}-${c}.png` }) }
}
await browser.close(); stop()
console.log('done', k)