TraceyText’s home page is http://traceytext.sourceforge.net

TraceyText is an HTML-based teaching tool for visualizing single-stepping through source code. TraceyText can also double as a text/HTML slideshow library implemented in JavaScript. With TraceyText’s features, you can create web pages with a text or HTML slideshow and TraceyText will minimize the file size. TraceyText can also combine multiple “views” in the same slideshow to adjust in sync with each other.

The best way to see it in action are the source stepping demo and the picture slideshow demo. The demo runs through the Dragon Realm game from my book that teaches Python programming. You can either create these web pages with TraceyText by hand, or use the included TraceyText Python script to create a source file that generates the web page.

TraceyText is a useful tool for visualizing source code debugging or any presentation with HTML content. TraceyText has an API which opens itself to user-created JavaScript as well. TraceyText’s name comes from its original purpose as a way to demonstrate debugging traces through source code.

I created this tool as a way to demonstrate how programs run line by line, and what it outputs and the state of the varaibles. Simple text was way too verbose, and video would have taken too much bandwidth. In addition, TraceyText makes for a very nice and simple HTML slideshow.

On the downside, this is a tool mostly for programmers who know JavaScript. I’ll put together a user-friendly authoring tool later if there is interest.