When enabling the halos in development mode, every component gets surrounded by a thin grey line and a header giving the class name of the component and a set of buttons to run tools and to change the viewing mode. The tools available trough the halo are extensible with plug-in architecture.
Below you see an interactive demonstration of the halo for the counter component:
The tools a halo provides from left to right are:
- Class Name (WACounter) displays the name of the current component. In Seaside all rendering is done by composable, reusable components.
- Class Browser opens an editor on the current component and lets the developer modify its class and all the methods from within the web, while the application is still running in the background. When closing the browser-view the application immediately runs with the new code without having to restart the session or the server.
- Object Inspector opens a view on the component, so that the developer can browse the internal structure of this object. It presents the names of the instance variables and the current values, whereas the user is able to dive into the referenced objects by clicking on the links.
- CSS Style Editor opens an editor that lets a UI designer tweak the associated CSS stylesheets. This makes it very convenient to try out different layouts directly in the web-browser without leaving the running application.
- Render View [R] renders the component normally.
- Source View [S] provides a pretty-printed and syntax-highlighted XHTML view onto the source code of the current component. Like this the developer is able to observe the generation of XHTML while still being able to interact with the application by clicking on its links.