Chapter 1. Certification overview
5.5 Customer customization
5
5.1 Custom page and layout
IBM Tivoli Business Service Manager provides the means for any user with enough rights to create a custom page using customer specified layouts and viewpoints.
To create a custom page and layout, perform the following steps:
1. Log in to the IBM Tivoli Business Service Manager GUI as an admin user.
2. Switch to the Administration window shown in Figure 5-1.
Figure 5-1 Administration window
3. Switch to the Layout tab, as shown in Figure 5-2.
Figure 5-2 Layout tab
4. Click the Add button to show the Add Page window. Enter the settings shown in Figure 5-3:
– Page name and page title.
– Category name and value: User, group, or role that would be using the custom page.
– Source template.
Click Add.
Figure 5-3 Complete new page
5. Now that the page has been created, edit the page from the designated view, as shown in Figure 5-4. Click the pencil icon.
Figure 5-4 Page list
6. The edit page window opens, as shown in Figure 5-5.
Figure 5-5 Edit custom page
7. Select the page layout, as shown in Figure 5-6. The numbers beside the number of columns determines the percentage of width for each columns.
Figure 5-6 Layout options
8. Select the Security ID, which determines the access level required to use this page, as shown in Figure 5-7.
Figure 5-7 Security ID options
9. Add a designated viewpoint, pane, or view. The viewpoint selection is shown in Figure 5-8. You can select from the following elements:
– IBM Tivoli Netcool/OMNIbus based view points.
Active Event List IBM Tivoli Netcool/OMNIbus events in Active Event List
Lightweight Event List
IBM Tivoli Netcool/OMNIbus events in Lightweight Event List
– IBM Tivoli Netcool/Webtop based view points.
ChartView A chart view
TableView Table view
MapView GIS based view of Service Instances Version Information Product version information
Iframe Example Internal frame view
– IBM Tivoli Business Service Manager view points. The service instances are displayed with the standard canvas icon, including the SLA
information.
Service Details Detailed service information Service Tree Service tree
Service Viewer Service viewer
Urgent Service Listing of urgent service
Figure 5-8 Add Viewpoint
10.Organize viewpoints as specified by the template, as shown in Figure 5-9.
Figure 5-9 Modify layout
11.Select a decoration for each of the viewpoints as specified by the template, as shown in Figure 5-10.
Figure 5-10 Decoration options
12.Save the page by clicking Save and Apply. The resulting page is shown in Figure 5-11 on page 125.
Figure 5-11 Custom page result
Viewpoints can be customized by performing the following steps:
1. Log in to IBM Tivoli Business Service Manager as an admin user.
2. Switch to the Administration page and select the Layout tab. Click the Viewpoints link and the window shown in Figure 5-12 opens.
Figure 5-12 Customize viewpoint
3. Click the pencil icon to modify the viewpoint. In this example, we modify the Service Viewer viewpoint. The edited viewpoint is shown in Figure 5-13.
Figure 5-13 Viewpoint setting
4. In Figure 5-13, the mandatory entries are the viewpoint name and the Source field. The Source field represents the JSP™ file that is used to render the viewpoint. The following JSP files can be used:
– /sla/rad/standalone_serviceviewer.jsp: Shows just the View tab.
– /sla/rad/servicestatusview.jsp: Shows both the View and Edit tabs.
Both JSPs accept a starting service instance as an argument in these formats:
– /sla/rad/<jspname>?ServiceInstanceID=<ServiceID>
– /sla/rad/<jspname>?ServiceInstanceName=<ServiceName>
5.2 Custom canvas
The custom canvas defines the way a service instance is displayed in the service viewer. The procedure here describes the creation of a custom canvas as the appropriate way to add and organize indicator icons and decorations and select the background color.
To create a custom canvas, perform the following steps:
1. Log in to IBM Tivoli Business Service Manager as an admin user and switch to the Service Administration window.
2. Define the custom canvas as follows:
– If the canvas should be tied to an instance, display the instance in the service viewer. Click the create canvas button ( ) from the service viewer.
– If the canvas should not be tied to an instance, from the navigation selection, select Custom Canvases, and click the Create Custom Canvas button shown in Figure 5-14.
Figure 5-14 Create custom canvas
3. In the canvas, choose and add the indicator icons from the list of indicator templates, as shown in Figure 5-15.
Figure 5-15 Custom canvas icons
Some valid indicator icons are:
– A speedometer gauge, which shows the value of a metric (such as the response time, number of open ticket, and so on).
– A Service Instance indicator, with multiple shapes that indicate the instance status.
– A number-element prototype that allows a display of three to six text-value pairs.
4. When adding indicator icons, specify an instance to show the customization.
Choose an instance from the window, click Next, and then set the text items and values for the indicator icon, as shown in Figure 5-16. Click Finish when done.
Figure 5-16 Instance chooser for canvas
5. Click the Decoration tab to add additional decorations for the canvas, as shown in Figure 5-17. The available decorations are:
Text labels You can customize the alignment, content, and color.
Images You can choose the image file path.
Shape You can change the colors and shape. The available shapes are: Rectangle, RoundRectangle, Ellipse, TriangleUp, TriangleDown, TriangleLeft, TriangleRight, Diamond.
Lines You can change the color.
Figure 5-17 Decorations
6. To change a property of an object (decoration or indicator), select the object and select View→ Inspector. The inspector window is shown in Figure 5-18 on page 131.
Figure 5-18 Inspector
7. Select the background color by selecting View→ Fill Background, and pick a color from the window, as shown in Figure 5-19.
Figure 5-19 Background colors
8. Save the canvas, as shown in Figure 5-20.
Figure 5-20 Save canvas
9. Your newly create canvas will now be available in the Custom Canvas tab, as shown in Figure 5-21.
Figure 5-21 Custom canvases
5.3 Setting the default viewer
There are two types of viewer for service instances: the full client and the thin client. The viewer selection is performed from the Viewer Preferences or from the
$NCHOME/etc/rad/RAD_av.props file. To update the preferences from a full client to a thin client, perform the following steps:
1. In the full client display, shown in Figure 5-22 on page 133, click the Viewer preferences button ( ).
Figure 5-22 Service viewer
2. The viewer preferences to set the client type are shown in Figure 5-23.
Figure 5-23 Viewer type settings
3. When you log in again, the service viewer is now a thin client, as shown in Figure 5-24.
Figure 5-24 Thin client
5.4 Tree template editor
The tree template editor allows you to change how the service instances navigation tree shows up in the desktop application of IBM Tivoli Business Service Manager. The tree template editor allows you to add or remove column attributes for a service instance to be shown in the service dashboard. The default service tree is shown in Figure 5-25 on page 135.
Figure 5-25 Service tree
The service tree template can be modified using the procedure below:
1. Open the Service Administration window, click the Services tab, open Service Navigation, and click the Tree Template Editor icon ( ), as shown in Figure 5-26.
Figure 5-26 Services Navigation
2. The service tree template editor is shown in Figure 5-27. Create a new tree template by clicking the + sign.
Figure 5-27 Tree template editor
3. Define the name of the new tree template, as shown in Figure 5-28.
Figure 5-28 New tree template
4. In Figure 5-27, select the newly defined tree template in order to perform the following actions:
– Add and remove columns.
– Assign the classes that you want to be included in this tree template.
– Define rule mapping for the template
5. You can add new columns to be defined in the column configuration area by clicking the + icon. To change the sizing for the columns to be displayed, check the Static Sizing For Tree Template check box, as shown in Figure 5-29.
Figure 5-29 Static size
a. Clicks OK to confirm your choice, as shown in Figure 5-30.
Figure 5-30 Sizing warning
You now have access to the Launch Column Sizing Tool, as shown in Figure 5-31.
Figure 5-31 Launch Column Sizing Tool
b. Click Launch Column Sizing Tool. The Adjust Column Width window appears, as shown in Figure 5-32. Change the column sizes as needed.
Figure 5-32 Column sizing
c. Click OK to confirm your changes.
6. Select the Service Templates to be used in this tree from the left pane and clicking the >> button, as shown in Figure 5-33. The templates selected here can be configured to supply values for the new additional columns.
Figure 5-33 Select templates
7. For each template, select a user defined metric/incoming status rule or system defined rule. Select the template from the active template, as shown in Figure 5-34 on page 139. Then map the attributes in the template to the column name drop-down list. Relate each Service Template attribute that is selected to a column on the tree.
Figure 5-34 Selecting metric
8. Edit the policy to customize what is displayed in the column, such as value being received, or a custom icon. The tree template columns are built using an IBM Tivoli Netcool/Impact policy rule. The rule can be edited by clicking the Edit Policy button shown in Figure 5-27 on page 136. The rule editing window is shown in Figure 5-35.
Figure 5-35 Editing tree template rule
The rule shown in Figure 5-35 on page 139 can be edited directly in the RAD_GetTreeColumnValue.ipl file under
$NCHOME/guifoundation/webapps/sla/policy.
9. Switch to the custom page where the custom service tree should be located.
Expand the frame menu in the top right corner of the viewpoint, as shown in Figure 5-36. Click the pencil icon.
Figure 5-36 Custom tree view
10.Edit the service tree viewpoint and select the new tree template that you created, as shown in Figure 5-37. Select the new tree template and the starting service instance from the service instance tree. Click DONE.
Figure 5-37 Select NewTreeTemplate
The tree template can include a defined starting service instance. Use the button from the service tree and select the starting instance from the window shown in Figure 5-38 on page 141.
Figure 5-38 Setting the starting instance
5.5 Customer customization
You can customize the IBM Tivoli Business Service Manager page header and viewpoint header, as well as the custom service tree icons, so that IBM Tivoli Business Service Manager displays the customer's header images and custom service tree icons. To do this task, perform the following steps:
1. Place all the custom background header images in the appropriate directory by copying the GIF or PNG files to
$NCHOME/guifoundation/webapps/desktop/images/ngf/. Make sure that the Netcool user can access the file.
2. Edit the background-image for the file
$NCHOME/guifoundation/webapps/desktop/css/ngf/ngf.css to point IBM Tivoli Business Service Manager to display new header images in the following sections:
– Change the background-image in the Table.netcool-topheader section, as shown in Example 5-1. This is the white-space fill image.
Example 5-1 Header image table.netcool-topheader { height: 49px;
background-image: url( ../../images/ngf/nc_header_resize.png );
}
– Change the background-image in the Td.netcool-topheader-left section, as shown in Example 5-2.
Example 5-2 Left header image td.netcool-topheader-left {
background-image: url( ../../images/ngf/nc_header_left.png );
background-repeat: no-repeat;
background-position: left top;
}
Figure 5-39 shows the image in the top left of the banner.
Figure 5-39 Tivoli logo
– Change the background-image in the Td.netcool-topheader-right section, as shown in Example 5-3.
Example 5-3 Right header image td.netcool-topheader-right {
Figure 5-40 on page 143 shows the image in the top right of the banner.
.
Figure 5-40 IBM logo
3. Edit the background-image for the file
$NCHOME/guifoundation/webapps/desktop/css/viewpoint.css to point IBM Tivoli Business Service Manager to display new viewpoint header images in the following sections:
– table.vp_header td.vp_header_left, as shown in Example 5-4.
Example 5-4 Left header image
table.vp_header td.vp_header_left { width: 2px;
height: 16px;
background-image: url( ../../images/ngf/vp_title_left.gif );
}
– table.vp_header vp_header_title, as shown in Example 5-5.
Example 5-5 Title header
table.vp_header td.vp_header_title {
padding: 0px 0px 0px 8px;
}
– table.vp_header td.vp_header_right, as shown in Example 5-6.
Example 5-6 Right title header
table.vp_header td.vp_header_right { width: 2px;
height: 16px;
background-image: url( ../../images/ngf/vp_title_right.gif );
}
These images are used to create the individual portlet frames.
4. Change the icons on the service tree to represent the custom images:
a. Copy the GIF file to $NCHOME/guifoundation/webapps/sla/icons/ and give it a name that ends with _svg.gif, such as mypicture_svg.gif.
b. Copy the SVG file to $NCHOME/guifoundation/webapps/sla/icons/svg/
using the regular name, for example, mypicture.svg. This name should be the name used for the GIF without the _svg extension.
c. The icons will now be available in the template view of the Service Administration window.
Figure 5-41 Service template d. Click Browse.
Figure 5-42 Custom Icons
To customize IBM Tivoli Business Service Manager, so that the client service tree displays custom icons. perform the following steps:
1. Place all the custom icon images in the directory
$NCHOME/guifoundaiton/webapps/sla/images.
2. Edit the policy to change the icon based on the current column by using the tree template:
a. Open the editor in the IBM Tivoli Business Service Manager GUI.
Note: in order to use custom images on a service tree, it is necessary to provide IBM Tivoli Business Service Manager with a GIF and SVG version of the same images.
b. Change the VALUE variable for each icon that should display if the column name is customized, based on the icon that would normally be displayed Example 5-7 Custom icon policy
if (columnName like '.*State.*') {
log("Columnname is State, value: "+value);
if (value < 3) {
icon = "/sla/images/clear_status.png";
}
if (value < 5) {
icon = "/sla/images/minor_status.png";
}
if (value = 5) {
icon = "/sla/images/critical_status.png";
}
showIcon = true;
log("Columnname is State, icon: "+icon);
}
3. Save the policy.
Chapter 6.
Operations
Operations are discussed in the following sections: