StarCitizenTools/mediawiki-skins-Citizen
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git synced 2024-09-24 02:38:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: fix theme switcher logic (#202)

Browse source 
* refactor: Fix switching theme

* ci: lint code to MediaWiki standards

Check commit and GitHub actions for more details

Co-authored-by: github-actions <github-actions@users.noreply.github.com>
This commit is contained in:
H. C. Kruse 2021-01-11 23:13:01 +01:00 committed by GitHub
parent e27fe0b998
commit b4488f8ddb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
includes/CitizenHooks.php
View file

@ -175,7 +175,7 @@ class CitizenHooks {
wfMessage( 'prefs-citizen-theme-option-light' )->escaped() => 'light',
wfMessage( 'prefs-citizen-theme-option-dark' )->escaped() => 'dark',
],
'default' => 'auto',
'default' => MediaWikiServices::getInstance()->getUserOptionsLookup()->getOption( $user, 'CitizenThemeUser' ) ?? 'auto',
// Only show this section when the Citizen skin is checked. The JavaScript client also uses
// this state to determine whether to show or hide the whole section.
'hide-if' => [ '!==', 'wpskin', 'citizen' ],

6
resources/skins.citizen.scripts.theme/inline.js
View file

@ -4,7 +4,7 @@
*
* https://starcitizen.tools
*/
(() => {
window.switchTheme = () => {
try {
const cookieTheme = document.cookie.match(/skin-citizen-theme=(dark|light|auto)/);
const theme = cookieTheme !== null ? cookieTheme.pop() : null;
@ -17,4 +17,8 @@
}
} catch (e) {
}
}
(() => {
window.switchTheme()
})();

30
resources/skins.citizen.scripts.theme/theme-switcher.js
View file

@ -6,7 +6,17 @@
( function () {
var prefersColorSchemeDarkQuery,
userTheme,
theme;
theme,
setCookieChangeTheme;
setCookieChangeTheme = function ( themeName ) {
try {
window.mw.cookie.set( 'skin-citizen-theme', themeName );
} catch ( e ) {
}
window.switchTheme();
};
if ( typeof window.mw === 'undefined' ) {
return;
@ -26,6 +36,7 @@
if ( theme !== 'auto' ) {
return;
}
try {
if ( window.mw.cookie.get( 'skin-citizen-theme-override' ) === '1' ) {
return;
@ -33,21 +44,14 @@
} catch ( e ) {}
prefersColorSchemeDarkQuery = window.matchMedia( '(prefers-color-scheme: dark)' );
theme = 'light';
if ( prefersColorSchemeDarkQuery.matches ) {
theme = 'dark';
}
prefersColorSchemeDarkQuery.addEventListener( 'change', function ( e ) {
if ( e.matches ) {
theme = 'dark';
} else {
theme = 'light';
}
} );
setCookieChangeTheme( theme );
try {
window.mw.cookie.set( 'skin-citizen-theme', null );
window.mw.cookie.set( 'skin-citizen-theme', theme );
} catch ( e ) {
}
prefersColorSchemeDarkQuery.addEventListener( 'change', function ( e ) {
setCookieChangeTheme( e.matches ? 'dark' : 'light' );
} );
}() );

17
resources/skins.citizen.scripts/skins.citizen.scripts.js
View file

@ -51,7 +51,6 @@ main();
toggleBtn.addEventListener( 'click', function ( clickEvent ) {
try {
theme = theme === 'dark' ? 'light' : 'dark';
clickEvent.target.classList.remove( 'theme-toggle-light', 'theme-toggle-dark' );
@ -66,21 +65,7 @@ main();
} catch ( e ) {
}
[ 'auto', 'dark', 'light' ].map( function ( themeSuffix ) {
// * skin-citizen-auto
// * skin-citizen-dark
// * skin-citizen-light
return 'skin-citizen-' + themeSuffix;
} ).forEach( function ( cssClass ) {
// * skin-citizen-auto
// * skin-citizen-dark
// * skin-citizen-light
document.documentElement.classList.remove( cssClass );
} );
// * skin-citizen-auto
// * skin-citizen-dark
// * skin-citizen-light
document.documentElement.classList.add( 'skin-citizen-' + theme );
window.switchTheme();
} catch ( e ) {
}
} );