Use ResourceLoader in MediaWiki

In MediaWiki, starting from version 1.17, a new mechanism for assembling and loading styles and scripts has appeared - ResourceLoader . In this article, I will describe its use with the example of the GoogleCodePrettify extension, which adds the syntaxhighlight tag to the MediaWiki markup.

All extension authors are strongly advised to use the new mechanism to replace obsolete addScript etc.

First, let's define the resource module for loading:

 $wgResourceModules['ext.GoogleCodePrettify'] = array( 'localBasePath' => dirname(__FILE__), 'remoteExtPath' => 'GoogleCodePrettify', 'styles' => array('google-code-prettify/prettify.css'), 'scripts' => array('google-code-prettify/prettify.js', 'init.js') ); 

')
Now when loading the Wiki markup parser, we will process the syntaxhighlight tag:

 // Register parser hook $wgHooks['ParserFirstCallInit'][] = 'efGoogleCodePrettify_Setup'; /** * Register parser hook */ function efGoogleCodePrettify_Setup( &$parser ) { $parser->setHook('syntaxhighlight', array('GoogleCodePrettify', 'parserHook')); return true; } class GoogleCodePrettify { private static $prettified = false; public static function parserHook($text, $args = array(), $parser) { self::$prettified = true; return "<pre class=\"prettyprint\">$text</pre>"; } 

And finally, add the necessary styles and scripts if necessary:

 // Register before display hook $wgHooks['BeforePageDisplay'][] = 'GoogleCodePrettify::beforePageDisplay'; #   public static function beforePageDisplay(&$wgOut, &$sk) { if (self::$prettified) { $wgOut->addModules('ext.GoogleCodePrettify'); } // Continue return true; } 

The assembly styles and scripts ResourceLoader will take over. Note that with the debug = 1 option in the query string, it will render the styles and scripts “as is”.

Yes, I almost forgot. Here is the init.js script:

 (function($, window) { $(window.document).ready(function() { window.prettyPrint(); }); })(window.jQuery, window); 

---

See also:

• Project repository on GitHub ;
• Google Code Prettify Library ;
• Documentation ResourceLoader ;
• Another example of a simple extension using ResourceLoader: MediaWiki-MashaJS .