DragMath equation editor

Introduction

DragMath is an applet-based WYSIWYG equation editor created by Christoper Sangwin and Alexander Billingsley at the University of Birmingham as part of the STACK project. DragMath allows students to build mathematical expressions in a traditional two-dimensional way using a graphical drag-and-drop interface. DragMath can output the finished expression in any of several computer-oriented linear syntaxes, including LaTeX. Since Moodle already supports LaTeX (with the TeX filter) LaTeX was used as the "bridge" for Moodle integration.

You can see a demo of the DragMath editor here. The DragMath interface is highly intuitive and anyone can be using it productively after a few minutes of trial-and-error. If you have questions about the editor, there is a short manual here.

Integrating the DragMath editor with Moodle

The DragMath editor does not come supplied with Moodle. You (or your administrator) will have to install it.

DragMath is integrated with Moodle through a new button on the HTML editor toolbar. This way, the DragMath editor is available most everywhere that you or your students are called upon to enter text.

Suppose that you're entering in the HTML editor and you reach a point where you want to insert a mathematical expression. Push the DragMath button to launch DragMath editor in a small popup window. Create the math expression in DragMath and click the "Insert button" when you're done. The editor will disappear and the LaTeX markup (with $$ delimiters added at both ends) will be inserted into your text at the current cursor position.

Installing Dragmath

You install DragMath in two steps

install the DragMath package
install the DragMath Integration package

Install the DragMath package

Download the latest DragMath zip file from sourceforge and unzip it in the $CFG->dirroot/lib/editor/htmlarea/popups directory (where $CFG->dirroot is your "moodle" directory as defined in config.php). This will create a new directory under popups called DragMath containing all the necessary DragMath components.

Install the DragMath Integration package

Note: this will REPLACE the smiley button on the HTML editor toolbar with the DragMath editor button. It was done this way so as to keep the installation as simple as possible. If want to retain your smiley button, consult the postings in the Mathematical Tools forum

Download the latest DragMath integration package from the modules and plugins database. In the zip archive, you will find two files.

dlg_ins_smile.php -- Copy this file to your $CFG->dirroot/lib/editor/htmlarea/popups directory, overwriting the existing file (you may want to make a copy of the original file before overwriting it)
icon_smile.gif -- Copy this file to your $CFG->dirroot/lib/editor/htmlarea/images directory, overwriting the existing file (you may want to make a copy of the original file before overwriting it)

You must also change two lines in the file $CFG->dirroot/lib/editor/htmlarea/dialog.js

around line 34 you will see the line:

case "dlg_ins_smile": x = 330; y = 320; break;

Change this line to

case "dlg_ins_smile": x = 540; y = 340; break;

around line 47, you will see a line that begins

var dlg = window.open(url, "ha_dialog", "toolbar=no, menubar=no, ...

Modify this line, changing

resizable=no

to

resizable=yes

Documentation