A static Astro page. The sheet playground imports the print engine (printlayout.ts, paper.ts) verbatim from the Klarbild repository and runs it in the browser, so the layout on screen is the application's own arithmetic rather than a mock-up. The PDF it offers is drawn from the same placements with pdf-lib. No backend, nothing uploaded, no third-party requests. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Nh4A79bbqT9dcd2inzYUdg
35 lines
1.2 KiB
Markdown
35 lines
1.2 KiB
Markdown
# klarbild-demo
|
|
|
|
The product and demo page for [Klarbild](https://github.com/tillheidrich/klarbild),
|
|
live at **klarbild-demo.heidrich-digital.de**.
|
|
|
|
A single static Astro page. The interesting part is `src/lib/playground.ts`: it
|
|
imports `src/engine/printlayout.ts` and `src/engine/paper.ts` **verbatim from the
|
|
Klarbild repository** and runs them in the visitor's browser. So the sheet you see
|
|
being laid out is not a mock-up — it is the application's own arithmetic, and the
|
|
PDF the page hands you is drawn from the same placements (with pdf-lib in the
|
|
browser rather than sharp on a server, which is why it carries outlines instead of
|
|
photographs).
|
|
|
|
Nothing is uploaded and there is no backend.
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
## Keeping the engine in sync
|
|
|
|
`src/engine/*` are copies. When the print engine changes upstream, copy them again:
|
|
|
|
```bash
|
|
cp ../klarbild/src/lib/{printlayout,paper,printoversize}.ts src/engine/
|
|
# printoversize.ts imports './printlayout.ts'; drop the extension for the bundler
|
|
sed -i "s#from './printlayout.ts'#from './printlayout'#" src/engine/printoversize.ts
|
|
```
|
|
|
|
## Deployment
|
|
|
|
Dockerfile: Node builds the site, nginx serves it on port 80. Coolify deploys on
|
|
push to `main`.
|