"storage" event is not fired in active tab on compliant browsers. Bind to internal event instead

Author: STRML

dist/angular-local-storage.js

@@ -15,7 +15,9 @@ var isDefined = angular.isDefined,
   isObject = angular.isObject,
   isArray = angular.isArray,
   extend = angular.extend,
-  toJson = angular.toJson;
+  toJson = angular.toJson,
+  fromJson = angular.toJson;
+
 var angularLocalStorage = angular.module('LocalStorageModule', []);
 
 angularLocalStorage.provider('localStorageService', function() {
@@ -357,7 +359,7 @@ angularLocalStorage.provider('localStorageService', function() {
           try {
             return JSON.parse(storedValues);
           } catch(e) {
-            return storedValues
+            return storedValues;
           }
         }
       }
@@ -401,26 +403,24 @@ angularLocalStorage.provider('localStorageService', function() {
       }
       $parse(key).assign(scope, value);
 
-      var onKeyUpdated = function (event) {
-        if (event.key == deriveQualifiedKey(key)) {
-          var updated = getFromLocalStorage(key);
-          if(scope[key] && typeof scope[key] === "object"){
-            angular.extend(scope[key], updated);
-          }
-          else {
-            scope[key] = updated;
+      var onKeyUpdated = function (event, data) {
+        if (data.key === key) {
+          scope[key] = fromJson(data.newvalue);
+          if(!scope.$$phase) {
+            scope.$apply();
           }
-          scope.$apply();
         }
       };
-      $window.addEventListener("storage", onKeyUpdated, false);
+      $rootScope.$on('LocalStorageModule.notification.setitem', onKeyUpdated);
+      $rootScope.$on('LocalStorageModule.notification.removeitem', onKeyUpdated);
 
       var unregisterWatch = scope.$watch(key, function (newVal) {
         addToLocalStorage(lsKey, newVal);
       }, isObject(scope[key]));
       return function () {
         unregisterWatch();
-        $window.removeEventListener("storage", onKeyUpdated);
+        $rootScope.$off('LocalStorageModule.notification.setitem', onKeyUpdated);
+        $rootScope.$off('LocalStorageModule.notification.removeitem', onKeyUpdated);
       };
     };
 

dist/angular-local-storage.min.js

@@ -339,7 +339,7 @@ angularLocalStorage.provider('localStorageService', function() {
           try {
             return JSON.parse(storedValues);
           } catch(e) {
-            return storedValues
+            return storedValues;
           }
         }
       }
@@ -383,26 +383,24 @@ angularLocalStorage.provider('localStorageService', function() {
       }
       $parse(key).assign(scope, value);
 
-      var onKeyUpdated = function (event) {
-        if (event.key == deriveQualifiedKey(key)) {
-          var updated = getFromLocalStorage(key);
-          if(scope[key] && typeof scope[key] === "object"){
-            angular.extend(scope[key], updated);
+      var onKeyUpdated = function (event, data) {
+        if (data.key === key) {
+          scope[key] = fromJson(data.newvalue);
+          if(!scope.$$phase) {
+            scope.$apply();
           }
-          else {
-            scope[key] = updated;
-          }
-          scope.$apply();
         }
       };
-      $window.addEventListener("storage", onKeyUpdated, false);
+      $rootScope.$on('LocalStorageModule.notification.setitem', onKeyUpdated);
+      $rootScope.$on('LocalStorageModule.notification.removeitem', onKeyUpdated);
 
       var unregisterWatch = scope.$watch(key, function (newVal) {
         addToLocalStorage(lsKey, newVal);
       }, isObject(scope[key]));
       return function () {
         unregisterWatch();
-        $window.removeEventListener("storage", onKeyUpdated);
+        $rootScope.$off('LocalStorageModule.notification.setitem', onKeyUpdated);
+        $rootScope.$off('LocalStorageModule.notification.removeitem', onKeyUpdated);
       };
     };
 

src/angular-local-storage.js

@@ -7,4 +7,5 @@ var isDefined = angular.isDefined,
   isObject = angular.isObject,
   isArray = angular.isArray,
   extend = angular.extend,
-  toJson = angular.toJson;
+  toJson = angular.toJson,
+  fromJson = angular.toJson;