News from MathTran

Just another weblog

JavaScript event handling problems

with 4 comments

For our live preview online TeX editor we would like to handle key events of a textarea. Depending on the context we want to intercept the key events and let the default action happen (i.e. a character will be inserted into the textarea or the cursor will be moved) or prevent the default action and execute our own code based on the information of the key event.

Well, little we knew of how difficult it is to get the event information you need due to various browser incompatibilities. We had to do some research on the topic and would like to share our findings here for future reference.

First of all, Peter-Paul Koch has an interesting blog entry with event compatibility tables for various browsers. There, you can already see that the key events are not all cross-browser compatible. As we are especially interested in these events, Jan Wolter’s JavaScript Madness: Keyboard Events proved to be an extremely valuable resource.

Based on the above articles we decided to use the keydown event to handle all special keys, which means keys that do not produce a character, i.e. Enter, Backspace, the arrow keys. To handle character input we use the keypress event. The keypress event object has a property which holds the character that corresponds to the pressed key or keys. This property has different names in different browsers but is available in all of them. An additional difficulty is the fact that some browsers do fire keypress events for special keys and some do not.

For jQuery, there exists a plugin called fix_events, which can be used to normalize event properties. Currently we do not use this plugin because our use would be very limited. Instead we incorporated the compatibility checks within our code.


Written by mystar22

July 21, 2008 at 4:35 pm

Posted in Uncategorized

More on testing JavaScript code

with one comment

In a previous post I talked about how we would like to test ‘pure’ (i.e. DOM independent) JavaScript functions in an automated fashion.

Spidermonkey offers a command line interpreter and the ability to call scripts like js.exe -f "script1.js" -f "script2.js" -e "run_this();". Unfortunately, both of these features are not available for Windows cscript.exe, cscript can only execute one script file and terminates after it is done.

Koby Kahane has created a workaround to add command line interpreter abilities to cscript (although his code did not work for me). In order to be able to load different script files and execute commands using a single command, we wrote a litle python script which uses the same interface as spidermonkey’s js.exe, create a temporary file, and call cscript with this file.

Here is the code (no error checking)


import sys, os
import subprocess

def main(argv):

    tmp_filename = 'msjs_tmp_file.wsf'
    includes = ''
    executes = ''

    for i in range(len(argv)) :
        if argv[i]=='-f' :
            includes += '\n' % argv[i+1]
        elif argv[i]=='-e' :
            executes += '\n\t%s\n\n' % argv[i+1]

    code = '\n%s%s\n' % (includes, executes)

    tmp_file = open(tmp_filename,'w')

    subprocess.Popen('cscript.exe '+tmp_filename).communicate()[0]


if __name__ == '__main__' :


The use of a real temporary file using the tempfile module is not possible, as in Windows you cannot open the temporary file a second time, which cscript would have to do.

Let us assume that we have a file add_def.js


// Provide 'print' command in Windows scripting - cscript.
if (typeof WScript == 'object'){
    function print(str){

add = function(a,b){return a+b;}


Now, we can do python -f "add_def.js" -e "print(add(2,3));" and it will result in the same code being called by cscript as by js.exe for the same command. The generated temporary file looks like this:


<script language="JScript" src="add_def.js"/>
<script language="JScript">

Written by mystar22

July 8, 2008 at 5:24 pm

Posted in Uncategorized

JavaScript split problems

with 2 comments

During the development of some string manipulation methods we ran into some problems with the JavaScript implementation of the split method in different browsers when using regular expressions as delimiters. Other people have had this problem before and Steven Levithan has a nice article about the topic including a script which fixes the inconsistencies between the different browsers, and a test page.

We decided not to use his implementation of the split method, because we do not want to rely on third party code which we have to supply with our distribution and which might break with new browser versions coming out. Instead, we will use a work-around only containing JavaScript code which is consistent among different browsers.

Written by mystar22

June 19, 2008 at 6:31 pm

Posted in Uncategorized

Writing testable string manipulation code

leave a comment »

For our project we need a lot of string manipulation code. For example, given a textarea and a selection range, we want to extract the paragraph containing the selection and, later, extract the TeX code parts in that paragraph.

We decided to use test driven development for writing cross-browser code for these tasks. A set of tests is designed, which consist of input parameters and the expected output a function should return when called with the given input parameters. Whenever our function does not give the expected output an error message is printed and we know that the code is not correct.

The test framework then consists of the function X that we want to test, the tests, and a test runner function which runs the tests on X and compares the actual output with the expected output. To do this in an automated fashion, we call the js file with a JavaScript interpreter. For Windows we use SpiderMonkey (Mozilla’s implementation of JavaScript) and the build-in Windows Script Host.

After installing SpiderMonkey, we can call our script with “js X.js”, to use the Windows Script Host run “cscript X.js”

This setup allows us to test our code on Mozilla’s and Windows’ JavaScript implementation using the same test data on the command line.

Written by mystar22

June 19, 2008 at 2:07 pm

Posted in Uncategorized

Demonstration of autocomplete

leave a comment »

While I’ve been away on holiday Christoph has completed a demonstration version of TeX-command autocompletion.  You can play with it here.

I’m very please with what he’s done, and am interested in producing an online version of Scott Pakin’s Comprehensive LaTeX symbol list (view as PDF), which has several thousand symbols.

In most situations, there will be a subset of relevant symbols, which will depend on what is being authored.  Many symbols are required only in special areas.

Written by Jonathan Fine

June 15, 2008 at 1:36 pm

Posted in Uncategorized

Autocomplete for Tex commands

leave a comment »

As we have decided on using jQuery for the MathTran online Tex editor, I have been looking for some jQuery plugins to provide autocomplete functionality for Tex commands.

The jQuery Autocomplete Mod found at looks promising but it requires a few changes. Ideally the plugin should work for text in a textarea, suggesting commands for the last typed characters just underneath the cursor. The plugins I have found so far were designed for input fields of type text and used the whole value of the field to query the database of known words.

I will continue looking for an existing plugin with the required features, but might have to modify one of the existing ones to fit my needs.

Written by mystar22

May 4, 2008 at 6:16 pm

Posted in Uncategorized

GSOC: Getting started

with 3 comments

Why we need some books

As part of the Google Summer of Code (GSOC), I will be mentoring Christoph Hafmeister’s project to create an OnLine TeX Editor. This will be written in JavaScript, and will use the public MathTran server to provide TeX typesetting as a web service. It will offer something close to instant preview for mathematics (network connections permitting).

To help us learn the tricks of the trade, we’ve decided to buy some books. And to help us communicate, we’ll both have a copy of these books. That way, it’s easier for us to share our experiences, even though we’re not likely to meet during the project. (This is one of the big changes the rise of print made to learning, in the 16th century.)

So here are the books we’ll be sharing, and why.

Read the rest of this entry »

Written by Jonathan Fine

April 25, 2008 at 12:02 pm

Posted in Uncategorized