From 6e815ba0328e5f317704cd33493cbee6fd9433d0 Mon Sep 17 00:00:00 2001 From: Joffrey JAFFEUX Date: Wed, 2 Oct 2019 02:53:51 +0200 Subject: [PATCH] DEV: adds discourse:focus-changed app event (#8123) --- .../mixins/focus-event.js.es6 | 49 ++++++++++--------- .../components/discourse-topic.js.es6 | 7 +-- 2 files changed, 30 insertions(+), 26 deletions(-) diff --git a/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6 b/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6 index 7aafebdccee..b5081fae7de 100644 --- a/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6 +++ b/app/assets/javascripts/discourse-common/mixins/focus-event.js.es6 @@ -1,40 +1,43 @@ -function gotFocus() { - if (!Discourse.get("hasFocus")) { - Discourse.setProperties({ hasFocus: true, notify: false }); - } -} - -function lostFocus() { - if (Discourse.get("hasFocus")) { - Discourse.set("hasFocus", false); - } -} - -let onchange; +import { getOwner } from "discourse-common/lib/get-owner"; export default Ember.Mixin.create({ ready() { this._super(...arguments); - onchange = () => { - document.visibilityState === "hidden" ? lostFocus() : gotFocus(); - }; + this._onChangeHandler = Ember.run.bind(this, this._onChange); // Default to true Discourse.set("hasFocus", true); - document.addEventListener("visibilitychange", onchange); - document.addEventListener("resume", onchange); - document.addEventListener("freeze", onchange); + document.addEventListener("visibilitychange", this._onChangeHandler); + document.addEventListener("resume", this._onChangeHandler); + document.addEventListener("freeze", this._onChangeHandler); }, reset() { this._super(...arguments); - document.removeEventListener("visibilitychange", onchange); - document.removeEventListener("resume", onchange); - document.removeEventListener("freeze", onchange); + document.removeEventListener("visibilitychange", this._onChangeHandler); + document.removeEventListener("resume", this._onChangeHandler); + document.removeEventListener("freeze", this._onChangeHandler); - onchange = undefined; + this._onChangeHandler = null; + }, + + _onChange() { + const container = getOwner(this); + const appEvents = container.lookup("app-events:main"); + + if (document.visibilityState === "hidden") { + if (Discourse.hasFocus) { + Discourse.set("hasFocus", false); + appEvents.trigger("discourse:focus-changed", false); + } + } else { + if (!Discourse.hasFocus) { + Discourse.setProperties({ hasFocus: true, notify: false }); + appEvents.trigger("discourse:focus-changed", true); + } + } } }); diff --git a/app/assets/javascripts/discourse/components/discourse-topic.js.es6 b/app/assets/javascripts/discourse/components/discourse-topic.js.es6 index f94788b4707..7e3011fb6ef 100644 --- a/app/assets/javascripts/discourse/components/discourse-topic.js.es6 +++ b/app/assets/javascripts/discourse/components/discourse-topic.js.es6 @@ -110,6 +110,7 @@ export default Ember.Component.extend( } ); + this.appEvents.on("discourse:focus-changed", this, "gotFocus"); this.appEvents.on("post:highlight", this, "_highlightPost"); this.appEvents.on("header:update-topic", this, "_updateTopic"); }, @@ -129,13 +130,13 @@ export default Ember.Component.extend( // this happens after route exit, stuff could have trickled in this._hideTopicInHeader(); + this.appEvents.off("discourse:focus-changed", this, "gotFocus"); this.appEvents.off("post:highlight", this, "_highlightPost"); this.appEvents.off("header:update-topic", this, "_updateTopic"); }, - @observes("Discourse.hasFocus") - gotFocus() { - if (Discourse.get("hasFocus")) { + gotFocus(hasFocus) { + if (hasFocus) { this.scrolled(); } },