Blog de Frédéric

To content | To menu | To search

Tag - mathzilla

Entries feed - Comments feed

Wednesday, June 18 2014

Mozilla MathML Add-ons

Four years ago I started to write some MathML add-ons using Jetpack 0.8, now called Add-on SDK. I've recently made progress on this project, so that all the initial features are now available as Firefox add-ons (my initial hope was that the Add-on SDK would eventually be compatible with all Gecko browsers but unfortunately that still does not seem to be the case at the moment). The Mathzilla collection is available on AMO but some of the add-ons are still undergoing review. Here is an overview:

  • The math editor feature is now provided by the TeXZilla add-on. The Arabic math support I experimented a bit later is also available.

  • The conversion of content MathML using David Carlisle's XSLT stylesheet is now in its own MathML-ctop add-on. There is another similar add-on to add MathML3 features missing in Gecko called MathML-mml3ff. Note that these add-ons do not rely on the Add-on SDK and will work in any Gecko browsers. However, they should probably be improved.

  • Another add-on that does not rely on the Add-on SDK is the one adding mathematical fonts called MathML-fonts. I uploaded version 2.0 to use the new OpenType MATH fonts supported in Gecko 31, but I hope that it will no longer be necessary in the future (more on this later).

  • The conversion of PNG images into MathML is now provided by the Image to MathML add-on. At the moment, it is still experimental, see the details on if you want to help. It only works for some Web sites using LaTeX in alt text but I wish I can find a solution for Wolfram Websites.

  • Since many Web sites are using MathJax and because in the meantime MathJax moved to its slow HTML-CSS output by default I had to write an add-on to force MathJax to use native MathML, which is available here. Actually, it's even better since it disables the mml2jax preprocessor to avoid useless work by MathJax for Web sites that already use MathML in the source code. It also prevents the MathJax menu to override the browser user interface (note that the three add-ons below provide some UI features similar to what one can find in MathJax).

  • The feature to copy a MathML formula is now provided by the MathML Copy add-on. Note that it actually copies two flavors (text and html). It is also possible to copy the original TeX source when it is provided (e.g. on MDN).

  • A new MathML Zoom add-on provides a zooming feature similar to what MathJax does.

  • A new MathML Font Settings add-on allows to configure font-family and font-size of mathematics similar to what MathJax provides. Note however, that the list of font-family choices in the context menu is based on the OpenType MATH fonts that will only be supported in Gecko 31.

I believe splitting the original Mathzilla add-on into many add-ons gives more flexibility to let people choose the desired features. As usual, help to localize the add-ons is very welcome.

Tuesday, February 25 2014

TeXZilla 0.9.4 Released

update 2014/03/11: TeXZilla is now available as an npm module.


For the past two months, the Mozilla MathML team has been working on TeXZilla, yet another LaTeX-to-MathML converter. The idea was to rely on itex2MML (which dates back from the beginning of the Mozilla MathML project) to create a LaTeX parser such that:

  • It is compatible with the itex2MML syntax and is similarly generated from a LALR(1) grammar (the goal is only to support a restricted set of core LaTeX commands for mathematics, for a more complete converter of LaTeX documents see LaTeXML).
  • It is available as a standalone Javascript module usable in all the Mozilla Web applications and add-ons (of course, it will work in non-Mozilla products too).
  • It accepts any Unicode characters and supports right-to-left mathematical notation (these are important for the world-wide aspect of the Mozilla community).

The parser is generated with the help of Jison and relies on a grammar based on the one of itex2MML and on the unicode.xml file of the XML Entity Definitions for Characters specification. As suggested by the version number, this is still in development. However, we have made enough progress to present interesting features here and get more users and developers involved.

Quick Examples

\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1

x2a2+y2b2=1\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1

∑_{n=1}^{+∞} \frac{1}{n^2} = \frac{π^2}{6}

n=1+1n2=π26∑_{n=1}^{+∞} \frac{1}{n^2} = \frac{π^2}{6}

س = \frac{-ب\pm\sqrt{ب^٢-٤اج}}{٢ا}

س=-ب±ب٢-٤اج٢اس = \frac{-ب\pm\sqrt{ب^٢-٤اج}}{٢ا}

Live Demo / FirefoxOS Web app

A live demo is available to let you test the LaTeX-to-MathML converter with various options and examples. For people willing to use the converter on their mobiles a FirefoxOS Web app is also available.

Using TeXZilla in a CommonJS program or Web page

TeXZilla is made of a single TeXZilla.js file with a public API to convert LaTeX to MathML or extract the TeX source from a MathML element. The converter accepts some options like inline/display mode or RTL/LTR direction of mathematics.

You can load it the standard way in any Javascript program and obtain a TeXZilla object that exposes the public API. For example in a commonJS program, to convert a TeX source into a MathML source:

  var TeXZilla = require("./TeXZilla");

or in a Web Page, to convert a TeX source into a MathML DOM element:

  <script type="text/javascript" src="TeXZilla.js"></script>
  var MathMLElement = TeXZilla.toMathML("\\sqrt{\\frac{x}{2}+y}");

Using TeXZilla in Mozilla Add-ons

One of the goal of TeXZilla is to be integrated in Mozilla add-ons, allowing people to write cool math applications (in particular, we would like to have an add-on for Thunderbird). A simple Firefox add-on has been written and passed the AMO review, which means that you can safely include the TeXZilla.js script in your own add-ons.

TeXZilla can be used as an addon-sdk module. However, if you intend to use features requiring a DOMParser instance (for example toMathML), you need to initialize the DOM explicitly:

  var {Cc, Ci} = require("chrome");

More generally, for traditional Mozilla add-ons, you can do


Using TeXZilla from the command line

TeXZilla has a basic command line interface. However, since CommonJS is still being standardized, this may work inconsistently between commonjs interpreters. We have tested it on slimerjs (which uses Gecko), phantomjs and nodejs. For example you can do

  $ slimerjs TeXZilla.js parser "a^2+b^2=c^2" true
  <math xmlns="" display="block"><semantics><...

or launch a Web service (see next section). We plan to implement a stream filter too so that it can behave the same as itex2MML: looking the LaTeX fragments from a text document and converting them into MathML.

Using TeXZilla as a Web Server

TeXZilla can be used as a Web Server that receives POST and GET HTTP requests with the LaTeX input and sends JSON replies with the MathML output. The typical use case is for people willing to perform some server-side LaTeX-to-MathML conversion.

For instance, to start the TeXZilla Webserver on port 7777:

  $ nodejs TeXZilla.js webserver 7777
  Web server started on http://localhost:7777

Then you can sent a POST request:

  $ curl -H "Content-Type: application/json" -X POST -d '{"tex":"x+y","display":"true"}' http://localhost:7777
  {"tex":"x+y","mathml":"<math xmlns=\"\"...

or a GET request:

  $ curl "http://localhost:7777/?tex=x+y&rtl=true"
  {"tex":"x+y","mathml":"<math xmlns=\"\"...

Note that client-side conversion is trivial using the public API, but see the next section.

Web Components Custom Element <x-tex>

We used the X-Tag library to implement a simple Web Components Custom Element <x-tex>. The idea is to have a container for LaTeX expressions like

  <x-tex dir="rtl">س = \frac{-ب\pm\sqrt{ب^٢-٤اج}}{٢ا}</x-tex>

that will be converted into MathML by TeXZilla and displayed in your browser: س=-ب±ب٢-٤اج٢اس = \frac{-ب\pm\sqrt{ب^٢-٤اج}}{٢ا}. You can set the display/dir attributes on that <x-tex> element and they will be applied to the <math> element. Instances of <x-tex> elements also have a source property that you can use to retrieve or set the LaTeX source. Of course, the MathML output will automatically be updated when dynamic changes occur. You can try this online demo.

CKEditor Plugins / Integration in MDN

Finally, we created a first version of a TeXZilla CKEditor plugin. An online demo is available here. We already sent a pull request to Kuma and we hope it will soon enable users to put mathematical mathematical formulas in MDN articles without having to paste the MathML into the source code view. It could be enhanced later with a more advanced UI.

Wednesday, January 29 2014

New MathML Firefox add-ons on AMO

While the patches for MathML integration in MediaWiki are progressively being reviewed and merged and while we are working on the support for Open Type fonts with a MATH table in Gecko, I finally found time to check the progress in Mozilla's add-on SDK. In particular, since the last time I tried (some years ago) they have introduced a cleaner interface for content scripts as well as the possibility to use XPCOM for missing features. Hence I have been able to update some of my experimental MathML add-ons. I have submitted two new add-ons to Mozilla's AMO that I hope could be useful to some people:

  • MathJax Native MathML, an add-on to force MathJax to switch to Gecko's MathML support without having to use the MathJax menu to change the output mode and works even on Websites where that menu is disabled. This also removes MathJax's automatic rescaling and inline-block span that are currently causing random rendering bugs with Gecko's native MathML (and will confuse possible future line-breaking support anyway).
    MathJax Native MathML
  • MathML Copy (at the moment only partially reviewed by the AMO team), an add-on to copy MathML and TeX into the clipboard. For MathML, two flavors are copied: the source as plain text (to paste in your favorite text editor) and the MathML as HTML (to paste in Thunderbird, MDN, any Gecko-based HTML editor etc). Copying TeX is only possible when it is provided via the standard MathML annotation method, which is the case in e.g. LaTeXML and Instiki documents as well as in Wikipedia in the future.
    MathML Copy

As usual, there is room for improvements and bug fixes, but that's a start. In particular I would be happy to get translations for the two strings of the MathML Copy add-on: "Copy MathML Formula" and "Copy TeX Source". Also, because I used the add-on SDK these add-ons are unfortunately only available for Firefox at the moment...

Thursday, April 7 2011

Arabic mathematics in Mathzilla

I have just modified a bit the Mathzilla add-ons to experiment with writing arabic math...

Arabic math in Mathzilla

Monday, November 15 2010

Mozilla MathML Add-ons

I've released two betas of Mozilla MathML add-ons for trunk builds:

  1. MathParser: mathparser-0.1.xpi (Linux x86_64, 95.7 KB)
  2. Mathzilla: mathzilla-0.1.xpi (168.85 KB)

MathParser adds an XPCOM component to parse mathematical expressions into MathML and should be usable with any Mozilla application. Two modes are available: simple or itex (see part 1 and part 2). Mathzilla is an add-on for Firefox, based on jetpack 0.8. It requires MathParser to be installed and provides the following features that people interested in MathML are likely to appreciate:

  • A tiny MathML editor. It's basically an interface for MathParser, with an input field and a MathML rendering of the output.
  • Conversion of Content MathML, based on David Carlisle's ctop.xsl. A good workaround for bug 276028.
  • Conversion of PNG images into MathML. Of course, this works only on websites that provide the LaTeX source as alt text. In particular, it is usable on Wikipedia and hence allows to workaround Wikimedia's bug 6383.
  • A copy MathML formula item in the context menu. For the moment, I've only tested the text/unicode flavor, so I'm not sure the application/mathml+xml flavor works. See bug 539506 and transferring MathML for more information. Of course, this allows to copy the MathML outputs of the three previous features ;-)

Some screenshots:

MathML Testsuite, testing content markup.
Content Markup of the MathML testsuite transformed into Presentation Markup using ctop.xsl.

Interface of Mathzilla  Parser, LaTeX input.
The interface of the Mathzilla parser, with Unicode-friendly itex input.

MathML formula on Wikipedia.
Wikipedia's page on Fourier series with PNG images transformed into presentation MathML.

- page 1 of 2