Use case: a Bento deck is perfect to hand to people as one file — but folks keep asking me for the slides as images too: Instagram carousels, printed handouts, sharing one slide in a chat. Right now the only way out of the app is PDF via print.
Proposal:
- Export the current slide as PNG/JPG, and "export all" as a single ZIP (
slide-01.jpg…) so it's one save dialog.
- Rendered at 1.5–2× deck resolution. Feels like it belongs under Save ▾.
I actually built a working prototype — a small companion script (~300 lines vanilla JS, no deps) that clones the live .bento-slide into an SVG foreignObject, rasterizes via canvas, and zips with a tiny STORE-only writer. Works offline on file://. Happy to share it or open a PR — though honestly a native version rendering straight from the doc JSON would be much cleaner than my DOM-cloning, and would fit your UI properly.
A few gotchas I hit that any implementation will meet:
- collected CSS must be CDATA-wrapped inside the SVG (the editor's cursor styles embed raw
<svg> in url() and break XML parsing);
- the SVG has to load from a
data: URI — on file:// a blob: URL taints the canvas;
- entrance-animation states need settling before capture.
(Same script also grew an autoplay toggle — advance every N sec + loop — great for kiosk/wedding slideshows. Can file separately if that's interesting.)
Love the project — the one-file idea is genuinely great. Thanks!
Use case: a Bento deck is perfect to hand to people as one file — but folks keep asking me for the slides as images too: Instagram carousels, printed handouts, sharing one slide in a chat. Right now the only way out of the app is PDF via print.
Proposal:
slide-01.jpg…) so it's one save dialog.I actually built a working prototype — a small companion script (~300 lines vanilla JS, no deps) that clones the live
.bento-slideinto an SVGforeignObject, rasterizes via canvas, and zips with a tiny STORE-only writer. Works offline onfile://. Happy to share it or open a PR — though honestly a native version rendering straight from the doc JSON would be much cleaner than my DOM-cloning, and would fit your UI properly.A few gotchas I hit that any implementation will meet:
<svg>inurl()and break XML parsing);data:URI — onfile://ablob:URL taints the canvas;(Same script also grew an autoplay toggle — advance every N sec + loop — great for kiosk/wedding slideshows. Can file separately if that's interesting.)
Love the project — the one-file idea is genuinely great. Thanks!