updated to binding

When local storage for a bound object is updated, it now extends the
current object as opposed to overwriting it (this is to preserve
unserializable properties, e.g. functions)

Author: DaveWM

dist/angular-local-storage.js

@@ -1,6 +1,6 @@
 /**
  * An Angular module that gives you access to the browsers local storage
- * @version v0.1.5 - 2014-11-06
+ * @version v0.1.5 - 2014-11-27
  * @link https://github.com/grevory/angular-local-storage
  * @author grevory <[email protected]>
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -407,22 +407,25 @@ angularLocalStorage.provider('localStorageService', function() {
       } else if (isObject(value) && isObject(def)) {
         value = extend(def, value);
       }
-
       $parse(key).assign(scope, value);
 
       var onKeyUpdated = function (event) {
         if (event.key == deriveQualifiedKey(key)) {
-          scope[key] = getFromLocalStorage(key);
+          var updated = getFromLocalStorage(key);
+          if(scope[key] && typeof scope[key] === "object"){
+            angular.extend(scope[key], updated);
+          }
+          else {
+            scope[key] = updated;
+          }
           scope.$apply();
         }
       };
-
       $window.addEventListener("storage", onKeyUpdated, false);
 
       var unregisterWatch = scope.$watch(key, function (newVal) {
         addToLocalStorage(lsKey, newVal);
       }, isObject(scope[key]));
-
       return function () {
         unregisterWatch();
         $window.removeEventListener("storage", onKeyUpdated);

dist/angular-local-storage.min.js

@@ -380,22 +380,25 @@ angularLocalStorage.provider('localStorageService', function() {
       } else if (isObject(value) && isObject(def)) {
         value = extend(def, value);
       }
-
       $parse(key).assign(scope, value);
 
       var onKeyUpdated = function (event) {
         if (event.key == deriveQualifiedKey(key)) {
-          scope[key] = getFromLocalStorage(key);
+          var updated = getFromLocalStorage(key);
+          if(scope[key] && typeof scope[key] === "object"){
+            angular.extend(scope[key], updated);
+          }
+          else {
+            scope[key] = updated;
+          }
           scope.$apply();
         }
       };
-
       $window.addEventListener("storage", onKeyUpdated, false);
 
       var unregisterWatch = scope.$watch(key, function (newVal) {
         addToLocalStorage(lsKey, newVal);
       }, isObject(scope[key]));
-
       return function () {
         unregisterWatch();
         $window.removeEventListener("storage", onKeyUpdated);

src/angular-local-storage.js

@@ -347,6 +347,27 @@ describe('localStorageService', function() {
     expect($rootScope.test).toEqual(testValue);
   }));
 
+  it("should keep unserializable properties of bound objects when local storage is updated", inject(function ($rootScope, localStorageService, $window){
+    localStorageService.bind($rootScope, 'test');
+    $rootScope.test = {obj: {a:1}, func: function (){}};
+    // set the value in local storage mock to a value, then emit a changed event
+    var testValue = JSON.stringify({obj:{a:2}});
+    $window.localStorage['ls.test'] = testValue;
+    var evt = document.createEvent('CustomEvent');
+    evt.key = 'ls.test';
+    evt.newValue = 'test value';
+    evt.initCustomEvent('storage', true, true, {
+      key: 'ls.test',
+      newValue: testValue
+    });
+    window.dispatchEvent(evt);
+    $rootScope.$digest();
+
+    expect($rootScope.test.obj).toEqual({a:2});
+    expect($rootScope.test.func).toBeDefined();
+    expect(typeof $rootScope.test.func).toBe('function');
+  }));
+
   it('should be able to bind to scope using different key', inject(function($rootScope, localStorageService) {
 
     localStorageService.set('lsProperty', 'oldValue');