From a5242595073ce00a55ef7726ceeb2b9ea9a5d20f Mon Sep 17 00:00:00 2001 From: Christopher Charbonneau Wells Date: Thu, 22 Mar 2018 20:29:40 -0700 Subject: [PATCH] Replace Page Visibility API with focus event listener for dashboard refreshes. This is a bit of a testing phase to see if the focus event listerner behaves any better than the Page Visibility API, particularly in mobile browsers. --- dashboard/static_src/js/dashboard.js | 29 +++++++++++++++++++----- dashboard/templates/dashboard/child.html | 4 ++++ package-lock.json | 5 ---- package.json | 3 +-- 4 files changed, 28 insertions(+), 13 deletions(-) diff --git a/dashboard/static_src/js/dashboard.js b/dashboard/static_src/js/dashboard.js index 9b7f0de2..1972307f 100644 --- a/dashboard/static_src/js/dashboard.js +++ b/dashboard/static_src/js/dashboard.js @@ -6,7 +6,7 @@ BabyBuddy.Dashboard = function ($) { var runIntervalId = null; var dashboardElement = null; - var lastUpdate = moment(); + var hidden = null; var Dashboard = { watch: function(element_id, refresh_rate) { @@ -17,13 +17,30 @@ BabyBuddy.Dashboard = function ($) { return false; } - runIntervalId = setInterval(this.update, refresh_rate); + if (typeof document.hidden !== "undefined") { + hidden = "hidden"; + } + else if (typeof document.msHidden !== "undefined") { + hidden = "msHidden"; + } + else if (typeof document.webkitHidden !== "undefined") { + hidden = "webkitHidden"; + } - Visibility.change(function (e, state) { - if (state == 'visible' && moment().diff(lastUpdate) > 60000) { - Dashboard.update(); + if (typeof window.addEventListener === "undefined" || typeof document.hidden === "undefined") { + if (refresh_rate) { + runIntervalId = setInterval(this.update, refresh_rate); } - }); + } + else { + window.addEventListener('focus', Dashboard.handleVisibilityChange, false); + } + }, + + handleVisibilityChange: function() { + if (!document[hidden]) { + Dashboard.update(); + } }, update: function() { diff --git a/dashboard/templates/dashboard/child.html b/dashboard/templates/dashboard/child.html index 1fc7348e..536fb4f0 100644 --- a/dashboard/templates/dashboard/child.html +++ b/dashboard/templates/dashboard/child.html @@ -35,5 +35,9 @@ + {% else %} + {% endif %} {% endblock %} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index dc22cdd6..8cd1f050 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7730,11 +7730,6 @@ "source-map": "0.5.6" } }, - "visibilityjs": { - "version": "1.2.7", - "resolved": "https://registry.npmjs.org/visibilityjs/-/visibilityjs-1.2.7.tgz", - "integrity": "sha512-+5bhYUd8JtXVkUiWDSatVMqo+Zw1dnn+5BU6UaifKfy88Q1bfKTi4x2OdW/n0TBGHdK7ol25/p+7qwbsljbWwQ==" - }, "vlq": { "version": "0.2.3", "resolved": "https://registry.npmjs.org/vlq/-/vlq-0.2.3.tgz", diff --git a/package.json b/package.json index 9fec0aa1..c746caa3 100644 --- a/package.json +++ b/package.json @@ -25,9 +25,8 @@ "pump": "^3.0.0", "require-dir": "^1.0.0", "run-sequence": "^2.2.1", - "tempusdominus-core": "latest", "tempusdominus-bootstrap-4": "latest", - "visibilityjs": "^1.2.7" + "tempusdominus-core": "latest" }, "scripts": { "heroku-postbuild": "npm rebuild node-sass && gulp build"