The Startup Screen

Boring and uneventful. Informative yet still boring. Once you start typing code, the display area gets replaced with your code output. To the right is the MySQL tree browser listing databases, tables, and fields.

Typing and code execution

As you start typing, code is sent via ajax, executed on the server, and output returned.  While this sequence doesn't show it, errors are visible as well.  This pointless demo shows a character set fingerprint.

A more useful example

Welcome to your worst nightmare: unformatted data.  Thankfully, a Swiss Army knife exists for this sort of thing and its name is 'regular expression'.  Imagine developing a regular expression and watching it unfold as you type.  Garbage in, garbage out - except - you get to see the output and thus can make adjustments.

(This regexp snippet produced by Steve Mekosh)

Pretty colors

A slightly busier screen

Feature: code indentation

I like to keep things simple: in this particular case that means using a textarea for code editing.  Problem is, those don't support the tab key.  After adding that tiny feature, I figured: why not make it adjust indentations as well?  So here is tab and shift+tab in a textarea:

Feature: dojo, dijit, soria theme (images + CSS) packed into a single file:

As a added benefit, dojo functions are now available to you - for both development and debugging. For example, you can bring up firebug and execute something like console.dir( dojo.byId('my_div') );

All dependent files are packed inside eval2.php - that's Dojo toolkit, parts of Dijit, CSS, and graphics.  The graphics are binary-encoded inside the file and are for example, referenced as eval2c.php?file=4aca9fae022.png (latest version uses MD5 hashes of the files..)