summaryrefslogtreecommitdiff
path: root/_includes
diff options
context:
space:
mode:
authorjeffreytse <jeffreytse.mail@gmail.com>2020-12-28 12:04:18 +0800
committerjeffreytse <jeffreytse.mail@gmail.com>2020-12-28 12:04:18 +0800
commitae318f5d72e78b33836987545a99990ee9bec3b3 (patch)
tree1cb298a2b6b48df0745618bca5a8fe914155401e /_includes
parent1b2d59fd189ebc552f66fb1d920cb24e0ac26d62 (diff)
feat: better dark mode strategy (#15)
Whatever the user's choice is, it will supersede the default setting of the site and be kept during the visit (session). Only the dark mode setting is `manual`, the user's choise will be always kept on every visit (i.e. no matter the browser is closed or not)
Diffstat (limited to '_includes')
-rw-r--r--_includes/extensions/theme-toggle.html19
1 files changed, 12 insertions, 7 deletions
diff --git a/_includes/extensions/theme-toggle.html b/_includes/extensions/theme-toggle.html
index 623c425..634c932 100644
--- a/_includes/extensions/theme-toggle.html
+++ b/_includes/extensions/theme-toggle.html
@@ -17,18 +17,22 @@
(function() {
var sw = document.getElementById('theme-switch');
var html = document.getElementsByTagName('html')[0];
+ var nightModeOption = ('{{ night_mode }}' || 'auto').toLowerCase();
+ var storage = nightModeOption === 'manual'
+ ? localStorage
+ : sessionStorage;
var themeData = loadThemeData();
function saveThemeData(data) {
- localStorage.setItem('theme', JSON.stringify(data));
+ storage.setItem('theme', JSON.stringify(data));
}
function loadThemeData() {
- var data = localStorage.getItem('theme');
+ var data = storage.getItem('theme');
try {
data = JSON.parse(data ? data : '');
} catch(e) {
- data = { nightShift: false, autoToggleAt: 0 };
+ data = { nightShift: undefined, autoToggleAt: 0 };
saveThemeData(data);
}
return data;
@@ -81,9 +85,6 @@
handleThemeToggle(event.target.checked);
});
- var nightModeOption = '{{ night_mode }}' || 'auto';
- nightModeOption = nightModeOption.toLowerCase();
-
if (nightModeOption == 'auto') {
var data = autoThemeToggle();
@@ -97,7 +98,11 @@
} else if (nightModeOption == 'manual') {
handleThemeToggle(themeData.nightShift);
} else {
- handleThemeToggle(nightModeOption == 'on');
+ var nightShift = themeData.nightShift;
+ if (nightShift === undefined) {
+ nightShift = nightModeOption === 'on';
+ }
+ handleThemeToggle(nightShift);
}
})();
</script>