FIX: puts focus-event at application level (#7568)

FIX: puts focus-event at application level (#7568)

Also attempts to use simpler and newer APIs

diff --git a/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6 b/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6
new file mode 100644
index 0000000..e9e5690
--- /dev/null
+++ b/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6
@@ -0,0 +1,36 @@
+function gotFocus() {
+  if (!Discourse.get("hasFocus")) {
+    Discourse.setProperties({ hasFocus: true, notify: false });
+  }
+}
+
+function lostFocus() {
+  if (Discourse.get("hasFocus")) {
+    Discourse.set("hasFocus", false);
+  }
+}
+
+let onchange;
+
+export default Ember.Mixin.create({
+  ready() {
+    this._super(...arguments);
+
+    onchange = () => {
+      document.visibilityState === "hidden" ? lostFocus() : gotFocus();
+    };
+
+    // Default to true
+    Discourse.set("hasFocus", true);
+
+    document.addEventListener("visibilitychange", onchange);
+  },
+
+  reset() {
+    this._super(...arguments);
+
+    document.removeEventListener("visibilitychange", onchange);
+
+    onchange = undefined;
+  }
+});
diff --git a/app/assets/javascripts/discourse.js.es6 b/app/assets/javascripts/discourse.js.es6
index 3ad7704..5bce67c 100644
--- a/app/assets/javascripts/discourse.js.es6
+++ b/app/assets/javascripts/discourse.js.es6
@@ -4,10 +4,11 @@ import {
   default as computed,
   observes
 } from "ember-addons/ember-computed-decorators";
+import FocusEvent from "discourse-common/mixins/focus-event";
 
 const _pluginCallbacks = [];
 
-const Discourse = Ember.Application.extend({
+const Discourse = Ember.Application.extend(FocusEvent, {
   rootElement: "#main",
   _docTitle: document.title,
   RAW_TEMPLATES: {},
diff --git a/app/assets/javascripts/discourse/initializers/focus-event.js.es6 b/app/assets/javascripts/discourse/initializers/focus-event.js.es6
deleted file mode 100644
index cb1432e..0000000
--- a/app/assets/javascripts/discourse/initializers/focus-event.js.es6
+++ /dev/null
@@ -1,68 +0,0 @@
-/**
-  Keep track of when the browser is in focus.
-**/
-export default {
-  name: "focus-event",
-
-  initialize: function() {
-    var hidden = "hidden";
-
-    // Default to true
-    Discourse.set("hasFocus", true);
-
-    var gotFocus = function() {
-      if (!Discourse.get("hasFocus")) {
-        Discourse.setProperties({ hasFocus: true, notify: false });
-      }
-    };
-
-    var lostFocus = function() {
-      if (Discourse.get("hasFocus")) {
-        Discourse.set("hasFocus", false);
-      }
-    };
-
-    var onchange = function(evt) {
-      var v = "visible",
-        h = "hidden",
-        evtMap = {
-          focus: v,
-          focusin: v,
-          pageshow: v,
-          blur: h,
-          focusout: h,
-          pagehide: h
-        };
-
-      evt = evt || window.event;
-      if (evt.type in evtMap) {
-        if (evtMap[evt.type] === "hidden") {
-          lostFocus();
-        } else {
-          gotFocus();
-        }
-      } else {
-        if (this[hidden]) {
-          lostFocus();
-        } else {
-          gotFocus();
-        }
-      }
-    };
-
-    // from StackOverflow http://stackoverflow.com/a/1060034/17174
-    if (hidden in document) {
-      document.addEventListener("visibilitychange", onchange);
-    } else if ((hidden = "mozHidden") in document) {
-      document.addEventListener("mozvisibilitychange", onchange);
-    } else if ((hidden = "webkitHidden") in document) {
-      document.addEventListener("webkitvisibilitychange", onchange);
-    } else if ((hidden = "msHidden") in document) {
-      document.addEventListener("msvisibilitychange", onchange);
-    }
-    // All others (including iPad which is a bit weird and gives onpageshow / hide
-    else {
-      window.onpageshow = window.onpagehide = window.onfocus = window.onblur = onchange;
-    }
-  }
-};

GitHub sha: bc8c7772

1 Like