Learning from Leonardo
Volume Number: 15
Issue Number: 10
Column Tag: Programming Techniques
by Joseph J. Strout, La Jolla, CA
Visualizing and understanding algorithms forward and
backward
Though many readers of this magazine will have forgotten, programming does not come
naturally to the human mind. New programmers struggle with burdens at several
different levels: learning the syntax of a language, comprehending the step-by-step
flow of program code, and grasping abstract algorithms. It's especially hard to learn
these skills from a book or chalkboard; we understand better when we see things in
action.
A source-level debugger can let a student step through a program, which helps clarify
how the computer is interpreting the code. It doesn't help much with following complex
algorithms at a more abstract level, though. In addition, a traditional debugger can
only step forward; it's like a VCR with no rewind button. This means that if you miss a
step or want to see a computation again, you have to restart the program from the
beginning. This is where Leonardo comes in.
What Leonardo Does
Leonardo is a C development environment made specifically for teaching and learning.
It provides two major improvements over a traditional IDE. First, it provides a
mechanism for visualizing computations graphically as they happen; by attaching
graphical representations to key variables in a program, it's relatively easy to get a
high-level understanding of what the algorithm is doing. Second - and this is the one
that really amazes me - its source-level debugger runs both forwards and backwards!
In addition to the usual step forward, step down (into a function), step up (out of the
function), and run, the Leonardo control panel has buttons to step backwards, step
back out of a function, step back into a function, run backwards, and reset the process.
Code written with Leonardo is completely reversible. Variable assignments will be
undone, output sent to the console will disappear, graphics drawn will be undrawn, and
so on. You have access to the full set standard ANSI functions, and yes, those are
reversible too. The number of program steps you can undo is limited by available
memory, but in practice, this did not seem to be a serious limitation.
Leonardo does this magic by running your code on a "Virtual CPU" that not only
provides reversible execution, but also catches memory errors, invalid parameters to
standard function calls, leaks, and so on. You can't produce stand-alone applications
with Leonardo, and programs written in it run much slower than they would as native
Mac applications. But for illustrating programming concepts, or even debugging a
complex algorithm, Leonardo's graphical state display and reversible execution are
hard to beat.
Using Leonardo
Leonardo ships as a PowerPC application plus standard C headers and libraries. It also
comes with a large and neatly organized set of ready-to-run samples.
To get a feel for Leonardo's animation capabilities, simply launch the program and pick
any of the samples from the Program hierarchical menu. Most of these illustrate
common data structures and algorithms, like a sorted heap or the mini-max
game-playing algorithm, but the collection also includes a few games and utilities.
Choosing an item will run the corresponding program, which comes already compiled.
Most programs present both a text console interface, and one or more graphical
displays to give you a peek at what's going on inside. See Figure 1 for a typical example
(from the "RedBlackTrees" sample).
Figure 1.A Leonardo text console and graphics window.
As a consequence of running the already-compiled executable, you have only a limited
control palette and no access to the source code. This is fine for observing the graphical
illustration of an algorithm, but to dig any deeper, you'll want a full set of controls.
For that, use the Open C Project menu command, or simply double-click one of the
project files in the finder (they all end in ".ยต" like the old Metrowerks convention).
This presents a project window similar to that in other IDEs; it lists the files in the
project, and has buttons for running, setting project options, and so on (see Figure 2).
The first thing you'll want to do is open the project settings window, by clicking the
rightmost button. Project settings in Leonardo are mercifully simple; it's just a
matter of setting a couple of memory partitions, and toggling four build options on or
off. I recommend you turn all four on - in the pre-built projects, "Debug Mode" is
turned off, which is why access to the code was so limited before.
Figure 2.Leonardo's project window (top) and project settings dialog.
With debug mode turned on, running the project presents a full debug console (Figure
3) as well as a source-code display. This will be familiar to anyone used to other
source-level debuggers; you can step through your code in various step sizes (e.g.,
step down into a function, or run until the current function returns). The surprising
controls are the buttons at lower left, which allow you to roll a program backwards.
While delightful, the use of these buttons is staightforward and little more needs to be
said about them.
Figure 3.Leonardo's debug-mode process control panel.
The visualization commands are another matter. The graphical display that
accompanies most of the sample projects is created by embedded commands in the
source code, in a special declaration language called "Alpha." While you don't need to
understand Alpha to make good use of the sample projects, making your own graphical
displays will require a bit of study.
Speaking Alpha
Alpha commands are embedded in the C code within block comments. As such, they are
ignored by a C compiler, but can be interpreted by a special Alpha preprocessor. This
processor sets up graphical elements and inserts calls to update those elements when a
relevant variable changes value.
One starts by declaring a window for the graphical display. There can be multiple
windows, so each is given an ID number used to refer to it later, as follows:
/**
View(Out 1); // declare a window with ID 1
**/
This creates a window entitled "View 1" to appear, as soon as the code containing this
block is executed. If it is at global scope, the window will appear as soon as the
program runs, before entry into the main() function. When the code block containing
the above directive exits, the window will disappear. The Alpha preprocessor acts as if
it is converting these directives into C++ object declarations; they can occur
anywhere in a code block, and they disappear automatically when that code block is
finished.
A blank window is not very informative, so let's add a "Rectangle" declaration, based on
the width of a variable, like so:
// make a rect with ID=0, left=20, top=10,
// width=i, height=10 in view=1:
Rectangle(Out 0, Out 20, Out 10, Out H, Out 10, 1) Assign H=i;
The frequent (but not constant) repetition of the keyword "Out" before parameters, as
well as the need to use the "Assign" keyword rather than simply specifying "Out i" in
the correct position in the parameter list, are mysteries difficult to fathom without a
complete manual (see below). However, Leonardo comes with literally dozens of
examples of graphical displays using Alpha, so for most purposes you should be able to
find a similar example and adapt it to your specific needs. My example here (shown in
complete form in Listing 1) was adapted from an example given in the "Read Me
document, with reference to Appendix A of the manual, and was fairly easy to produce.
It displays the state of two variables with two different rectangles - a sort of dynamic
bar graph, continually updated as the program runs.
Listing 1.
int main(int argc,char* argv[])
/**
View(Out 1); // declare a window with ID 1
// make a rect with ID=0, left=20, top=10,
// width=i, height=10 in view=1:
Rectangle(Out 0, Out 20, Out 10, Out H, Out 10, 1) Assign H=i;
// make a similar one to track j
Rectangle(Out 0, Out 20, Out 25, Out H, Out 10, 1) Assign H=j;
**/
for (i=0; i<100; i++) {
j = (i*i) % 100;
}
}
Documentation & Support
Leonardo is written by two developers in Italy, and is distributed free of charge, so
commercial-level technical support is not to be expected. The chief support venue is
the Leonardo web site (see URL at the end of this article), which is clean and well
designed, and which (fortunately for most American users at least) is in well-written
English. It includes an overview; a number of images, including animations; a program
library; and an on-line manual. The manual is also included with the distribution.
Unfortunately, the manual is still "under construction" and stops just when it was
getting interesting. Only the first two chapters, "Installing Leonardo" and "Let's write
a C program" are present; the rest of the manual is outlined but not yet available.
Still, these two chapters are an excellent introduction to the system, and provide
enough to get you started. There is also an appendix which provides a brief reference
for all the Alpha predicates used to provide graphical output.
Sending email to the authors appears to be the only way to get interactive support. A
mailing list would have been nice for such a complex and powerful tool. Nonetheless,
when I sent some questions and suggestions to the authors, I received a helpful
response fairly quickly.
Despite the version number (3.4.1 at the time of this writing), Leonardo is clearly
not a finished product. The manual is mostly unwritten, and there are menu items
which are apparently not yet implemented. For example, the Preferences command is
present in the Edit menu but perpetually disabled.
Functionally, Leonardo measures up fairly well. Its most serious shortcoming is that,
surprisingly, there is no way to view or change the values of variables in the
debugger. That is unfortunate; graphical visualization is very helpful for getting the
big picture, but often one needs to inspect or tweak individual variables in order to
fully understand the code. The omission of this feature will leave some users having to
go back and forth between Leonardo and another IDE. In addition, it's not possible to set
or change breakpoints while the program is running; breakpoints can only be set by
adding a #pragma to the code and rebuilding. But these were the only functional
limitations found; overall it is quite solid.
The interface, on the other hand, has a few more problems. First, it frequently
displays black or red text against a thick marbled background, making it nearly
illegible. This is true even for the Windows-style bar at the bottom of the screen that
displays context-sensitive help - a poor substitute for balloon help. The windows have
a very annoying habit of expanding to fill the entire screen whenever you touch
anything, regardless of whether they have any actual data to display in all that space.
There are interface widgets on each document-style window which look like they may
be pop-up menus - and sometimes they are, but sometimes they aren't. Checkbox
items can't be toggled by clicking on their text, as is usual in the Mac interface, but
only by clicking on the box itself. Also in the "minor quibbles" category, the integrated
editor does not support the standard F1-F4 editing keys, and it'd be nice to be able to
change the font.
As a piece of software engineering, Leonardo is excellent; as an example of interface
design, it's somewhat lacking. Hopefully this will improve as the program matures. In
my email to the authors, I complained about some of the worst problems (such as the
marbled background), and was assured that future versions would correct at least
some of them. It's worth repeating that this is free software, and none of the
limitations mentioned above are very serious; overall the quality is superb.
Conclusion
Leonardo is a very remarkable application. While perhaps not as polished as a
commercial IDE, it is extremely well polished by the standards of free software, and it
was rock solid in my hands. The visualization provided by the Alpha predicates allow
one to watch an algorithm at work in a very powerful and intuitive way, and the ability
to step ordinary C code forward and backward is nothing short of amazing.
This application would be most useful in computer science and programming courses.
It comes with a large library of common data structures and algorithms right out of
the box, ready to illustrate their workings in animated color, and more could easily be
written from these examples. Any one of these could feature prominently in a class
lecture, and is likely to engage the students and foster comprehension much better than
abstract discussions or static diagrams. Since Leonardo is free, students can be
encouraged to download a copy and play with the programs on their own. When they do,
they'll find Leonardo's reversible execution to be an extremely helpful way to explore
any algorithm.
Leonardo's only real drawback is that, as yet, it is unfinished - a state especially
regrettable in the manual. The authors are doing this work with no financial support
from the users, so it's the users' responsibility to support them in other ways. Write
to them, let them know what you like and don't like, tell them how you're using it, and
ask if there is anything you can do to help. With the concern and support of a strong
user base, Leonardo is sure to become an indispensable tool for teaching, learning, and
debugging.
Useful URLs
The Leonardo home page:
http://www.dis.uniroma1.it/~demetres/Leonardo/
______________________________
Joe Strout works as a software developer in a neuroscience lab in southern
California. While not helping to unravel the secrets of the brain, he enjoys pursuits
ranging from martial arts to 3D modeling. He welcomes your comments at
joe@strout.net.