Improve the way images are stored

[jgaehring]

I'm using a very hacky method of storing images right now, because it was the most expedient way to test the general procedures for loading images from the camera or file system, then sending those images to the server. Basically I'm just converting those images to DataURL's immediately, then dumping them into the Vuex store (which automatically dumps them into WebSQL, too). And they stay there even after the image has posted to the server. Now that I know that we can load and send them, I need to leverage the file system API's that Cordova provides, so we can just point to a file location where the images are kept.

[jgaehring]

I was thinking about this recently, and it strikes me the best way to handle this, even though we don't have access to the file system, is to save the image DataURL's in a separate IndexedDB store, and reference them by id in the individual logs until they're synced to the server. Then we can remove the DataURL and just reference the server URL in the log, to save space. Having a single repository of DataURL's like that should also allow us to impose some sort of cap on how many DataURL's can be stored at one time, and make the user sync what they have before saving another image.

[mstenta]

I wonder if there are limits to the IndexedDB storage? Especially with iOS I think I remember reading something about that. Can't find it in a quick search right now... iOS has some other weird limitations with PWAs from what I've heard. Example: if you don't install the app to your home screen it does not persist data permanently (only for 7 days or something like that, I forget).

[jgaehring]

Oh yea, there's definitely a limit, which is why I want to put some protections in place (we don't have any currently). This is a good place to start:

https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria

I'll have to look into the iOS-specific limitations; no doubt they have their quirks.

[jgaehring]

Also just stumbled on this:

https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/

It's a pretty old article, but I notice they're using blobs instead of DataURL's. Makes me wonder: what's the most efficient storage format?

[jgaehring]

See https://farmos.discourse.group/t/error-the-website-encountered-an-unexpected-error-please-try-again-later/502 for some issues faced by users.

[jgaehring]

Also: https://farmos.discourse.group/t/log-not-synching-to-database/515/

[jgaehring]

Make sure to review #132 and #444 when I pick this back up.

[jgaehring]

Four and a half years later, very happy to be closing this grandaddy of an issue, #45 (what an accursed number)! There are still some optimizations that could be made, and no doubt some bugs that will crop up, but I think the recent work with 0394dc3, and a6b3370 before that, have mostly achieved the design goals here. Huzzah!