Move tab visibility code from grid.js to unsee.js

Instead of grid update run a full update, after keeping tab in the background for too long some alert groups are kept in the DOM where they should be purged. Chrome does some really complex background tab throttling, interwebz states that after >=10s in the background a tab can only use 1% of the cpu. Future code might need to use Web Workers API, assuming other vendors will use it too (https://arstechnica.com/information-technology/2017/03/chrome-57-background-tab-suspension-download/). For now let's just reload alerts when user switches to a previously background tab after more than a single refresh cycle, this will ensure that there's no dead alerts presents since that can be confusing

assets/static/grid.js

@@ -11,21 +11,6 @@ var Grid = (function() {
 
     var grid;
 
-    // when user switches to a different tab but keeps unsee tab open in the background
-    // some browsers (like Chrome) will try to apply some forms of throttling for the JS
-    // code, to ensure that there are no visual artifacts (like state alerts not removed from the page)
-    // redraw all alerts if we detect that the user switches from a different tab to unsee
-    var setupPageVisibilityHandler = function() {
-        // based on https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API
-        if (typeof document.hidden !== "undefined" && typeof document.addEventListener !== "undefined") {
-            document.addEventListener("visibilitychange", function() {
-                if (!document.hidden) {
-                    Grid.Redraw();
-                }
-            }, false);
-        }
-    };
-
     var init = function() {
         grid = $(selectors.alerts).masonry({
             itemSelector: selectors.incident,
@@ -39,7 +24,6 @@ var Grid = (function() {
                 opacity: 1
             }
         });
-        setupPageVisibilityHandler();
     };
 
     var clear = function() {

assets/static/unsee.js

@@ -9,6 +9,7 @@ var Unsee = (function() {
     var timer = false;
     var version = false;
     var refreshInterval = 15;
+    var hiddenAt = false;
 
     var selectors = {
         refreshButton: "#refresh",
@@ -16,6 +17,36 @@ var Unsee = (function() {
         instanceErrors: "#instance-errors",
     };
 
+    // when user switches to a different tab but keeps unsee tab open in the background
+    // some browsers (like Chrome) will try to apply some forms of throttling for the JS
+    // code, to ensure that there are no visual artifacts (like state alerts not removed from the page)
+    // redraw all alerts if we detect that the user switches from a different tab to unsee
+    var setupPageVisibilityHandler = function() {
+        // based on https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API
+        if (typeof document.hidden !== "undefined" && typeof document.addEventListener !== "undefined") {
+            document.addEventListener("visibilitychange", function() {
+                if (document.hidden) {
+                    // when tab is hidden set a timestamp of that event
+                    hiddenAt = moment().utc().unix();
+                } else {
+                    // when user switches back check if we have a timestamp
+                    // and if autorefresh is enable
+                    if (hiddenAt && Config.GetOption("autorefresh").Get()) {
+                        // get the diff to see how long tab was hidden
+                        var diff = moment().utc().unix() - hiddenAt;
+                        if (diff > refreshInterval) {
+                            // if it was hidden for more than one refresh cycle
+                            // then manually refresh alerts to ensure everything
+                            // is up to date
+                            Unsee.Reload();
+                        }
+                    }
+                    hiddenAt = false;
+                }
+            }, false);
+        }
+    };
+
     var init = function() {
         Progress.Init();
 
@@ -39,6 +70,8 @@ var Unsee = (function() {
             }
             return false;
         });
+
+        setupPageVisibilityHandler();
     };
 
     var getRefreshRate = function() {