A small GWT application

I had some time today, so I built a little AJAX application for this blog. It’s an expression calculator. The world really doesn’t need another one, but it was the easiest thing that includes ANTLR for building a lexer/parser/AST and the Google Web Toolkit for building the client. Why? Because it’s fun …

If the application doesn’t load, please click here!

Before I was able to include a GWT application within a post in this WordPress powered blog, I had to create a WordPress plugin that generates the necessary meta tags. GWT applications only work, when those meta tags are present.

The actual calculation of the expression is done on the server with the help of my Java based framework. The expression is sent to the server asynchronously as a JSON data packet. The server logic evaluates the expression and sends back either the result, or an error message. If you want to see an error message, try a division by 0. The response is sent also in the JSON format back to the browser, where the GWT application takes it and displays it without refreshing the whole page.

The server side logic is built with the help of ANTLR and ANTLR Studio for Eclipse. Instead of writing a lexer and parser for evaluation of the expressions myself, I’ve used a grammar to let these tools do it for me. The following screenshot shows ANTLR Studio for Eclipse in action:

Eclipse screenshot with ANTLR Studio

If you want to know what ANTLR is, here is a quote from Terence Parr, the primary author of ANTLR. He has been working on translation tools since the late 80s:

ANTLR, ANother Tool for Language Recognition, (formerly PCCTS) is a parser and translator generator tool, akin to the venerable lex/yacc duo, that lets you construct recognizers, compilers, and source-to-source translators from grammatical descriptions containing C++ or Java actions. You can build translators for database formats, graphical data files (e.g., PostScript, AutoCAD), text processing files (e.g., HTML, SGML), etc. ANTLR is designed to handle all of your translation tasks. ANTLR is recommended by the co-inventor of LL(k) parsers and by the inventor of SLR(k) and LALR(k) parser.

Another tool makes generation of GWT clients easier. It’s the GWT Designer from Instantiations. I’m having a few problems with it, but it still helps a lot. See the following screenshot for an impression:

Eclipse screenshot with GWT Designer

If you’re interested in this example built with GWT, ANTLR, JSON, etc., and you want to look at the source code, just download it from here.

Do you remember the little problem from the Geometry for kids post earlier today? With the calculator, you can verify if the solution is correct: d = sqrt(3)*5.3.

Update 1: As of GWT 1.4, a new application-loading mechanism has been introduced, that doesn’t require a meta tag in the page header. It’s still supported for legacy applications. But now, the applications HTML code can directly reference the JavaScript file. I’ve changed the example above accordingly.

Update 2: The calculator has been updated to GWT 2.0. The project available for download has been updated as well.

5 comments… add one
  • If you are having any issues with GWT Designer, please send a message to wb-support@instantiations.com. Include a test case and screenshots as appropriate. If you encounter any exceptions, also include your Eclipse “.log” file.

  • Hi, I am interested in such a topic.

    We known that we can use XXXLexer.java and XXXParser.java generated by ANTLR to perform calculations on the server, but can we use the GWT compiler to compile XXXLexer.java and XXXParser.java to JavaScript? Can we import XXXLexer.java and XXXParser.java into our GWT based project?

  • Ron van Liempd Link Reply
  • Sam Link Reply

    Works, but way too slow to do hundreds or thousands of computations per second ie. if you were to calculate sin(x) where x goes from 0 to 4 in 0.01 increments. Is it slow in the computation but just in the GUI I/O?

  • When you do the 401 computations as mentioned in your post, most of the time is spent for client/server communication. To prove it, just enter “sin(0) + sin(0.01) + … + sin(4)” with the 401 sin()-terms, and you’ll get the answer (164.98458280005968) in an instant.

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.