Difference between revisions of "MediaWiki:Common.js"

From Path of Diablo Wiki
Jump to: navigation, search
(Created page with "mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Volker_E._(WMF)/dark-mode.js&action=raw&ctype=text/javascript' ); // User:Volker_E._(WMF)/dark-mode.js")
 
Line 1: Line 1:
mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Volker_E._(WMF)/dark-mode.js&action=raw&ctype=text/javascript' ); // [[User:Volker_E._(WMF)/dark-mode.js]]
+
/*
 +
* WikimediaUI Dark Mode
 +
*
 +
* Original authors:
 +
* - Volker E. (Wikimedia Foundation Product Design)
 +
* - Alex Hollender  (Wikimedia Foundation Product Design)
 +
* - Ed Sanders
 +
* - MusikAnimal
 +
*
 +
* Last updated: 2020-04-24
 +
*/
 +
 
 +
// Load dependencies (remove when loading through ResourceLoader).
 +
mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Volker_E._(WMF)/dark-mode.css&action=raw&ctype=text/css', 'text/css' );
 +
// User has dark color scheme preference set in operating system.
 +
if ( window.matchMedia( '( prefers-color-scheme: dark )' ).matches || mw.storage.get( 'client-dark-mode-toggle' ) === '1' ) {
 +
document.documentElement.className = 'client-dark-mode';
 +
}
 +
 
 +
$( function () {
 +
// Fix logos.
 +
$( '#p-logo' ).clone().addClass( 'mw-no-invert' ).insertAfter( '#p-logo' );
 +
 +
mw.util.addPortletLink( 'p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist' );
 +
 
 +
    $( '#pt-darkmode' ).on( 'click', function( e ) {
 +
    var $html = $( 'html' );
 +
        e.preventDefault();
 +
       
 +
        $html.toggleClass( 'client-dark-mode' );
 +
        mw.storage.set(
 +
'client-dark-mode-toggle',
 +
String( Number( $html.hasClass( 'client-dark-mode' ) ) )
 +
);
 +
    } );
 +
} );

Revision as of 04:31, 27 August 2023

/* 
 * WikimediaUI Dark Mode
 *
 * Original authors:
 * - Volker E. (Wikimedia Foundation Product Design)
 * - Alex Hollender  (Wikimedia Foundation Product Design)
 * - Ed Sanders
 * - MusikAnimal
 *
 * Last updated: 2020-04-24
 */

// Load dependencies (remove when loading through ResourceLoader).
mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Volker_E._(WMF)/dark-mode.css&action=raw&ctype=text/css', 'text/css' );
// User has dark color scheme preference set in operating system.
if ( window.matchMedia( '( prefers-color-scheme: dark )' ).matches || mw.storage.get( 'client-dark-mode-toggle' ) === '1' ) {
	document.documentElement.className = 'client-dark-mode';
}

$( function () {
	// Fix logos.
	$( '#p-logo' ).clone().addClass( 'mw-no-invert' ).insertAfter( '#p-logo' );
	
	mw.util.addPortletLink( 'p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist' );

    $( '#pt-darkmode' ).on( 'click', function( e ) {
    	var $html = $( 'html' );
        e.preventDefault();
        
        $html.toggleClass( 'client-dark-mode' );
        mw.storage.set(
			'client-dark-mode-toggle',
			String( Number( $html.hasClass( 'client-dark-mode' ) ) )
		);
    } );
} );