michaelh/hugo-academic-mirror
1
0
Fork 0
mirror of https://github.com/gcushen/hugo-academic.git synced 2025-07-26 03:00:50 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor: JS

Browse source
This commit is contained in:
George Cushen 2020-12-08 22:17:17 +00:00
commit 1d54566688
2 changed files with 15 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

13
wowchemy/assets/js/wowchemy-theming.js
View file

@ -9,7 +9,7 @@
import {fadeIn} from './wowchemy-animation';
function getThemeMode() {
return parseInt(localStorage.getItem('dark_mode') || 2);
return parseInt(localStorage.getItem('wcTheme') || 2);
}
function canChangeTheme() {
@ -59,13 +59,13 @@ function changeThemeModeClick(newMode) {
let isDarkTheme;
switch (newMode) {
case 0:
localStorage.setItem('dark_mode', '1');
localStorage.setItem('wcTheme', '1');
isDarkTheme = true;
console.info('User changed theme variation to Dark.');
showActiveTheme(0);
break;
case 1:
localStorage.setItem('dark_mode', '2');
localStorage.setItem('wcTheme', '2');
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
// The visitor prefers dark themes and switching to the dark variation is allowed by admin.
isDarkTheme = true;
@ -73,13 +73,14 @@ function changeThemeModeClick(newMode) {
// The visitor prefers light themes and switching to the dark variation is allowed by admin.
isDarkTheme = false;
} else {
isDarkTheme = window.wc.isSiteThemeDark; // Use the site's default theme variation based on `light` in the theme file.
// Use the site's default theme variation based on `light` in the theme file.
isDarkTheme = window.wc.isSiteThemeDark;
}
console.info('User changed theme variation to Auto.');
showActiveTheme(1);
break;
default:
localStorage.setItem('dark_mode', '0');
localStorage.setItem('wcTheme', '0');
isDarkTheme = false;
console.info('User changed theme variation to Light.');
showActiveTheme(2);
@ -141,7 +142,6 @@ function renderThemeVariation(isDarkTheme, init = false) {
if (isDarkTheme === false) {
if (!init) {
// Only fade in the page when changing the theme variation.
//$('body').css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 500);
Object.assign(document.body.style, {opacity: 0, visibility: 'visible'});
fadeIn(document.body, 600);
}
@ -188,4 +188,5 @@ export {
initThemeVariation,
changeThemeModeClick,
renderThemeVariation,
getThemeMode,
};

10
wowchemy/assets/js/wowchemy.js
View file

@ -5,7 +5,13 @@
* Core JS functions and initialization.
**************************************************/
import {canChangeTheme, changeThemeModeClick, initThemeVariation, renderThemeVariation} from './wowchemy-theming';
import {
canChangeTheme,
changeThemeModeClick,
getThemeMode,
initThemeVariation,
renderThemeVariation
} from './wowchemy-theming';
/* ---------------------------------------------------------------------------
@ -442,7 +448,7 @@ $(document).ready(function () {
}
const darkModeOn = e.matches;
console.log(`OS dark mode preference changed to ${darkModeOn ? '🌒 on' : '☀️ off'}.`);
let currentThemeVariation = parseInt(localStorage.getItem('dark_mode') || 2);
let currentThemeVariation = getThemeMode();
let isDarkTheme;
if (currentThemeVariation === 2) {
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {