Workplace Area consists of three major components, Tab, Column and Row. Workplace Area is based on dom structure. As every user has a unique Workplace layout, the dom structure is differential among users. The Tab element takes the Column element as child element, and the Column element takes the Row element as child element. Tab, Column and Row are organized in a tree structure, as the structure of the XML dom element defined in XML file.
The following is the Workplace area layout for an end user, corresponding to the XML dom structure which is defined for him.
<Tab id="BTT_Tab2" logo="theme/tablogo/1.gif" title="user_tab1"> <Column id="BTT_Tab1_Col1" width="90%"> <Row id="tab1_col1_row1" title="basic_service" /> </Column> </Tab>
BTT Workplace Area has two kinds of elements. One is called manageable element, and the other is called customizable element. Manageable element is static HTML page style, which is designed by bank developers and cannot be customized by the end-users. Customizable elements are the elements that can be customized by end-users, including adding, editing or other operation on these elements.
BTT Workplace Area adopts the MVC pattern. The user interacts with the view component on the page, which triggers the control function whose responsible is to get or set the models like the following picture. So the models are all defined in XML format, which enables the layout style can be changed into other display style. By default, the layout is displayed with the predefined components as shown in the above images, but bank developers can change the display style into other framework, such as Dojo or Ext, using whose page components to display the elements, without the model and abstract logic class being changed.