AngularJS save $http in localStorage.md

Build a customized localStorage API in AngularJS to store $http response and refresh after 12 hours.

localStorage API extended Ben Nadel's Encapsulation LocalStorage Access in AngularJS

http://jsfiddle.net/gh/gist/library/pure/f6420d5528798add91cc/

fiddle.html

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.js"></script>
<div ng-app="myapp" ng-controller="MyAppController">
    Hello, localStorage is created at {{test}}
</div>

fiddle.js

var app_data_feature = angular.module('appDataFeature', [])
  .value('storageKey', 'ls_key')
  .factory('storage', function($exceptionHandler, $window, storageKey) {
    var items = loadData();
    var persistHooks = [];
    var persistEnabled = true;
    // update localStorage before page is unloaded
    $window.addEventListener('beforeunload', persistData);

    return ({
      clear: clear,
      disablePersist: disablePersist,
      enablePersist: enablePersist,
      onBeforePersist: onBeforePersist,
      extractItem: extractItem, // get and delete
      removeItem: removeItem,
      getItem: getItem,
      setItem: setItem,
      directSetItem: directSetItem, // set and force LS to update
      reloadData: reloadData, // reload data
      updateLocalStorage: updateLocalStorage, // force LS to update
      getAll: getAll
    });

    function updateLocalStorage() {
      try {
        $window.localStorage.setItem(storageKey, angular.toJson(items));
      } catch (localStorageError) {
        $exceptionHandler(localStorageError);
      }
    }

    function loadData() {
      try {
        if (storageKey in $window.localStorage) {
          var data = $window.localStorage.getItem(storageKey);
          //$window.localStorage.removeItem( storageKey );
          // Deserialize data and make sure it returns an obj
          return angular.extend({}, angular.fromJson(data));
        }
      } catch (localStorageError) {
        $exceptionHandler(localStorageError);
      }
      return( {} );
    }

    function reloadData(newData) {
      items = angular.copy(newData);
    }

    function clear() {
      items = {};
    }

    function disablePersist() {
      persistEnabled = false;
    }

    function enablePersist() {
      persistEnabled = true;
    }

    function onBeforePersist(operator) {
      persistHooks.push(operator);
    }

    function extractItem(key) {
      var value = getItem(key);
      removeItem(key);
      return(value);
    }

    function removeItem(key) {
      delete(items[key]);
    }

    function getItem(key) {
      return ((key in items) ? angular.copy(items[key]) : null );
    }

    function getAll() {
      return angular.copy(items);
    }

    function directSetItem(key,value) {
      setItem(key,value);
      updateLocalStorage();
    }

    function setItem(key,value) {
      items[key] = angular.copy(value);
    }

    function persistData() {
      // run hooks
      for (var i = 0, length=persistHooks.length; i<length; i++) {
        try {
          persistHooks[i]();
        } catch (persistHookError) {
          $exceptionHandler(persistHookError);
        }
      }

      if (!persistEnabled) {
        return;
      }

      updateLocalStorage();
    }

  })
  .factory('remoteService', function($http) {
    return ({
      getJson1: function() {
        console.log('json1 from service is loaded successfully');
        return $http.get('https://raw.githubusercontent.com/levonlee/jsSandbox/master/sample1.json');
      },
      getJson2: function() {
        console.log('json2 from service is loaded successfully');
        return $http.get('https://raw.githubusercontent.com/levonlee/jsSandbox/master/sample2.json');
      }
    });
  })
  .factory('localRemoteService', function($q, storage, remoteService) {
    var deferred = $q.defer();
    var get_LS = storage.getItem("dateReceived");
    console.log('get_LS');
    console.log(get_LS);

    if (get_LS && !toRefresh(get_LS)) {
      console.log('localStorage has value');
      deferred.resolve(storage.getAll());
    } else {
      console.log('localStorage empty');
      deferred.resolve(remoteService.getJson1().then(
        function(response) {
          console.log('call remoteService in localRemoteService');
          console.log('update localStorage using remoteService response');
          var dateReceived = new Date;
          storage.reloadData(response.data);
          storage.directSetItem("dateReceived",dateReceived);
          return(response.data);
        })
      );
    }

    return deferred.promise;

    function toRefresh(lsReceivedDate) {
      var d = new Date;
      var received = new Date(lsReceivedDate);
      var interval = 1000*60*60*12; // every 12 hours
      if ((d - received) > interval ) return true;
      return false;
    }
  });

var app = angular.module('myapp', ['appDataFeature'])
  .controller('MyAppController', ['$scope', 'localRemoteService',
    function ($scope, localRemoteService) {
      localRemoteService.then(function(response) {
        console.log('Finished calling localRemoteService');
        applyJSON(response);
      });

      function applyJSON(data) {
        console.log(data);
        $scope.test = data;
      }
    }
  ]);

fiddle.manifest

normalize_css: no
panel_jss: 0
panel_css: 0
wrap: b