Changing GUI Application Appearance and Functionality

2 Changing GUI Application Appearance and Functionality

This chapter describes how to change the appearance and functionality of Oracle Communications Order and Service Management (OSM) GUI applications.

About Configuring the User Experience

OSM supports the customization of the information presented to and collected from web client users to match a wide variety of user roles and tasks. This makes it easy to customize the user experience for edits and data validation without having to code Java Server Pages (JSPs).

The web client user experience can be customized in various ways:

Adding default values and calculating values from different fields on the order
Viewing and selecting data dynamically from a source outside of OSM
Adding fonts, colors, and other formatting; adding conditional formatting
Organizing order data in tables and tabs
Adding your own custom HTML-based online help (with hyperlinks) and tool tips for your users
Presenting data in one or more presentation languages
Enforcing formats of input data, required fields and so on
Hiding and showing fields relative to other fields
Adding check boxes and radio buttons
Conditionally making fields read-only or read-write
Provide custom information, warning, and error messages to the user to help them

About Behaviors

Behaviors provide the mechanism to exercise greater control over validation and presentation of order data to Task, and Order Management web client users. (In earlier versions of OSM, this capability was called the View Framework.) Behaviors are used mainly in the context of manual tasks that you manage with the Task web client.

There are nine behavior types that enable you to dynamically control a specific aspect of the order data model. (You can also add new behavior types using Oracle Communications Design Studio). The included behavior types are:

Calculation: Computes the value of a field value based on a formula that references order data.
Constraint: Specifies a condition that must be met for the data to be considered valid.
Data Instance: Declares an instance that can be used by other behaviors.
Event: Specifies an action that is performed when data is modified.
Information: Specifies the label, hint, and help information for the element instance.
Lookup: Specifies a set of dynamically generated choices from which you can select.
Read Only: Dynamically determines whether a value can be modified or not.
Relevant: Dynamically determines whether data is visible or hidden.
Style: Specifies the visual appearance of fields.

Behaviors can be created only for manual tasks. They can be created at the data element level (most general), order level (more specific), or task level (most specific). After the behavior is created in Design Studio, you can model the actions you want it to perform through its properties settings.

See OSM Developer's Guide and Design Studio Modeling OSM Processes for more information about behaviors.

You can use Design Studio to define additional behaviors.

Changing Web Client Appearance and Functionality

You can change the behavior of the Order Management web client and Task web client in several ways.

Changing the Default Timeout Setting

To change the default timeout setting:

Unpack the oms.ear file. See OSM Developer's Guide for more information.
Open the SDK/Customization/osmwebui/WEB-INF/web.xml file.
Search for the following parameter:
```
session-timeout
```
Change the value of the session-timeout parameter to your desired value (in minutes).
Save and close the file.
Repack oms.ear. See OSM Developer's Guide for more information.
Add the oms.ear file to the OSM container image. See "Creating OSM Cloud Native Images" in OSM Cloud Native Deployment Guide.

Note:

Changing the session-timeout parameter changes the automatic timeout for both the Order Management web client and the Task web client.

Setting Table Height

You can specify a fixed or variable table height, depending on the value of the is_tablelayout_height_fixed parameter in the oms-config.xml file. You can set the value of is_tablelayout_height_fixed to True or to False. If is_tablelayout_height_fixed is set to True, you can also set the height_of_tablelayout parameter to specify the fixed height for tables.

The default value of is_tablelayout_height_fixed is True.

Using fixed table heights can create excessive white space in and between tables. Setting is_tablelayout_height_fixed to False causes table height to be solely determined by the number of rows in the table and can help eliminate white space.

To set the table height:

Update the oms-config parameters through the specification files. See "Working with oms-config Parameters in OSM Cloud Native" for more information.
Set the desired value for the is_tablelayout_height_fixed parameter by doing one of the following:
- To set the table height to fixed, set is_tablelayout_height_fixed to True.
  
  You may desire a fixed height that is different from the default. If so, change the fixed height of all tables.
  
  To change the fixed height of all tables, set the height_of_tablelayout parameter to the desired value in pixels. The default is 400 pixels.
- To set the table height to variable, set is_tablelayout_height_fixed to False.
  
  Table height will now vary for each table, depending on the number of rows in the table.

Configuring the Data View Performance in the Order Management Web Client

You can change the performance of the data view in the Order Management web client using the osm-config parameters.

To set the data view performance parameters:

Update the oms-config parameters through the specification files. See "Working with oms-config Parameters in OSM Cloud Native" for more information.
To set the database fetch limit, which sets a limit to the number of rows that can be requested at one time, set the jdbc_fetch_size parameter to the desired number of rows.
To set the limit for the number of instances a multi-instance data element may have before its display is forced into table format, set the oracle.communications.ordermanagement.table-layout.threshold parameter to the desired maximum number of instances.

Configuring the Display Size of Text Fields

You can control the size of the displayed area for text fields, and whether text fields will have scroll bars, using the no_of_rows_in_textarea_without_scroll and max_no_of_rows_in_textarea_with_scroll parameters in the oms-config.xml file.

The no_of_rows_in_textarea_without_scroll parameter indicates the maximum number of rows that the field can accommodate without a scroll bar.

The max_no_of_rows_in_textarea_with_scroll parameter indicates the maximum number of rows that the field can accommodate if the number of rows exceeds the value of the no_of_rows_in_textarea_without_scroll parameter.

However, the scroll bar disappears and the field displays all the rows, if their number exceeds the value of the max_no_of_rows_in_textarea_with_scroll parameter.

For example:

If the value of no_of_rows_in_textarea_without_scroll is greater than the value of max_no_of_rows_in_textarea_with_scroll, and the number of rows is less than or equal to the value of no_of_rows_in_textarea_without_scroll, the field displays all the rows without a scroll bar.
If the value of no_of_rows_in_textarea_without_scroll is greater than the value of max_no_of_rows_in_textarea_with_scroll, and the number of rows is greater than the value of no_of_rows_in_textarea_without_scroll, the field displays in its text area, rows whose number equals the value of the no_of_rows_in_textarea_without_scroll parameter. However, the field accommodates all the other rows and provides a scroll bar.
If the value of no_of_rows_in_textarea_without_scroll is less than the value of max_no_of_rows_in_textarea_with_scroll, and the number of rows is less than or equal to the value of max_no_of_rows_in_textarea_with_scroll, the field accommodates all the rows and provides a scroll bar.
If the value of no_of_rows_in_textarea_without_scroll is less than the value of max_no_of_rows_in_textarea_with_scroll, and the number of rows is greater than the value of max_no_of_rows_in_textarea_with_scroll, the field displays all the rows in its text area. In this case, the scroll bar is not displayed.

Setting Default Action on Orders and Tasks in the Task Web Client

You can specify a particular action as the default action to perform on orders and tasks in the Worklist and Query screens for all users who have not set the default action in the Options page of the Task web client. You can achieve this by configuring a parameter in the oms-config.xml file. However, users can change the global default action configured by the administrator to an action of their choice by setting the Default Action field in the Options page. By default, the global default action parameter is not set to any action and the application considers the option set by individual users as the default action to perform.

To set a default action on orders and tasks for all users:

Update the oms-config parameters through the specification files. See "Working with oms-config Parameters in OSM Cloud Native" for more information.
Set the DefaultUserAction parameter to the desired action.

Valid values (actions) that you can specify are:
- NoGlobalDefault (This is the default if no action is set.)
- AcceptEditTask
- AddRemark
- RaiseException
- ViewOrderData
- ViewOrderProcessHistory
- ViewNotificationHistory
- CopyOrder
If no action is set for the parameter, the application considers the option (action) that is set by individual users in the Default Action field in the Options screen.

Customizing the Appearance of Read-Only Text Fields

You can customize the appearance of the text (field labels). You can change the font style, size, color, and background color. You can customize specific text or all text across the pages.

You can customize specific text in the pages by using VF Style Rules. With VF Style Rules, you can modify the CSS properties (font style, color, and background) for any specific field. When you define a VF style rule for a particular read-only field, only that particular field is customized.

To customize all read-only text:

Unpack the oms.ear file.
Open the SDK/Customization/oms-war/customScreen.css file.
Add the oeValueNodeReadOnly parameter and specify the properties as shown below:
```
.oeValueNodeReadOnly {
FONT-SIZE: 10pt;
color:blue;
}
```
Run PackOMS to generate the new oms.ear file.
Add the oms.ear to the OSM container image. See "Creating a Basic OSM Cloud Native Instance" in OSM Cloud Native Deployment Guide for more details.

You can also customize the appearance of read-only fields by using reusable class definitions. With reusable class definitions, you can apply some properties to some text and a different set of properties to the other text fields. For example, you can apply a 10pt font size and blue color to some fields, and a 14pt font style and red color to the other fields.

To customize text fields by using reusable class definitions:

Create a list of CSS classes. Specify all the properties for each class as shown below and add the classes to the customScreen.css file.
```
.customReadOnlyValueBlue {
FONT-SIZE: 10pt;
color:blue;
}
 
.customReadOnlyValueRed {
FONT-SIZE: 14pt;
color:red;
}
```
In Design Studio, add the Style behavior for the read-only fields that you want to customize:

For example:
- For the fields that you want to apply blue, add customReadOnlyValueBlue in the CSS Class Name field of the Value grouping.
- For the fields that you want to apply red, add customReadOnlyValueRed in the CSS Class Name field of the Value grouping.
Update the oms.ear file with the modified customScreen.css file.
Deploy the modified cartridges.
Add the oms.ear file to the OSM container image. See "Creating a Basic OSM Cloud Native Instance" in OSM Cloud Native Deployment Guide for more details.