From 10bb2e57ffed15ddfaea57a7a24609abe09565d2 Mon Sep 17 00:00:00 2001
From: Arkerthan <arkerthan@gmail.com>
Date: Fri, 31 Jul 2020 20:12:34 +0200
Subject: [PATCH] Make Theming framework more robust
---
src/gui/theming.js | 34 ++++++++++++++++------------------
src/js/eventHandlers.js | 1 +
2 files changed, 17 insertions(+), 18 deletions(-)
diff --git a/src/gui/theming.js b/src/gui/theming.js
index ceb8e641d96..6b0a083578c 100644
--- a/src/gui/theming.js
+++ b/src/gui/theming.js
@@ -5,19 +5,10 @@ App.UI.Theme = (function() {
let currentThemeElement = null;
let devTheme = null;
- // reload theme on page reload
- $(document).on(":storyready", () => {
- if (currentThemeElement === null) {
- const file = SugarCube.storage.get("theme");
- if (file !== null) {
- load(file);
- }
- }
- });
-
return {
selector: selector,
devTheme: reloadDevTheme,
+ init: loadFromStorage,
};
/**
@@ -31,13 +22,13 @@ App.UI.Theme = (function() {
selector.accept = ".css";
div.append(selector);
- div.append(App.UI.DOM.link("Apply", () => {
- unload();
+ div.append(" ", App.UI.DOM.link("Apply", () => {
+ unset();
if (selector.files.length > 0) {
const themeFile = selector.files[0];
- load(themeFile.name);
+ set(themeFile.name);
}
- }), " ", App.UI.DOM.link("Unload", unload));
+ }), " ", App.UI.DOM.link("Unload", unset));
return div;
}
@@ -45,12 +36,12 @@ App.UI.Theme = (function() {
/**
* @param {string} filename or filepath relative to the HTML file.
*/
- function load(filename) {
+ function set(filename) {
SugarCube.storage.set("theme", filename);
currentThemeElement = newTheme(filename);
}
- function unload() {
+ function unset() {
if (currentThemeElement !== null) {
document.head.removeChild(currentThemeElement);
currentThemeElement = null;
@@ -58,6 +49,13 @@ App.UI.Theme = (function() {
}
}
+ function loadFromStorage() {
+ const file = SugarCube.storage.get("theme");
+ if (file !== null) {
+ set(file);
+ }
+ }
+
/**
* Unloads current dev theme and loads new theme if specified.
* @param {string} [filename]
@@ -70,8 +68,6 @@ App.UI.Theme = (function() {
if (filename !== undefined) {
devTheme = newTheme(filename);
- // make it unique to force reloading instead of using the cached version
- devTheme.href += `?id=${Date.now()}`;
}
}
@@ -85,6 +81,8 @@ App.UI.Theme = (function() {
theme.setAttribute("rel", "stylesheet");
theme.setAttribute("type", "text/css");
theme.setAttribute("href", `./${filename}`);
+ // make it unique to force reloading instead of using the cached version
+ devTheme.href += `?id=${Date.now()}`;
document.head.appendChild(theme);
return theme;
}
diff --git a/src/js/eventHandlers.js b/src/js/eventHandlers.js
index 9942b621297..b3dc43b08a8 100644
--- a/src/js/eventHandlers.js
+++ b/src/js/eventHandlers.js
@@ -22,6 +22,7 @@ App.EventHandlers = function() {
}
function storyReady() {
+ App.UI.Theme.init();
App.UI.Hotkeys.init();
}
--
GitLab