User:Novusistic/TUT toggleFontColor.js

// Loads the modules: mediawiki.util and oojs-ui.core. $.when( mw.loader.using( [ 'mediawiki.util', 'oojs-ui-core' ] ), $.ready ).then( function {

// Creates a OOUI button (to be discussed in Mission 4). var button = new OO.ui.ButtonWidget( {		label: 'Toggle color',		flags: [ 'primary', 'progressive' ],		classes: [ 'toggleColorBtn' ]	} );

// Adds a element to the HEAD and returns the CSSStyleSheet object. var myCssRules = mw.util.addCSS( '#content { color: #EB5160; }' ); myCssRules.disabled = true;

button.on( 'click', function {		// When button is clicked, toggle the stylesheet from true to non-true (false), or from		// false to non-false (true).		myCssRules.disabled = !myCssRules.disabled;	} );

// Appends the button to the top panel. $( '#p-personal ul' ).append( $( '' ).append( button.$element ) );

} );