Move creation of browserStorage into a separate method

This is in anticipation of the localforage/IndexDB merge

src/converse-bookmark-views.js

@@ -11,7 +11,6 @@
  */
 import "backbone.nativeview";
 import "@converse/headless/converse-muc";
-import BrowserStorage from "backbone.browserStorage";
 import { OrderedListView } from "backbone.overview";
 import converse from "@converse/headless/converse-core";
 import tpl_bookmark from "templates/bookmark.html";
@@ -255,7 +254,7 @@ converse.plugins.add('converse-bookmark-views', {
                 const storage = _converse.config.get('storage'),
                       id = `converse.room-bookmarks${_converse.bare_jid}-list-model`;
                 this.list_model = new _converse.BookmarksList({'id': id});
-                this.list_model.browserStorage = new BrowserStorage[storage](id);
+                this.list_model.browserStorage = _converse.createStore(id, storage);
 
                 const render = () => {
                     this.render();

src/converse-chatboxviews.js

@@ -147,8 +147,7 @@ converse.plugins.add('converse-chatboxviews', {
                 /* This method gets overridden in src/converse-controlbox.js if
                  * the controlbox plugin is active.
                  */
-                this.forEach(v => v.close());
-                return this;
+                return Promise.all(this.map(v => v.close({'name': 'closeAllChatBoxes'})));
             }
         });
 

src/converse-emoji-views.js

@@ -10,7 +10,6 @@
 
 import "@converse/headless/converse-emoji";
 import { debounce, find } from "lodash";
-import BrowserStorage from "backbone.browserStorage";
 import bootstrap from "bootstrap.native";
 import tpl_emoji_button from "templates/emoji_button.html";
 import tpl_emojis from "templates/emojis.html";
@@ -103,7 +102,7 @@ converse.plugins.add('converse-emoji-views', {
                     const storage = _converse.config.get('storage'),
                           id = `converse.emoji-${_converse.bare_jid}`;
                     _converse.emojipicker = new _converse.EmojiPicker({'id': id});
-                    _converse.emojipicker.browserStorage = new BrowserStorage[storage](id);
+                    _converse.emojipicker.browserStorage = _converse.createStore(id, storage);
                     _converse.emojipicker.fetch();
                 }
                 this.emoji_picker_view = new _converse.EmojiPickerView({'model': _converse.emojipicker});

src/converse-minimize.js

@@ -7,7 +7,6 @@
  * @module converse-minimize
  */
 import "converse-chatview";
-import BrowserStorage from "backbone.browserStorage";
 import { Overview } from "backbone.overview";
 import converse from "@converse/headless/converse-core";
 import tpl_chatbox_minimize from "templates/chatbox_minimize.html";
@@ -459,11 +458,11 @@ converse.plugins.add('converse-minimize', {
 
             initToggle () {
                 const storage = _converse.config.get('storage'),
-                      id = `converse.minchatstoggle${_converse.bare_jid}`;
+                      id = `converse.minchatstoggle-${_converse.bare_jid}`;
                 this.toggleview = new _converse.MinimizedChatsToggleView({
                     'model': new _converse.MinimizedChatsToggle({'id': id})
                 });
-                this.toggleview.model.browserStorage = new BrowserStorage[storage](id);
+                this.toggleview.model.browserStorage = _converse.createStore(id, storage);
                 this.toggleview.model.fetch();
             },
 

src/converse-muc-views.js

@@ -13,7 +13,6 @@ import "converse-modal";
 import "backbone.vdomview";
 import "formdata-polyfill";
 import "@converse/headless/utils/muc";
-import BrowserStorage from "backbone.browserStorage";
 import { OrderedListView } from "backbone.overview";
 import converse from "@converse/headless/converse-core";
 import tpl_add_chatroom_modal from "templates/add_chatroom_modal.html";
@@ -124,11 +123,12 @@ converse.plugins.add('converse-muc-views', {
                 if (this.roomspanel && u.isInDOM(this.roomspanel.el)) {
                     return this.roomspanel;
                 }
+                const id = `converse.roomspanel${_converse.bare_jid}`;
+
                 this.roomspanel = new _converse.RoomsPanel({
                     'model': new (_converse.RoomsPanelModel.extend({
-                        'id': `converse.roomspanel${_converse.bare_jid}`, // Required by web storage
-                        'browserStorage': new BrowserStorage[_converse.config.get('storage')](
-                            `converse.roomspanel${_converse.bare_jid}`)
+                        id,
+                        'browserStorage': _converse.createStore(id, _converse.config.get('storage'))
                     }))()
                 });
                 this.roomspanel.model.fetch();
@@ -933,7 +933,7 @@ converse.plugins.add('converse-muc-views', {
                     _converse.router.navigate('');
                 }
                 this.model.leave();
-                _converse.ChatBoxView.prototype.close.apply(this, arguments);
+                return _converse.ChatBoxView.prototype.close.apply(this, arguments);
             },
 
             updateOccupantsToggle () {
@@ -2200,7 +2200,7 @@ converse.plugins.add('converse-muc-views', {
                  * @method _converse.api.roomviews.close
                  * @param {(String[]|String)} jids The JID or array of JIDs of the chatroom(s)
                  */
-                'close' (jids) {
+                close (jids) {
                     let views;
                     if (jids === undefined) {
                         views = _converse.chatboxviews;

src/converse-omemo.js

@@ -9,7 +9,6 @@
  * @module converse-omemo
  */
 import "converse-profile";
-import BrowserStorage from "backbone.browserStorage";
 import converse from "@converse/headless/converse-core";
 import tpl_toolbar_omemo from "templates/toolbar_omemo.html";
 
@@ -988,7 +987,7 @@ converse.plugins.add('converse-omemo', {
                 this.devices = new _converse.Devices();
                 const id = `converse.devicelist-${_converse.bare_jid}-${this.get('jid')}`;
                 const storage = _converse.config.get('storage');
-                this.devices.browserStorage = new BrowserStorage[storage](id);
+                this.devices.browserStorage = _converse.createStore(id, storage);
                 this.fetchDevices();
             },
 
@@ -1017,7 +1016,7 @@ converse.plugins.add('converse-omemo', {
                     this._devices_promise = new Promise(resolve => {
                         this.devices.fetch({
                             'success': c => resolve(this.onDevicesFound(c)),
-                            'error': e => { _converse.log(e, Strophe.LogLevel.ERROR); resolve(); }
+                            'error': (m, e) => { _converse.log(e, Strophe.LogLevel.ERROR); resolve(); }
                         });
                     });
                 }
@@ -1175,7 +1174,7 @@ converse.plugins.add('converse-omemo', {
                 const storage = _converse.config.get('storage'),
                       id = `converse.omemosession-${_converse.bare_jid}`;
                 _converse.omemo_store = new _converse.OMEMOStore({'id': id});
-                _converse.omemo_store.browserStorage = new BrowserStorage[storage](id);
+                _converse.omemo_store.browserStorage = _converse.createStore(id, storage);
             }
             return _converse.omemo_store.fetchSession();
         }
@@ -1187,7 +1186,7 @@ converse.plugins.add('converse-omemo', {
             _converse.devicelists = new _converse.DeviceLists();
             const storage = _converse.config.get('storage'),
                   id = `converse.devicelists-${_converse.bare_jid}`;
-            _converse.devicelists.browserStorage = new BrowserStorage[storage](id);
+            _converse.devicelists.browserStorage = _converse.createStore(id, storage);
 
             try {
                 await fetchOwnDevices();

src/converse-roomslist.js

@@ -10,7 +10,6 @@
  * rooms in the "Rooms Panel" of the ControlBox.
  */
 import "@converse/headless/converse-muc";
-import BrowserStorage from "backbone.browserStorage";
 import { OrderedListView } from "backbone.overview";
 import converse from "@converse/headless/converse-core";
 import tpl_rooms_list from "templates/rooms_list.html";
@@ -175,7 +174,7 @@ converse.plugins.add('converse-roomslist', {
                       id = `converse.roomslist${_converse.bare_jid}`;
 
                 this.list_model = new _converse.RoomsList({'id': id});
-                this.list_model.browserStorage = new BrowserStorage[storage](id);
+                this.list_model.browserStorage = _converse.createStore(id, storage);
                 this.list_model.fetch();
                 this.render();
                 this.sortAndPositionAllItems();
@@ -271,7 +270,7 @@ converse.plugins.add('converse-roomslist', {
                   id = `converse.open-rooms-{_converse.bare_jid}`,
                   model = new _converse.OpenRooms();
 
-            model.browserStorage = new BrowserStorage[storage](id);
+            model.browserStorage = _converse.createStore(id, storage);
             _converse.rooms_list_view = new _converse.RoomsListView({'model': model});
             /**
              * Triggered once the _converse.RoomsListView has been created and initialized.

src/converse-rosterview.js

@@ -10,7 +10,6 @@ import "@converse/headless/converse-chatboxes";
 import "@converse/headless/converse-roster";
 import "converse-modal";
 import "formdata-polyfill";
-import BrowserStorage from "backbone.browserStorage";
 import { OrderedListView } from "backbone.overview";
 import SHA1 from 'strophe.js/src/sha1';
 import converse from "@converse/headless/converse-core";
@@ -807,7 +806,7 @@ converse.plugins.add('converse-rosterview', {
                 const model = new _converse.RosterFilter();
                 model.id = `_converse.rosterfilter${_converse.bare_jid}`;
                 const storage = _converse.config.get('storage');
-                model.browserStorage = new BrowserStorage[storage](this.filter.id);
+                model.browserStorage = _converse.createStore(this.filter.id, storage);
                 this.filter_view = new _converse.RosterFilterView({'model': model});
                 this.listenTo(this.filter_view.model, 'change', this.updateFilter);
                 this.filter_view.model.fetch();

src/headless/converse-bookmarks.js

@@ -10,7 +10,6 @@
  * Converse.js plugin which adds views for bookmarks specified in XEP-0048.
  */
 import "@converse/headless/converse-muc";
-import BrowserStorage from "backbone.browserStorage";
 import converse from "@converse/headless/converse-core";
 
 const { Backbone, Strophe, $iq, sizzle, _ } = converse.env;
@@ -110,7 +109,7 @@ converse.plugins.add('converse-bookmarks', {
                 const storage = _converse.config.get('storage');
                 const cache_key = `converse.room-bookmarks${_converse.bare_jid}`;
                 this.fetched_flag = cache_key+'fetched';
-                this.browserStorage = new BrowserStorage[storage](cache_key);
+                this.browserStorage = _converse.createStore(cache_key, storage);
             },
 
             async openBookmarkedRoom (bookmark) {

src/headless/converse-bosh.js

@@ -9,7 +9,6 @@
  * Converse.js plugin which add support for XEP-0206: XMPP Over BOSH
  */
 import 'strophe.js/src/bosh';
-import BrowserStorage from "backbone.browserStorage";
 import converse from "./converse-core";
 
 const { Backbone, Strophe } = converse.env;
@@ -36,7 +35,7 @@ converse.plugins.add('converse-bosh', {
             const id = BOSH_SESSION_ID;
             if (!_converse.bosh_session) {
                 _converse.bosh_session = new Backbone.Model({id});
-                _converse.bosh_session.browserStorage = new BrowserStorage.session(id);
+                _converse.bosh_session.browserStorage = _converse.createStore(id, "session");
                 await new Promise(resolve => _converse.bosh_session.fetch({'success': resolve, 'error': resolve}));
             }
             if (_converse.jid) {

src/headless/converse-chatboxes.js

@@ -9,7 +9,6 @@
 import "./converse-emoji";
 import "./utils/form";
 import { get, isObject, isString, propertyOf } from "lodash";
-import BrowserStorage from "backbone.browserStorage";
 import converse from "./converse-core";
 import filesize from "filesize";
 
@@ -328,7 +327,7 @@ converse.plugins.add('converse-chatboxes', {
                 this.messages = new this.messagesCollection();
                 this.messages.chatbox = this;
                 const storage = _converse.config.get('storage');
-                this.messages.browserStorage = new BrowserStorage[storage](this.getMessagesCacheKey());
+                this.messages.browserStorage = _converse.createStore(this.getMessagesCacheKey(), storage);
                 this.listenTo(this.messages, 'change:upload', message => {
                     if (message.get('upload') === _converse.SUCCESS) {
                         _converse.api.send(this.createMessageStanza(message));
@@ -1147,8 +1146,8 @@ converse.plugins.add('converse-chatboxes', {
                     return;
                 }
                 const storage = _converse.config.get('storage');
-                this.browserStorage = new BrowserStorage[storage](
-                    `converse.chatboxes-${_converse.bare_jid}`);
+                const id = `converse.chatboxes-${_converse.bare_jid}`;
+                this.browserStorage = _converse.createStore(id, storage);
                 this.registerMessageHandler();
                 this.fetch({
                     'add': true,

src/headless/converse-core.js

@@ -354,6 +354,12 @@ _converse.isUniView = function () {
     return _.includes(['mobile', 'fullscreen', 'embedded'], _converse.view_mode);
 };
 
+_converse.createStore = function (id, storage) {
+    const s = storage ? storage : _converse.storage[_converse.config.get('storage')];
+    return new BrowserStorage[s](id);
+}
+
+
 _converse.router = new Backbone.Router();
 
 function initPlugins () {
@@ -411,7 +417,7 @@ function initClientConfig () {
         'trusted': _converse.trusted && true || false,
         'storage': _converse.trusted ? 'local' : 'session'
     });
-    _converse.config.browserStorage = new BrowserStorage.session(id);
+    _converse.config.browserStorage = _converse.createStore(id, "session");
     _converse.config.fetch();
     /**
      * Triggered once the XMPP-client configuration has been initialized.
@@ -641,7 +647,7 @@ async function initSession (jid) {
     const id = `converse.session-${bare_jid}`;
     if (!_converse.session || _converse.session.get('id') !== id) {
         _converse.session = new Backbone.Model({id});
-        _converse.session.browserStorage = new BrowserStorage.session(id);
+        _converse.session.browserStorage = _converse.createStore(id, "session");
         await new Promise(r => _converse.session.fetch({'success': r, 'error': r}));
         if (_converse.session.get('active')) {
             _converse.session.clear();
@@ -1199,7 +1205,7 @@ _converse.initialize = async function (settings, callback) {
         } else {
             const id = `converse.xmppstatus-${_converse.bare_jid}`;
             _converse.xmppstatus = new this.XMPPStatus({'id': id});
-            _converse.xmppstatus.browserStorage = new BrowserStorage.session(id);
+            _converse.xmppstatus.browserStorage = _converse.createStore(id, "session");
             _converse.xmppstatus.fetch({
                 'success': () => _converse.onStatusInitialized(reconnecting),
                 'error': () => _converse.onStatusInitialized(reconnecting),

src/headless/converse-disco.js

@@ -8,7 +8,6 @@
  * @description
  * Converse plugin which add support for XEP-0030: Service Discovery
  */
-import BrowserStorage from "backbone.browserStorage";
 import converse from "./converse-core";
 import sizzle from "sizzle";
 
@@ -44,32 +43,27 @@ converse.plugins.add('converse-disco', {
                 this.waitUntilFeaturesDiscovered = utils.getResolveablePromise();
 
                 this.dataforms = new _converse.Collection();
-                this.dataforms.browserStorage = new BrowserStorage.session(
-                    `converse.dataforms-${this.get('jid')}`
-                );
+                let id = `converse.dataforms-${this.get('jid')}`;
+                this.dataforms.browserStorage = _converse.createStore(id, 'session');
 
                 this.features = new _converse.Collection();
-                this.features.browserStorage = new BrowserStorage.session(
-                    `converse.features-${this.get('jid')}`
-                );
+                id = `converse.features-${this.get('jid')}`;
+                this.features.browserStorage = _converse.createStore(id, 'session');
                 this.listenTo(this.features, 'add', this.onFeatureAdded)
 
                 this.fields = new _converse.Collection();
-                this.fields.browserStorage = new BrowserStorage.session(
-                    `converse.fields-${this.get('jid')}`
-                );
+                id = `converse.fields-${this.get('jid')}`;
+                this.fields.browserStorage = _converse.createStore(id, 'session');
                 this.listenTo(this.fields, 'add', this.onFieldAdded)
 
                 this.identities = new _converse.Collection();
-                this.identities.browserStorage = new BrowserStorage.session(
-                    `converse.identities-${this.get('jid')}`
-                );
+                id = `converse.identities-${this.get('jid')}`;
+                this.identities.browserStorage = _converse.createStore(id, 'session');
                 this.fetchFeatures(options);
 
                 this.items = new _converse.DiscoEntities();
-                this.items.browserStorage = new BrowserStorage.session(
-                    `converse.disco-items-${this.get('jid')}`
-                );
+                id = `converse.disco-items-${this.get('jid')}`;
+                this.items.browserStorage = _converse.createStore(id, 'session');
                 this.items.fetch();
             },
 
@@ -267,7 +261,7 @@ converse.plugins.add('converse-disco', {
             const id = `converse.stream-features-${bare_jid}`;
             if (!_converse.stream_features || _converse.stream_features.browserStorage.id !== id) {
                 _converse.stream_features = new _converse.Collection();
-                _converse.stream_features.browserStorage = new BrowserStorage.session(id);
+                _converse.stream_features.browserStorage = _converse.createStore(id, "session");
                 _converse.stream_features.fetch({
                     success (collection) {
                         if (collection.length === 0 && _converse.connection.features) {
@@ -331,10 +325,8 @@ converse.plugins.add('converse-disco', {
             _converse.connection.addHandler(onDiscoInfoRequest, Strophe.NS.DISCO_INFO, 'iq', 'get', null, null);
 
             _converse.disco_entities = new _converse.DiscoEntities();
-            _converse.disco_entities.browserStorage = new BrowserStorage.session(
-                `converse.disco-entities-${_converse.bare_jid}`
-            );
-
+            const id = `converse.disco-entities-${_converse.bare_jid}`;
+            _converse.disco_entities.browserStorage = _converse.createStore(id, 'session');
             const collection = await _converse.disco_entities.fetchEntities();
             if (collection.length === 0 || !collection.get(_converse.domain)) {
                 // If we don't have an entity for our own XMPP server,

src/headless/converse-muc.js

@@ -12,7 +12,6 @@
 import "./converse-disco";
 import "./converse-emoji";
 import "./utils/muc";
-import BrowserStorage from "backbone.browserStorage";
 import converse from "./converse-core";
 import u from "./utils/form";
 
@@ -488,14 +487,13 @@ converse.plugins.add('converse-muc', {
                 this.features = new Backbone.Model(
                     _.assign({id}, _.zipObject(converse.ROOM_FEATURES, converse.ROOM_FEATURES.map(_.stubFalse)))
                 );
-                this.features.browserStorage = new BrowserStorage.session(id);
+                this.features.browserStorage = _converse.createStore(id, "session");
             },
 
             initOccupants () {
                 this.occupants = new _converse.ChatRoomOccupants();
-                this.occupants.browserStorage = new BrowserStorage.session(
-                    `converse.occupants-${_converse.bare_jid}${this.get('jid')}`
-                );
+                const id = `converse.occupants-${_converse.bare_jid}${this.get('jid')}`;
+                this.occupants.browserStorage = _converse.createStore(id, 'session');
                 this.occupants.chatroom  = this;
                 this.occupants.fetched = new Promise(resolve => {
                     this.occupants.fetch({

src/headless/converse-roster.js

@@ -6,7 +6,6 @@
 /**
  * @module converse-roster
  */
-import BrowserStorage from "backbone.browserStorage";
 import converse from "@converse/headless/converse-core";
 
 const { Backbone, Strophe, $iq, $pres, dayjs, sizzle, _ } = converse.env;
@@ -68,18 +67,18 @@ converse.plugins.add('converse-roster', {
         _converse.initRoster = function () {
             const storage = _converse.config.get('storage');
             _converse.roster = new _converse.RosterContacts();
-            _converse.roster.browserStorage = new BrowserStorage[storage](
-                `converse.contacts-${_converse.bare_jid}`);
+            let id = `converse.contacts-${_converse.bare_jid}`;
+            _converse.roster.browserStorage = _converse.createStore(id, storage);
 
             _converse.roster.data = new Backbone.Model();
-            const id = `converse-roster-model-${_converse.bare_jid}`;
+            id = `converse-roster-model-${_converse.bare_jid}`;
             _converse.roster.data.id = id;
-            _converse.roster.data.browserStorage = new BrowserStorage[storage](id);
+            _converse.roster.data.browserStorage = _converse.createStore(id, storage);
             _converse.roster.data.fetch();
 
+            id = `converse.roster.groups${_converse.bare_jid}`;
             _converse.rostergroups = new _converse.RosterGroups();
-            _converse.rostergroups.browserStorage = new BrowserStorage[storage](
-                `converse.roster.groups${_converse.bare_jid}`);
+            _converse.rostergroups.browserStorage = _converse.createStore(id, storage);
             /**
              * Triggered once the `_converse.RosterContacts` and `_converse.RosterGroups` have
              * been created, but not yet populated with data.
@@ -152,7 +151,7 @@ converse.plugins.add('converse-roster', {
             initialize () {
                 this.resources = new Resources();
                 const id = `converse.identities-${this.get('jid')}`;
-                this.resources.browserStorage = new BrowserStorage.session(id);
+                this.resources.browserStorage = _converse.createStore(id, "session");
                 this.listenTo(this.resources, 'update', this.onResourcesChanged);
                 this.listenTo(this.resources, 'change', this.onResourcesChanged);
             },
@@ -446,7 +445,7 @@ converse.plugins.add('converse-roster', {
                             'add': true,
                             'silent': true,
                             'success': resolve,
-                            'error': reject
+                            'error': (m, e) => reject(e)
                         });
                     });
                 } catch (e) {
@@ -965,7 +964,7 @@ converse.plugins.add('converse-roster', {
             } else {
                 _converse.presences = new _converse.Presences();
                 const id = `converse.presences-${_converse.bare_jid}`;
-                _converse.presences.browserStorage = new BrowserStorage.session(id);
+                _converse.presences.browserStorage = _converse.createStore(id, "session");
                 // We might be continuing an existing session, so we fetch
                 // cached presence data.
                 _converse.presences.fetch();

src/headless/converse-vcard.js

@@ -6,7 +6,6 @@
 /**
  * @module converse-vcard
  */
-import BrowserStorage from "backbone.browserStorage";
 import converse from "./converse-core";
 import tpl_vcard from "./templates/vcard.html";
 
@@ -160,7 +159,7 @@ converse.plugins.add('converse-vcard', {
         _converse.initVCardCollection = function () {
             _converse.vcards = new _converse.VCards();
             const id = `${_converse.bare_jid}-converse.vcards`;
-            _converse.vcards.browserStorage = new BrowserStorage[_converse.config.get('storage')](id);
+            _converse.vcards.browserStorage = _converse.createStore(id, _converse.config.get('storage'));
             _converse.vcards.fetch();
         }
         _converse.api.listen.on('afterResourceBinding', _converse.initVCardCollection);