move appStates data to a database - to lighten the weight from localS…

…torage

package.json

@@ -32,6 +32,7 @@
     "ace-builds": "^1.4.5",
     "bbcode": "^0.1.5",
     "bondage": "^2.0.1",
+    "idb": "^8.0.0",
     "inkjs": "^2.2.0",
     "jquery": "^3.4.1",
     "jquery-contextmenu": "^2.8.0",

src/js/classes/data.js

@@ -184,10 +184,11 @@ export const data = {
     if (writeCurrent)
       updatedStates[app.settings.selectedFileTab()] = data.getCurrentAppState();
     data.appInstanceStates(updatedStates);
-    storage.setItem('appStates', JSON.stringify(data.appInstanceStates()));
+    //storage.setItem('appStates', JSON.stringify(data.appInstanceStates()));
+    app.storage.db.save('appStates', JSON.stringify(data.appInstanceStates()))
     app.ui.dispatchEvent('yarnSavedStateToLocalStorage');
   }, 700),
-  loadAppStateFromLocalStorage: function() {
+  loadAppStateFromLocalStorage: async function() {
     if (!data.restoreFromLocalStorage()) return; // to ignore sometimes?
 
     const storage = app.settings.storage;
@@ -196,7 +197,11 @@ export const data = {
       console.log('--- storage.clear() ---');
       storage.clear(); //TODO remove later
     }
-    const appStates = JSON.parse(storage.getItem('appStates')); // appStateS <- new key
+
+    const appStatesData = await app.storage.db.getDbValue('appStates');
+    //const appStates = JSON.parse(storage.getItem('appStates')); // appStateS <- new key
+    const appStates = JSON.parse(appStatesData); // appStateS <- new key
+
     const currentDocState = appStates[app.settings.selectedFileTab()];
     data.appInstanceStates(appStates);
     console.log('APP state', appStates, currentDocState);

src/js/classes/settings.js

@@ -20,6 +20,7 @@ export const Settings = function(app) {
   ko.extenders.persist = function(target, option) {
     target.subscribe(function(newValue) {
       storage.setItem(option, newValue);
+      app.storage.db.save(option, newValue)
     });
     return target;
   };

src/js/classes/storage.js

@@ -1,3 +1,44 @@
+const idb =  require('idb');
+/////////// Persist via DB api ////////////////
+const DBStorage = function(dbName = 'my-db', objectStoreName = 'preferences') {
+  // requires https://unpkg.com/idb@5/build/iife/index-min.js
+  return {
+    dbName,
+    objectStoreName,
+    db: undefined,
+    save: async function(key, value) {
+      const tx = this.db.transaction(this.objectStoreName, 'readwrite');
+      const store = tx.objectStore(this.objectStoreName);
+      store.put({ key, value });
+      return tx.complete;
+    },
+    load: async function(valueKey) {
+      const tx = this.db.transaction(this.objectStoreName, 'readonly');
+      const store = tx.objectStore(this.objectStoreName);
+      const data = await store.get(valueKey);
+      return data && data.value;
+    },
+    openDatabase: function() {
+      return idb.openDB(dbName, 1, {
+        upgrade: db => {
+          db.createObjectStore(this.objectStoreName, { keyPath: 'key' });
+        },
+      });
+    },
+    getDb: function() {
+      return this.openDatabase().then(_db => {
+        this.db = _db;
+        return _db;
+      });
+    },
+    getDbValue: function(key = this.dbName) {
+      return this.getDb().then(_db => {
+        return this.load(key);
+      });
+    },
+  };
+};
+
 export const FILETYPE = {
   JSON: 'json',
   XML: 'xml',
@@ -28,6 +69,8 @@ export const getFileType = filename => {
 export const StorageJs = (type = 'gist', credentials) => {
   if (type === 'gist') {
     return {
+      db:
+        DBStorage('yarn-DB', 'Yarn-persistence'),
       getFileType,
       FILETYPE,
       lastStorageHost: 'GIST', // or LOCAL

yarn.lock

@@ -5294,6 +5294,11 @@ icss-utils@^4.0.0, icss-utils@^4.1.1:
   dependencies:
     postcss "^7.0.14"
 
+idb@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/idb/-/idb-8.0.0.tgz#33d7ed894ed36e23bcb542fb701ad579bfaad41f"
+  integrity sha512-l//qvlAKGmQO31Qn7xdzagVPPaHTxXx199MhrAFuVBTPqydcPYBWjkrbv4Y0ktB+GmWOiwHl237UUOrLmQxLvw==
+
 ieee754@^1.1.13, ieee754@^1.1.4:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"