Improve document focus control (#1167)

* Improve styles for #content-scroll-focus

* Create new class to manage and control document focus

* Use new focus class

* Add a check to prevent redundant .blur calls

2 files changed, 6 insertions, 1 deletions

diff --git a/ext/fg/float.html b/ext/fg/float.html
index 4dc0696e..2064e8ed 100644
--- a/ext/fg/float.html
+++ b/ext/fg/float.html
@@ -95,6 +95,7 @@
 <script src="/mixed/js/display-generator.js"></script>
 <script src="/mixed/js/display-history.js"></script>
 <script src="/mixed/js/display-notification.js"></script>
+<script src="/mixed/js/document-focus-controller.js"></script>
 <script src="/mixed/js/dynamic-loader.js"></script>
 <script src="/mixed/js/frame-endpoint.js"></script>
 <script src="/mixed/js/media-loader.js"></script>
diff --git a/ext/fg/js/float-main.js b/ext/fg/js/float-main.js
index a8554867..aee736a2 100644
--- a/ext/fg/js/float-main.js
+++ b/ext/fg/js/float-main.js
@@ -17,17 +17,21 @@
 
 /* global
  * Display
+ * DocumentFocusController
  * JapaneseUtil
  * api
  */
 
 (async () => {
     try {
+        const documentFocusController = new DocumentFocusController();
+        documentFocusController.prepare();
+
         api.forwardLogsToBackend();
         await yomichan.backendReady();
 
         const japaneseUtil = new JapaneseUtil(null);
-        const display = new Display('popup', japaneseUtil);
+        const display = new Display('popup', japaneseUtil, documentFocusController);
         await display.prepare();
         display.initializeState();