`scripts/shot-pins-tight.mjs`

34 lines
// Tight, legible real-GPU proof of the code chips: open all V1 pin labels, read each
// pin's on-screen bounding box, screenshot the union region (clip) so the 1000QHV1…
// code chips are unambiguous. Native res, no upscale.
import pw from '/Users/macstudio3/.npm-global/lib/node_modules/playwright/index.js';
const { chromium } = pw;
const OUT = '/Users/macstudio3/Projects/quadrille-showroom/recordings/slice3';
const browser = await chromium.launch({ channel: 'chrome', headless: false, args: ['--use-angle=metal', '--ignore-gpu-blocklist', '--window-size=1600,1000'] });
const page = await browser.newPage({ viewport: { width: 1600, height: 1000 } });
await page.goto('http://localhost:7690/', { waitUntil: 'domcontentloaded' });
await page.waitForFunction(() => window._qh && window._qh.wingBoards && window._qh.wingBoards.length >= 50, { timeout: 25000 });
await page.waitForTimeout(3000);
await page.evaluate(() => window._versions.set('V1'));
await page.waitForTimeout(1200);
await page.evaluate(() => window._versions.overlay(true));
await page.waitForTimeout(900);
await page.evaluate(() => document.querySelectorAll('#pin-layer .el-pin').forEach(p => p.classList.add('show-label')));
await page.waitForTimeout(700);

const box = await page.evaluate(() => {
  const pins = Array.from(document.querySelectorAll('#pin-layer .el-pin')).filter(p => p.style.display !== 'none');
  if (!pins.length) return null;
  let x0 = 1e9, y0 = 1e9, x1 = -1e9, y1 = -1e9;
  pins.forEach(p => { const r = p.getBoundingClientRect(); x0 = Math.min(x0, r.left); y0 = Math.min(y0, r.top); x1 = Math.max(x1, r.right); y1 = Math.max(y1, r.bottom); });
  return { x: Math.max(0, Math.floor(x0 - 16)), y: Math.max(0, Math.floor(y0 - 16)), width: Math.ceil(x1 - x0 + 32), height: Math.ceil(y1 - y0 + 32), n: pins.length };
});
console.log('pin union box', JSON.stringify(box));
if (box && box.width > 10 && box.height > 10) {
  await page.screenshot({ path: OUT + '/06-pins-codes-tight.png', clip: { x: box.x, y: box.y, width: Math.min(box.width, 1600 - box.x), height: Math.min(box.height, 1000 - box.y) } });
  console.log('wrote 06-pins-codes-tight.png');
} else {
  await page.screenshot({ path: OUT + '/06-pins-codes-tight.png' });
}
await browser.close();