Scroll to top

10/08/2023


2023/08/10#p1

4 comments: click to read or leave your own

You may recall me mentioning an app called ruff which acts like a spark file but with the ability to make more than one. I said at the time: 'Maybe it will inspire me to create a "spark file" type feature on the site.'

I think you know where this is going...

That's right, I created a 'spark file' editor (allowing for multiple files) that runs in the browser and works equally well on mobile.

I've called it SPARKS.

Here's a quick video.

The interface allows you to edit the existing 'spark', delete it, create a new one, or load old ones from 'the vault'.

When editing a spark it is automatically saved each time you hit enter, though you can use the manual save button at the bottom. A little, unobtrusive, toast notification appears at the top on each save, just to let you know it's working.

If you choose to create a new spark the existing one will be saved and appear in the vault (unless it is empty). The vault displays sparks in order of creation; when you restore a spark from the vault it gets resaved with the current date/time so will appear first. There is always an empty card at the end of the vault with a 'new' button.

The latest spark is always the one displayed when you first go to the site.

The 'new' button will disappear if the current spark is empty.

If used on mobile, the vault and new buttons will not be visible. Instead, you swipe left to create a new spark and swipe right to view the vault.

The techie bit

Sparks uses jQuery and HTMX so that everything happens within the context of a single page (making AJAX calls out to the bits that do the work.) Including these two libraries the whole thing is made up of only 6 files – 7 if you include CSS – but that might change.

Try it out

There is a public version of Sparks that anyone can try. I reserve the right to clear out any and all 'sparks' without notice. There is no login system on the public version so play nice or I may be forced to change that. Obviously my personal implementation uses the site wide security.

Sparks originally linked to the master CSS for the blog as a shortcut to making things look consistent but I've now removed that dependency and the public version is fully standalone.

Once I'm happy there are no bugs and everything is tidied up I'll probably put it on GitHub.

Let me know what you think or if you find any issues.

Warning I may have temporarily broken the CSS on mobile.

I think it's fixed.

Dev
 
Leave a reply



You can also:

Click here to reply using email Reply by email Send a webmention Send a Webmention



Close