logoalt Hacker News

starfallgtoday at 3:34 PM4 repliesview on HN

Hi, I'm the creator of Bento. Just wanted to share a bit more about how I created it beyond what's in Github.

The file contains more or less two sections. There is a plain block of JSON near the top of the file which is the slide data. You can read, grep, or point a harness at it. The app itself is in a base64 blob that loads through a small shim which deflates in the browser with DecompressionStream, which keeps the package small and so that we don't need to fetch any external files at runtime. File System Access API is used for JSON writeback into the same file, which falls back to a plian download and all updates are ECDSA signed.

I started with reveal.js which served as a base, and incorporated GSAP/Flip to handle the animation. Then I added charting with echarts, but due to a number of issues with size and how the worked, I ended up re-implementing both.

What I'm most pleased about is how seamless the CRDT works. The blind relay is a small file that runs on Cloudflare Durable Objects, and all it sees are the encrypted data from the clients. Collab is off until we turn it on in the app (by starting a session by sharing by invite file), and then some sets of keys are generated. Access is handled by user key, and you can have read-only users, and also revoke live collab access by user as well.


Replies

mbreesetoday at 4:10 PM

This was my biggest question. Thanks for preemptively answering (and being proud!).

When I was playing with this, I immediately thought of TiddlyWikis, which I've always been fond of, but they never took for me. However, an easily editable presentation -- that's a use case I can understand.

I couldn't see how there was a CDRT when I'm just working with a single file. I was trying to figure out where the server was. So -- this is just on for everyone? Are you concerned that your Cloudflare account will be hammered with this?

show 2 replies
inanutshellustoday at 7:00 PM

The concept that's MAGICAL in Reveal.js is vertical slides.

e.g. https://revealjs.com/#/2/1 <-- from here you can go up or down, then go right to continue the presentation.

You just make one slide deck with lightweight high-abstraction slides and depending on the audience you just... hit the down arrow. bam. now you're inside the tech slides. no nerdy tech guys? sweet, don't hit down on slide 3. Instead you're with the marketing guys, so hit down on slide 5.

Anyway - looks like you got rid of that in order to mimic Powerpoint, but... don't forget it's there. it's my favorite part of using Reveal.js!

show 2 replies
ronyehtoday at 5:34 PM

Nice idea. What happens if you upgrade to v2 and my slide decks are on v1?

Can I click upgrade and get the JSON slide deck data exported into a v2 shell?

show 1 reply
allisdusttoday at 5:12 PM

I would call this a slide show not powerpoint mostly because making it work with the satanic office formats is a path to hell.

Hopefully simpler formats like this will become the norm and the old ones can die.

show 2 replies