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

1 files changed, 17 insertions, 15 deletions

diff --git a/ext/js/pages/info-main.js b/ext/js/pages/info-main.js
index 079a8c3a..08abc12b 100644
--- a/ext/js/pages/info-main.js
+++ b/ext/js/pages/info-main.js
@@ -117,6 +117,23 @@ async function showDictionaryInfo(api) {
 }
 
 await Application.main(true, async (application) => {
+    const settingsController = new SettingsController(application);
+    await settingsController.prepare();
+
+    /** @type {ThemeController} */
+    const themeController = new ThemeController(document.documentElement);
+    themeController.prepare();
+    const optionsFull = await application.api.optionsGetFull();
+    const {profiles, profileCurrent} = optionsFull;
+    const primaryProfile = (profileCurrent >= 0 && profileCurrent < profiles.length) ? profiles[profileCurrent] : null;
+    if (primaryProfile !== null) {
+        themeController.theme = primaryProfile.options.general.popupTheme;
+        themeController.siteOverride = true;
+        themeController.updateTheme();
+    }
+
+    document.body.hidden = false;
+
     const documentFocusController = new DocumentFocusController();
     documentFocusController.prepare();
 
@@ -152,21 +169,6 @@ await Application.main(true, async (application) => {
     void showAnkiConnectInfo(application.api);
     void showDictionaryInfo(application.api);
 
-    const settingsController = new SettingsController(application);
-    await settingsController.prepare();
-
-    /** @type {ThemeController} */
-    const themeController = new ThemeController(document.documentElement);
-    themeController.prepare();
-    const optionsFull = await application.api.optionsGetFull();
-    const {profiles, profileCurrent} = optionsFull;
-    const primaryProfile = (profileCurrent >= 0 && profileCurrent < profiles.length) ? profiles[profileCurrent] : null;
-    if (primaryProfile !== null) {
-        themeController.theme = primaryProfile.options.general.popupTheme;
-        themeController.siteOverride = true;
-        themeController.updateTheme();
-    }
-
     const backupController = new BackupController(settingsController, null);
     await backupController.prepare();