Knowing a little of how the Genero Browser Client (GBC) uses AUI tree, controllers and widgets to create and manage UI elements will help you on your way to building a customized UI interface.

The GBC Web client interface is built dynamically using JavaScript. When the GBC is launched, it receives an AUI tree from the GAS. Effectively each node of the AUI tree is managed by a GBC controller and widget.

The GBC uses its controller and widget elements to create the HTML DOM. Through DOM elements, JavaScript is able to dynamically implement the elements of the HTML pages of the UI by responding to changes to their properties and listening for events that change their behavior. (For more details about widgets, see Widgets.)

GBC Controller

The GBC controller and widget elements are interdependent but have specific and distinct roles. The JavaScript controller (_Controller.js) plays a role in:

• Creating the widget.
• Maintaining its behaviors.

Behaviors involve mapping one or more attributes of the AUI tree to an aspect of the widget. For example, the color and reverse attributes control a widget's background color. To reflect the two-way interaction between the Web client and the application, there are two types of behavior that a controller needs to maintain:

• VM behavior: the controller is listening to the DVM and applying the changes received from DVM instructions.
• UI behavior: the controller is also listening to the UI and sending UI modification to the DVM.

Note: These built-in behaviors are internal and not meant to be modified by users.

GBC Widget

The JavaScript widget (_Widget.js) plays a role in updating the DOM tree to reflect the application state. It has:

• APIs to manipulate the DOM.
• Listeners to react to DOM events.