RADE Web Application Composer

Web Application Editor

Web Application Builder Editor


Getting Familiar with the Web Application Editor
Technical Article

Abstract

This article describes the Web Application editor.


[Top]

The WebApplication builder allows you to create and edit a Web Application in a dedicated editor in IRAD. To access this editor, you need to create a web project. To do so:

  1. From the Start->Programs menu, access the IBM Rational->IBM Rational Application Developer v7.0->Rational Application Developer application.
  2. In the Workspace Launcher window, click Browse... to select the directory that will contain the data. Click OK. The application opens.
  3. From the File menu, select New, then Project.
  4. In the New Project window, click Web then Dynamic Web Project and click Next>.
  5. In the Name field, enter the project name and click Finish. A dialog box is displayed asking you if you want to switch to the Web Perspective. Click Yes. To know more, see Creating Your First Web Application.

Working with the Web Application Editor Views

The editor provides you with different views that can be accessed from the Window->Show View menu. 3 views prove useful when using the WAC application.

The last 2 views have been customized to allow you to manipulate your Web Application.

Project Navigator View

The Project Navigator View shows the web project as well as the source directories that can be built.
  • The symbol indicates that the directory can be built.
  • The symbol indicates a build error.

Properties View

The Properties view shows the list of properties of the widget currently selected in the Layout or the Outline views or in the Behavior tab page. Properties values can be modified from this view.
Another way to display/change property value is to open the Properties window by clicking the Properties item in the contextual menu from the Layout or from the Outline view, or by double-clicking the selected item.

Outline View

The Outline view shows the layout content in a hierarchical tree view. Some widgets are containers and include other widgets (i.e. Frame, TabPage, WebPartFrame, Wizard). Only published widgets appear in the Outline view.

If you have read/write access rights on the edited XMLDlg file, the contextual menu is available in the Outline view. It enables you to publish, delete or edit the widget properties in a properties window. The Outline view also shows you the defined Behaviors to be triggered on Pages/widgets events. Standard Cut/Copy/Paste items are also available, associated to the Undo/Redo possibility.

 

Working with the Tabs

The E-Application is made up of 3 tab pages:

Layout Tab Page

The Layout tab page allows you to define your GUI pages and drop widgets onto the page. Widgets are inserted in this view and their position is defined. Widgets can be moved through drag and drop mechanism. The bounding box of the widgets is modified by stretching the widgets over many columns. By selecting columns or rows they can be made resizable. For more details on all these points concerning page setup, see Working with DialogBuilder. On all the widgets in this page, a contextual menu is also available. With this contextual menu you can insert widgets inside the selected widget (provided it is a container), delete the widget from the window or edit its properties in a properties window. Standard Cut/Copy/Paste items are also available, associated to the Undo/Redo possibility. It displays at a given time one page of your E-Application ( one XMLDlg File). To navigate through the different pages, you can use the 'Next' and 'Previous' buttons or use the Outline view and select the page to be displayed.

When this tab page is active, a dedicated Dialog toolbar is available. The functionalities of this tab page are described in the Dialog Builder documentation. ( An Overview of the Dialog Builder can be found here).

Mappings Tab Page

The Mappings tab page allows you to define data mapping between the different data sources (widgets, Session Data, Web Methods, custom-written java code ) as described in the data flow defined in the various "Behaviors".

Behaviors Tab Page

If they exist, the other tab pages define a Behavior that the user has associated with the GUI events. There is a set of Behaviors per XMLDlg file composing your E-Application. The number of Behavior tab pages depends on the active XMLDlg file displayed in the Layout tab Page. In these tab pages, you define a Data Flow between widgets, Web Methods, Session Data and custom-written java code to be launched when a widget event occurs. A single behavior can be associated with several different events.

Note that when this tab page is active, a dedicated Behavior toolbar is available. It allows you to move objects, add widget reference, define Data Link, create a Session Data, add custom-written java code, or delete any object on the graphical behavior.

[Top]

Using the Menu Bar, the Contextual Menus and the Toolbar

All available widgets are available from the toolbar. You will find first the basic JDialog widgets, and then the custom widgets if XMLWidget files have been found in either the current workspace's runtimeview or in the prerequisite workspaces' runtimeview. To insert a widget in the layout, simply select its icon from the toolbar. By default, the widget is inserted in the first empty cell found in the layout. If there are no empty cells, a new row will be created at the bottom of the layout.

The toolbar also contains a combo box with all available themes. All themes found in the runtimeview are available from the combo box list. Remember that: XMLTheme files are in resources\stylesheets directories of the runtimeview.

Insert Menu

All available widgets are available from the toolbar. You can find the basic widgets, and then the custom widgets required if XMLWidget files have been found in the current workspace runtime view or in the prerequisite workspaces runtime view. To insert a widget in the layout, see Inserting Widgets.

A toolbar enabling to insert widgets also contains a combo box with all available themes. All themes found in the runtime view are available from the combo box list.

XMLTheme files are in resources\stylesheets directories of the runtime view.

 

Navigator View Contextual Menu

Note that the commands described below are available from the Navigator View only.

 
For... See...
Run on Server... Creating Your First Web Application
Convert to WAC project Creating Your First Web Application
Set Current CAAV5 Workspace If several projects have been opened as CAAV5 workspaces, use this command to swap projects.
Open CAAV5 Workspace Open an existing project as a CAAV5 workspace.
New CAAV5-SCM Workspace Create a new IRAD java project and declare it as a new CAAV5 workspace.

Outline View Contextual Menu

  For... See...
Add New Process Creating a process
Add ActionClick Creating an ActionClick in the current page
Add a dialog page Adding a new page before or after the current page
Reset publish Unpublishes the widget (which is not removed from the layout)
Delete Deleting a Process, Deleting a Page, Deleting a Published Widget,
Properties Setting properties

Behavior Tab Menu

  For... See...
   
Create Link Create Data links between the output and the input plugs of the entities.
Helper Helpers creates a new helper in the current behavior.
User Action Actions creates a new user action in the current behavior.
Session Data Session Data creates a new session data in the current behavior.
Input Parameter Input Parameter creates a new input parameter in the current behavior.
Output Parameter Output Parameter creates a new output parameter in the current behavior.
Add Widget Inserting Widgets which provides you with the list of all the published widgets. If you want to use one of theses widgets, select it from the list and click the behavior sheet to insert it into the editor.
Add Session Data If you want to use one of theses session data, select it from the list and click the behavior sheet to insert it into the editor. Session Data are created using Create Component->Session Data.

[Top]


References

[1] JDialog Documentation Home Page
[2] JDialog Overview
[3] Creating Your First Web Application
[4] WAC Troubleshooting
[Top]

History

Version: 1.30 [July 2005]

Document created


Copyright © 1994-2006, Dassault Systèmes. All rights reserved.