## TeXZilla 0.9.4 Released

By fredw on Tuesday, February 25 2014, 21:20 - Permalink

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

## Introduction

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`

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

`س = \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"); console.log(TeXZilla.toMathMLString("\\sqrt{\\frac{x}{2}+y}"));

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"); TeXZilla.setDOMParser(Cc["@mozilla.org/xmlextras/domparser;1"]. createInstance(Ci.nsIDOMParser));

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

TeXZilla.setDOMParser(Components. classes["@mozilla.org/xmlextras/domparser;1"]. createInstance(Components.interfaces.nsIDOMParser));

## 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="http://www.w3.org/1998/Math/MathML" 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=\"http://www.w3.org/1998/Math/MathML\"...

or a GET request:

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

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:
$\u0633\; =\; \backslash frac\{-\u0628\backslash pm\backslash sqrt\{\u0628^\u0662-\u0664\u0627\u062c\}\}\{\u0662\u0627\}$. 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.

## Comments

Been searching for "whats happening" with MathML. You seem to be the only person, doing the latest work.

What is my angle? Would like to see MathML working, just as HTML 3.2 does. (Seems to be getting there.) Mathematical typesetting in browsers, matching of LaTeX format.

@ReciprocalZone

Mentioned you on Twitter. Just FYI.