jayjennings
3e964d1176
feat(kiosk): implement kiosk report submission functionality with offline support test(outbox): add tests for outbox functionality including report submission and error handling feat(outbox): create outbox management for queued reports with IndexedDB persistence feat(uuid): add UUID generation utility for client IDs feat(qr): implement QR code generation for reporting links by site and area feat(kiosk): create Kiosk page for reporting incidents without an account
29 lines
1.6 KiB
JavaScript
29 lines
1.6 KiB
JavaScript
// Renders the app icon to the PNG sizes browsers need to install the app.
|
|
// Run after changing the icon: node scripts/generate-icons.mjs
|
|
import { chromium } from '@playwright/test'
|
|
|
|
const shield = (stroke) => `
|
|
<path d="M16 6.5 8.5 9.5v6c0 4.6 3.2 8.6 7.5 9.9 4.3-1.3 7.5-5.3 7.5-9.9v-6L16 6.5Z" fill="none" stroke="#fff" stroke-width="${stroke}" stroke-linejoin="round"/>
|
|
<path d="m12.5 16 2.4 2.4 4.6-4.8" fill="none" stroke="#fff" stroke-width="${stroke}" stroke-linecap="round" stroke-linejoin="round"/>`
|
|
|
|
// Regular icon: rounded tile. Maskable: full-bleed square with the mark inside the safe zone.
|
|
const regular = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><rect width="32" height="32" rx="7" fill="#ee7258"/>${shield(2.2)}</svg>`
|
|
const maskable = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><rect width="32" height="32" fill="#ee7258"/><g transform="translate(16 16) scale(0.72) translate(-16 -16)">${shield(2.4)}</g></svg>`
|
|
|
|
const outputs = [
|
|
['public/icons/icon-192.png', regular, 192],
|
|
['public/icons/icon-512.png', regular, 512],
|
|
['public/icons/maskable-512.png', maskable, 512],
|
|
['public/icons/apple-touch-icon.png', maskable, 180],
|
|
]
|
|
|
|
const browser = await chromium.launch()
|
|
const page = await browser.newPage()
|
|
for (const [path, svg, size] of outputs) {
|
|
await page.setViewportSize({ width: size, height: size })
|
|
await page.setContent(`<style>html,body{margin:0;background:transparent}</style><img src="data:image/svg+xml,${encodeURIComponent(svg)}" width="${size}" height="${size}">`)
|
|
await page.locator('img').screenshot({ path, omitBackground: true })
|
|
console.log('wrote', path)
|
|
}
|
|
await browser.close()
|