|
// Broadcast state change to other tabs
broadcastChannel.postMessage(isOn);
}
function checkDisableNativeDarkMode() {
const appearanceMenu = document.getElementById( 'skin-client-prefs-skin-theme' );
// If the appearance menu is not present, try again in 1s. The UI hasn't stabilised yet.
if ( !appearanceMenu ) {
setTimeout( () => {
checkDisableNativeDarkMode();
}, 1000 );
return;
}
const classList = document.documentElement.classList;
const lightMode = document.getElementById( 'skin-client-pref-skin-theme-value-day' );
if ( lightMode && !lightMode.checked ) {
classList.remove( 'skin-theme-clientpref-night', 'skin-theme-clientpref-os' );
classList.add( 'skin-theme-clientpref-day' );
mw.notify( $(
`<span>Native dark mode has been enabled. Please set "Color" to light theme to avoid conflicts with the dark mode gadget to suppress this message.
<a href="https://en.wikipedia.org/wiki/MediaWiki:Gadget-dark-mode/compatibility_with_native">More information</a></span>`
) );
} else {
// everything is good - just disable the radios!
$(appearanceMenu).find('input').prop('disabled', true);
// add exclusion notice
const p = document.createElement('p');
p.setAttribute('class','exclusion-notice skin-theme-exclusion-notice');
p.textContent = 'This has been disabled by the dark mode gadget. Disable the gadget to use this feature.';
$( p ).insertAfter( $(appearanceMenu).find( 'form' ) );
}
}
setThemeColor();
addPortlets();
checkDisableNativeDarkMode();
// Recover state if the navigation was too quick
| 