Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

MediaWiki removed MathJax. Can MathJax be forced on client side another way?

Much to my displeasure, MediaWiki has recently disabled support for MathJax (ticket: T99369) rendering of TeX formulae wikipedia-wide.

Since me (and others, if you skim the ticket's discussion thread) find the rendering with the remaining options (MathML, PNG) inferior, I would like to "slipstream" MathJax into Wikipedia.

Since loading further JavaScript files directly via the custom JavaScript settings in Wikipedia does not seem possible using <script> elements, I am at a loss on how to achieve this feat. Would it be, MathJax could be included via CDN most easily.

I am using current Edge and Firefox browsers, so any solution working with one or both of them would be greatly appreciated!


Meanwhile, I found Greasemonkey for Firefox, which might be able to accomplish this, given a suitable script. Since I am neither a Greasemonkey-, nor a JavaScript-expert, any hint on how to proceed to write such a script would be helpful.

like image 721
Jinxed Avatar asked Aug 08 '15 09:08

Jinxed


1 Answers

As a registered user, you can do the following:

Under user preferences => appearance, switch on the "MathML with SVG or PNG fallback" mode. (The other two modes require a slightly different script but imho that mode is the best option right now.)

Next edit your user specific scripts page at https://en.wikipedia.org/wiki/User:YOURHANDLE/common.js [Don't forget to change user name!] and add the following custom script to it:

// add to User:YOURNAME/common.js to get smooth MathJax rendering
var mathTags = $('.mwe-math-mathml-a11y');
if (mathTags.length > 0){ //only do something when there's math on the page
  window.MathJax = { //hook into MathJax's configuration
    AuthorInit: function () {
      MathJax.Hub.Register.StartupHook("End",function () { //when MathJax is done...
        MathJax.Hub.Queue(
            function(){
             mathTags.removeClass('mwe-math-mathml-a11y'); // .. make the span around MathML (now MathJax output) visible
             $('.mwe-math-fallback-image-inline').addClass('mwe-math-mathml-a11y'); //hide fallback images
            }
        );
      });
    }
  };
  mw.loader.load('https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=MML_HTMLorMML-full');//load MathJax with a suitable combined config file
}

This script loads MathJax only when there's math in the page, renders it, and (when rendering its done) replaces the fallback images with the results.

This way, you have very little jitter. From a quick test this seems to work on Chrome 43, Firefox 39, IE8 and Edge, and WebKit 2.6.2 (so should work on Safari).

like image 63
Peter Krautzberger Avatar answered Oct 14 '22 16:10

Peter Krautzberger