DragMath equation editor

Introduction

DragMath is an applet-based WYSIWYG equation editor created by Chris Sangwin and Alex 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 DragMath 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.

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

Suppose that you're typing in the HTML editor and you reach the 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) will be inserted into your text at the current cursor position.

Installing Dragmath

You install DragMath in two steps

1. install the DragMath package
2. 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 themodules and plugins database. In the zip archive, you will find two files.

• dlg_ins_smile.php -- Copy this file to the $CFG->dirroot/lib/editor/htmlarea/popups directory, overwriting the existing file
• icon_smile.gif -- Copy this file to the $CFG->dirroot/lib/editor/htmlarea/images directory, overwriting the existing file

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