Whisker: The O-O Stacking Browser


Whisker is an object-oriented (O-O) code browser for the Squeak Smalltalk environment.

The goal of the Whisker Browser is to provide a simple and intuitive way to view the contents of multiple classes and multiple methods simultaneously, while using screen real estate efficiently and not requiring a lot of window moving/resizing. It does this by introducing the concept of subpane stacking. The principles behind Whisker could potentially be used by browsers for other object-oriented languages (Java, Python, etc.).

(Squeak is a free, ultra-portable, powerful open-source programming and multimedia environment, which is available for Windows, Macintosh, Linux, Unix, BeOS, OS/2, several PDA's, and other platforms. For more information on Squeak and Smalltalk, see http://www.squeak.org.)

Whisker encourages better code factoring by letting you see the complete contents of several short methods at one time. The current Smalltalk System Browser only lets you view a single method at a time, which can subtly discourage the practice of writing short (well-factored) methods, since you can only see a small portion of the code. It is true that you can have multiple browser windows open to compensate, which is currently a necessity for most Smalltalkers. But this becomes cumbersome and results in a lot of duplicate information taking up space on the screen, especially if you're viewing a few methods within the same class. Additionally, the method text pane of a System Browser still takes up a fair amount of screen space, even if you happen to be viewing a 2-line method... optimizing screen space with multiple System Browsers can involve a lot of window/pane moving and resizing.

With Whisker, a single Whisker Browser is the only code browser that you need to have open at one time. The only other windows you might need to have open would be non-browsers such as workspaces, file lists, change lists, etc. (Of course, some of these other windows could potentially be incorporated into Whisker's layout... Senders/Implementors lists, for example.)

Whisker has the concept of a "class pane", which tries to summarize *everything* that makes up a particular class, without hiding anything at a given time. This can be useful in helping OO/Smalltalk beginners grasp the concept of what makes up a class.




This is a Whisker screenshot which has a layout with the class categories and object hierarchy on the left, a column (stack) of classes in the middle, and a column of methods on the right. (Colors in this screenshot may be inaccurate unless you're viewing with at least 16 bit color depth.)

Another way of describing the layout is to think of the middle column as the "class summary" column, and the right column as the "class detail" column. This description is probably more accurate, given that the right column can contain details of a class (aside from methods) such as the class comment.

An important point is that all of the hierarchical list panes have multi-selection capability. When the browser is first opened, only the class categories and object hierarchy appears. When the class "OrderedCollection" is selected in one of these panes (as in the screenshot above), that class pane then appears in the middle column. When "Dictionary" is selected, that class pane also appears in the middle column, below the OrderedCollection class pane (keeping the same vertical order from the hierarchy). Both items are now selected in the hierarchy. If Dictionary is clicked on again, it will be unhighlighted, and the Dictionary class pane will dissappear.

The same multi-selection behavior is true for selecting methods in the class panes. As you can see in the above picture, there are six currently selected methods/comments in the various class panes, and so six method text panes appear on the right. Note that each method text pane is automatically sized to the actual height of the method text. As vertical space runs out, the taller method text panes are truncated first.

There are several configurable options with Whisker. To see them, select "properties" from the pop-up menu. For example, the method subpane titlebars are optional. (Removing them from the method text subpanes saves a fair amount of screen space.) The class panes appear in random (muted) colors, and the corresponding method text panes for each class appear in a matching color, to provide an extra visual cue linking the class with its method panes. (This option can also be turned on or off.)

Another thing that could eventually be configurable would be the contents of the class panes. In these examples they contain expandable lists of methods and variables, basically everything which makes up a class definition. But, there are several different ways that someone might want his or her classes to appear... maybe without method categories, or with the methods already expanded, or with separate sub-panes for methods vs. variables, or with separate class side vs. instance side sub-panes, etc. Note in the screenshot that the Instance Variables list provides a handy UI for type inference information. Ideally, the "Definition" item in the class pane could be phased out, if its information is stored elsewhere in the class pane.

Future enhancements for the Whisker Browser will include: Integrated UI support for the Refactoring Browser core engine, an improved hierarchy widget with support for "partial hierarchies", close/minimize/maximize buttons on individual pane titlebars, integrated support for inspecting/exploring object instances, etc.



Download Whisker

The best way to install Whisker is from within Squeak, via the SqueakMap tool. The SqueakMap entry lists the latest version of Whisker, and which versions of Squeak it is compatible with.

For details, see the Release Notes in the SqueakMap Whisker entry.

Older versions of Whisker can be found in this directory.

A tutorial called "A Quick Tour of Whisker" was written for the CD-ROM of the book Squeak: Open Personal Computing and Multimedia. If you want to try the tutorial, here it is: A Quick Tour of Whisker.



Questions/comments? Email me at dway at mail can dot com. - Doug Way


One of the tricks here is to get away from thinking that programs have to be composed with only a simple text editor. --Alan Kay