MathDox formula editor

The MathDox formula editor is a web-based editor for mathematical formulas. It is currently being developed at the Technische Universiteit Eindhoven as a means for students to enter formulas in an e-learning environment. Its main features are listed below.

The editor is written in Javascript and uses the HTML5 canvas element in combination with jsMath sprite fonts to render mathematics.

Any questions or comments about the editor are welcome and can be directed at info@mathdox.org.

Demo

The following formulas can be edited using your keyboard. Feel free to experiment. Supported are among others: integers, floating point numbers, variables, some keywords (like sin and pi), multiplication (*), division (/), addition (+), subtraction (-) and exponents (^).

It is possible to show zero, one or multiple palettes that can be used to insert something at the cursor position of the formulaeditor with focus. With this palette it is also possible to enter matrices and (square) roots.

To see an OpenMath representation of the first formula above click here. This demonstrates that a semantic tree of the formula is stored, and not just a presentation tree. To see a MathML representation of the first formula above click here. Note that the conversion to MathML has not been tested exhaustively and might still contain errors.

Usage

For a while this editor has been used in our MathDox software and students are making exercises by entering the answer with this editor. If you want to use the formula editor in a webpage, there are two ways to do so. The first method is by including a reference to the main javascript file at the mathdox.org server:

<script type='text/javascript' src='http://mathdox.org/formulaeditor/main.js'></script>

The second (alternative) method is by copying the formulaeditor javascript sources to the same location as the webpage, and reference the main javascript file from there:

<script type='text/javascript' src='org/mathdox/formulaeditor/main.js'></script>

In addition you also need to add a textarea of class 'mathdoxformula' at the place where you want the formula editing field to appear:

<textarea class='mathdoxformula'></textarea>

Download

Webpage authors that want to deploy the formula editor javascript sources to their own website can download the following package:

formulaeditor-1.1.31f.zip

Developers that are interested in changing the formulaeditor itself, can checkout the source from the subversion repository at:

https://mathdox.org/svn/repos/public/formulaeditor

Notes

Currently this editor is mostly tested in Mozilla Firefox (v3). It should however also work in other browsers: Microsoft Internet Explorer (v7), Safari, Opera, Konqueror.

Better documentation is needed on how to add new functions (like sin) or keywords (like pi). Furthermore it would be nice to have labels for the tabs of the palette.

Copyright information

Copyright (C) 2007-2008 Technische Universiteit Eindhoven

This library is free software; you can redistribute it and/or modify it under the terms of the GNU Lesser General Public License as published by the Free Software Foundation; either version 2.1 of the License, or (at your option) any later version.

This library is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more details.