Results 1 to 3 of 3

Thread: Question on local storage and user settings

Threaded View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Sencha User
    Join Date
    Apr 2012
    Billerica, MA
    Vote Rating

    Default Answered: Question on local storage and user settings

    I'm adding user settings to my Sencha Touch app, and using local storage to store them, but am not sure the best way to manage it.

    As I've seen suggested in other threads, I have a UserSettings model (I only have one setting so far):

    Ext.define('MyApp.model.UserSettings', {
      extend: '',
      config: {
        identifier: 'uuid',
        fields: [
          { name: 'debugLog', type: 'boolean' }
        proxy: {
          type: 'localstorage',
          id: 'MyApp.UserSettings'
    And then I have a UserSettingsStore store:

    Ext.define('', {
      extend: '',  
      config: {
        model: 'MyApp.model.UserSettings',
        autoLoad: true
    Doing a quick test in my app's launch method, it seems to behave like I want. If there are zero records, it creates one with the default values.

            var settingsStore = Ext.getStore('UserSettingsStore');
            if (settingsStore.getCount() == 0) {
              console.log("No stored settings, creating default");
              settingsStore.add({debugLog: true});
    This works as expected. The first time the app is run, "No stored settings, creating default" is printed to the console then the default settings model is created with debugLog equal to true.

    Here's my question - What's the best way to expose this model instance to other parts of the app that want to work with preferences?

    So, for example, on my settings screen, the user sets debugLog to false. I want to avoid every time calling to the store, loading the instance, then getting/setting values, then syncing. It just seems like a lot of repeated code to me.

    What about creating a helper class, like MyApp.util.SettingsManager, that exposes a simple interface for each setting, e.g. there would be a getDebugLog() and setDebugLog() method which would delegate to looking up the model, setting the value, and syncing it?

    So for example:

    Ext.define('MyApp.util.SettingsManager', {
      getSettingsInstance: function() {
        var store = Ext.getStore('UserSettingsStore');
        if (store.getCount() == 0) {
            // create record with default values
            store.add({debugLog: true});
        return store.getAt(0);
      getDebugLog: function() {
        var instance = this.getSettingsInstance();
        return instance.get('debugLog');
      setDebugLog: function(debugLogValue) {
        var instance = this.getSettingsInstance();
        instance.set('debugLog', debugLogValue);;
    Does this make any sense, or am I completely off base? Is there a usual best practice for a case like this, access to a single global model instance?

  2. I would say that using stores for a simple key-value settings storage is not necessary. Other than getting and setting values, do you really need the advanced features provided with an

    How about simply setting key-value pairs in localStorage? After all, that's what LS is made for. Of course, you can use your own prefix, such as cfg (cfgDebugLog) to make things easier.

    If this sounds like a sound idea, I'd create a singleton, as you initially suggested, but would not create a method for each option. Simply App.UserCfg.get('debugLog') should do. The method would translate this into

    return localStorage.getItem('cfgDebugLog');
    How does that sound to you?

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts