FLOPPY: Plugin for localStorage, sessionStorage, IndexedDB storage, List Creation/Manipulation, Iteration, and More! Now with even more video docs!

I have so many videos on this plugin that I need to do! :stuck_out_tongue:

1 Like

Didn’t know about that, great.

" IndexedDB

IndexedDB is a database that is built into a browser, much more powerful than localStorage.

  • Stores almost any kind of values by keys, multiple key types.
  • Supports transactions for reliability.
  • Supports key range queries, indexes.
  • Can store much bigger volumes of data than localStorage.

That power is usually excessive for traditional client-server apps.
IndexedDB is intended for

offline

:muscle: apps, to be combined with ServiceWorkers and other technologies."

2 Likes

Fantastic, Keith! Looking forward for this being published.

In the meantime, if you want to move these demo pages to the new engine, I would be happy to help.


For the speed-addict out there, here are the videos on Loom so you can 2x the speed.

  1. Intro
  2. What is Browser Storage?
  3. Floppy basics
  4. Simple Practical Example with Floppy
8 Likes

keeps refreshing keith’s contributor page

3 Likes

I know. Sorry about that! I guess the review cue is long just now.

Maybe your code is too fancy for them :sweat_smile:

Literally dying to try this out!!!

1 Like

I don’t think they much review the code, but they do ensure there are support links (which were still tbd for this when I first submitted it, whoops).

1 Like

Saw that its up :slight_smile: Awesome sauce to finally get to use your plugin!

1 Like

FLOPPY is now available in the plugin store! Woot! :tada:

Thanks to those that immediately jumped in and checked out FLOPPY, even though all the features do not have video docs just yet. I appreciate your enthusiasm and support!

Please note that just now I pushed an UPDATE to Floppy (so it’s now at version 1.6.0) that adds the support for IndexedDB. Those features are not in the very first version that Bubble initially approved. So, for those of you who have installed the plugin, PLEASE UPDATE TO THE LATEST VERSION.

As Floppy is very new and I will be continuing to add new features (and surely bugfixes/enhancements) pretty regularly over the near future, early adopters should watch this thread for new updates and/or check the plugins tab every now and then to see if an update to Floppy is available.

Early adopters might also have noted that there are not just 1, but 2 element plugins in Floppy. The second element, “Floppy Reader” is a simplified version of Floppy that omits all the crazy list manipulation stuff, but is designed for just reading, writing and removing key/value pairs from storage. I haven’t done a video on that yet, but it’s fairly straightforward. It works just like Floppy’s core storage functions, but lets you specify up to 6 scalars and 6 lists in a single instance. It also just got upgraded to support IndexedDB.

Please note that I’ll be doing a lot more instructional videos on Floppy, but I’m at an offsite for a client for the next 2 days and so I may be somewhat scarce here. But please let me know any questions you have, any issues that you find, etc. and I will respond as promptly as possible!

Cheers,
Keith

11 Likes

OMG OMG OMG!!! AMAZING!

I’m sure you’ll be hearing from me :rofl:

Really cool!

I have always suspected Bubble’s native “Current User’s this” and “Current User’s that” uses either session, local storage or even cookies. I believe Bubble developers using this plugin will have to be careful to not interfere with the key’s Bubble’s default functions uses so as to not interfere with them.

Been playing round with the plugin and man it’s great for someone like me figuring out how to keep my ERP app’s capacity usage within Bubble’s personal plan (while learning app optimization within Bubble’s limits). I tried other localStorage plugins and this is the best and easiest to apply by far.

Forgive my lack of coding lingo but can @keith (or anyone) explain what is the RAM scalar/list for? Is it a temporary store available within a workflow or am I completely off?

2 Likes

Hey @ihsanzainal84 - Floppy’s RAM Scalar and Floppy’s RAM List are essentially two built-in custom states – RAM Scalar can hold a single value and RAM List can hold a list of values (duh, I know). These are of the same type as the type set in the main floppy interface.

They have various actions associated with them (never fire these actions on “Page Loaded” – only fire them after Floppy has reached its “Initialized” state). The most basic is “Set Floppy RAM Scalar” and “Set Floppy RAM List”. You can put values into them using this action.

Those values can be accessed at the RAM Scalar and RAM List outputs.

There are a bunch of other actions that apply to the RAM List – these include all of the “shift” type actions from List Shifter, but also Add (which can add a single value or list of values at any position in the RAM List – not just to the end, but at the beginning or at some arbitrary index in the List). There’s also “change” which allows you to replace an item or items in the list, either by index/indices or by value (e.g., find this value in the list and change either first instance, last instance, or all instances to some other value).

When you execute any of these actions (including Set), you’ll see an option at the bottom of the action interface to also STORE the new value in Floppy’s scalar or list key (as appropriate) in whatever storage space it’s read/writing to.

Hope that helps! I’ll have video demos that explain how these actions work and what you might use them for. But hope this helps in the meantime. (ALSO: Read the docs for each action in their interfaces!)

One final note: Those actions are, in fact, synchronous and you can run them one after another in a workflow and know that the updated values in RAM Scalar / RAM List are available to the next workflow step.

2 Likes

The cache for Things and such seems actually to be in memory so there’s not actually a risk of this. But Floppy also can tell you what keys it sees in whatever storage it’s accessing.

In the new version you can turn this off if desired - it’s the last option in the main interface.

I’m test mode, the editor does write a debugger status value to localStorage but it’s not a big deal if it’s cleared really.

1 Like

That’s cool! Yeah without knowing where Bubble “Things” are being temporarily stored, it may be risky to start working with user stuff (because you might write to a key that already exists by accident, even if it’s very unlikely), but if you’re confident that can’t happen then all the best.

Hey Keith, as always, excellent work! I’m trying to build a dynamic form like the one Eventbrite uses to collect ticket holder info based on the quantity of tickets selected. It looks like this plugin makes it possible.

I have a preset Question data record. Can I use Floppy to copy that X number of times into a list based on the selected ticket quantity?

1 Like

Yes, in fact you can do that. The RAM List can hold multiple copies of a single Thing. The idea would be that you use this as a placeholder Thing and then when the input fields are filled, you Create a New Thing with the new values.

You can also insert an “empty” Thing into Floppy’s RAM List and use it in a similar way. This definitely requires a video to explain more as it’s a bit “hacky” and a good understanding of how Things work is needed.

2 Likes

Thanks for the explanation @keith ! I get it now and works for alot of my use cases.

It’s gonna cut down on having to create additional states and workflow steps! I was hoping that was roughly how it would work it when you called it RAM.

2 Likes

Loving it so far! Not sure if it’s in your to-do list already but it’ll be super awesome if we could store and manipulate each item in JSON :grin:

I currently already do it by saving text strings I can split but it’ll be great to have something built in to easily point to and manipulate keys.

1 Like

Does anyone have an example on how to use it to save invoices line items (all at once) in a single click of a button, creating a new record for each line item?

Thanks a lot!