From d9521c58bf9b9fef0c8b1248bf6ce8c69351fc16 Mon Sep 17 00:00:00 2001
From: Kuuuube <61125188+Kuuuube@users.noreply.github.com>
Date: Wed, 19 Jun 2024 12:57:21 -0400
Subject: Remove flickering on page loads, reduce flashbangs, fix settings and
 popup themes applying correctly (#1088)

* Pull theme from settings on page load

* Make dark mode default

* Fix flickering on load

* Invert shadow for auto shadow theme

* Revert "Make dark mode default"

This reverts commit 4cdfc39686a9faa3ce7a620be23025f97816f5f9.

* Improve page load times

* Fix flicker on load for popup preview without breaking theming when auto is selected

* Revert shadow invert
---
 ext/js/pages/settings/settings-display-controller.js | 11 +++++++++--
 ext/js/pages/settings/settings-main.js               | 13 ++++++++-----
 2 files changed, 17 insertions(+), 7 deletions(-)

(limited to 'ext/js/pages/settings')

diff --git a/ext/js/pages/settings/settings-display-controller.js b/ext/js/pages/settings/settings-display-controller.js
index e179b835..a2150a15 100644
--- a/ext/js/pages/settings/settings-display-controller.js
+++ b/ext/js/pages/settings/settings-display-controller.js
@@ -47,9 +47,9 @@ export class SettingsDisplayController {
     }
 
     /** */
-    prepare() {
+    async prepare() {
         this._themeController.prepare();
-        void this._updateTheme();
+        await this._setTheme();
 
         const onFabButtonClick = this._onFabButtonClick.bind(this);
         for (const fabButton of /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.fab-button'))) {
@@ -98,6 +98,13 @@ export class SettingsDisplayController {
         }
     }
 
+    /** */
+    async _setTheme() {
+        this._themeController.theme = (await this._settingsController.getOptions()).general.popupTheme;
+        this._themeController.siteOverride = true;
+        this._themeController.updateTheme();
+    }
+
     /** */
     async _updateTheme() {
         const theme = this._themeDropdown?.value;
diff --git a/ext/js/pages/settings/settings-main.js b/ext/js/pages/settings/settings-main.js
index a315eac4..ebb51276 100644
--- a/ext/js/pages/settings/settings-main.js
+++ b/ext/js/pages/settings/settings-main.js
@@ -91,6 +91,14 @@ await Application.main(true, async (application) => {
     const settingsController = new SettingsController(application);
     await settingsController.prepare();
 
+    const settingsDisplayController = new SettingsDisplayController(settingsController, modalController);
+    await settingsDisplayController.prepare();
+
+    document.body.hidden = false;
+
+    const popupPreviewController = new PopupPreviewController(settingsController);
+    popupPreviewController.prepare();
+
     const persistentStorageController = new PersistentStorageController(application);
     preparePromises.push(persistentStorageController.prepare());
 
@@ -124,9 +132,6 @@ await Application.main(true, async (application) => {
     const ankiTemplatesController = new AnkiTemplatesController(application, settingsController, modalController, ankiController);
     preparePromises.push(ankiTemplatesController.prepare());
 
-    const popupPreviewController = new PopupPreviewController(settingsController);
-    popupPreviewController.prepare();
-
     const scanInputsController = new ScanInputsController(settingsController);
     preparePromises.push(scanInputsController.prepare());
 
@@ -169,8 +174,6 @@ await Application.main(true, async (application) => {
     const sortFrequencyDictionaryController = new SortFrequencyDictionaryController(settingsController);
     preparePromises.push(sortFrequencyDictionaryController.prepare());
 
-    const settingsDisplayController = new SettingsDisplayController(settingsController, modalController);
-    settingsDisplayController.prepare();
 
     await Promise.all(preparePromises);
 
-- 
cgit v1.2.3