Building Tabbed Coaches using IBM Process Designer V8.0

Introduction:

You can build a Coach as the user interface that process participants use to interact with a service. In the first stage of designing a Coach, your goal might be to build a mock-up. The mock-up contains static elements to visualize what data the Coach needs at run time and where the Coach displays the data in its layout. After you complete the first stage to design the look of the Coach, you need to feed real business data to the Coach controls. This step requires creating bindings between the Coach controls and the data structures (variables) that represent the business data within your IBM® Business Process Manager processes. Your process participants can then interact with the business data, which helps them make the appropriate decisions.

Overview:

This article describes the how to build a simple Coach view and build a tabbed coach. To capture or display all of the properties within a single Coach, the tab control is a good choice. Normally, you would reliable the text fields to something more appropriate for end users, but this article will retain the default labels to concentrate on laying out tabbed pages and mapping data to text fields.

In this example, we have an Employee business object that contains many properties. The first tabbed page of the Coach contains text fields that have some general information about an Employee. In this example, you add the fields directly to the Coach using sections to set the page layout.

Drag Coach Views or variables onto the layout of the Coach. These Coach Views can be the Coach Views you created earlier or the stock controls. The variables are business objects and their parameters that have been defined for the human service. For the variables, the Designer puts the Coach View that is associated with the business object or parameter type onto the layout. For example, if you drop variable of String type, the Designer puts a text stock control that is bound to the variable. If variable type does not have an associated Coach View, the Designer puts a placeholder message on the layout instead. You can then use the placeholder to manually set the binding between the variable and a Coach View.

Implementation:

We will complete the following steps to build a simple Tabbed Coach using IBM Process Designer v8.0.

Ø  Create Business Objects.

Ø  Create Coach View.

Ø  Create Human Service.

Ø  Test the application.

Create Business Objects:

Create the Employee business object. Customer EmployeeID (String), FirstName (String), and LastName (String), MiddleName (String), DateOfBirth (Date), Sex (String) parameters. It also has two complex parameters: PhoneNumbers (PhoneNumber) and Address (Address).

• PhoneNumber is a business object that has HomePhone (String), WorkPhone (String), and Mobile (String) parameters.
• Address is a business object that has HouseNO (String), Street (String), City (String), Country (String), and ZIP (String) parameters.

With the Employee business object, Addresses is an array of the Address type, so ensure that you select Is List for it.

Before create Business Object, we should have create Process App in IBM Process Designer. Log in to IBM Process Designer. Create a Process App called as ‘Tabbed Coach Sample’ and open with Process Designer.

Click on + symbol near Data at left side and select Business Object.

Give the business Object name as Address and add the fields as shown below.

Create another business Object name as PhoneNumber and add the fields as shown below.

Create business Object called as Employee and add the fields as shown below.

Create Coach View:

Now we will create the Coach View for the PhoneNumber business object. Click on + symbol near User Interface and select Coach View.

Give name for the coach view as ‘PhoneNumber’ and click on Ok.

Select Variables page, add the PhoneNumber business object as the business data variable named PhoneNumber.

In the Layout page, drag a vertical Section and rename as Phone Number. Drag the HomePhone, WorkPhone, and Mobile parameter variables onto the layout. A text control is added to the layout for each variable because it is the Coach View associated with the String type.

Save the changes.

Create Human Service:

Now we will create a Human Service to implement Tabbed Coach.

Click on + symbol near User Interface and select Human Service. Give the name as EmployeeHS.

Select EmployeeHS diagram view and drag a Coach onto the diagram and rename as Employee Coach. In the Step properties, we can rename the Coach to Employee Coach.

Select the Variables page in EmployeeHS; Click on add Private to add the Employee business object as a private variable.

Create the General page:

Select the Coaches page in EmployeeHS; drag a vertical Section and rename as Employee Details. Drag a tabs stock control onto the Employee Coach. The tabs control is in the Section category of the palette. Drag a Vertical Section inside Tabs control and Rename as General.

Drag a vertical section onto the tab control. A tabbed page can contain only one element directly. By adding the section, you can then add as many elements as you want into that section.

Rename the section to General. The name that you see on the tab comes from the label of the section.

Drag the EmployeeID variable onto the vertical section. Drag a horizontal section onto the vertical section below the EmployeeID text control.

Drag the FirstName, LastName and MiddleName variables onto the horizontal section. Drag DateOfBirth and Sex variables below the horizontal section. The General Page will look like below.

Create the Phone Numbers page:

Drag the PhoneNumber Coach View onto the tab control. If you did not add a tag to the Coach View, you can find it in the NoTags category on the palette. You can see a PhoneNumber tab in the tab control.

Select the PhoneNumber tab à Properties à General; Select the Binding as Employee.PhoneNumber variable. This action means that any data users enter into the fields gets set in the variable for the human service.

Create the Addresses page:

Drag the addresses variable onto the tab control. You can see an addresses 1 tab in the tab control. Select the tab. You can now see a table with a column for each property defined in the Address business object.

Select the table and in the General properties, change the label of the table to Address.

Select Properties àConfiguration properties and select Show Add Button and Show Delete Button. By doing this step, you can add and subtract address rows when you run the human service later in this example.

Drag a button control below the tab section and rename it to OK, The button broadcasts a boundary event and you can use it to wire the Coach in the human service flow

Select the diagram, connect the start node to the Employee Coach and then connect the Employee Coach to the end node.

Save your changes.

Test the application:

Now we have built the application which has tabbed coaches. We need to test the application to see, how the tabbed coaches are shown on the screen.

Open the EmployeeHS, click on Run Service at right corner.

The new web page will be opened in default web browser. The initial page will be look like below. After open the page, enter the employee details like below.

Click on Phone Numbers Tab and enter the details. The page will look like below.

Select the Address tab and enter the details. This tab has possibility of adding rows and deletion of rows as shown below.

Downloads

File Name	Description	Size	Download
Tabbed_Coach_Sample_V1.0.twx	Tabbed Coach Sample	785KB	Download
Tabbed Coaches in IBM BPM V8.0.pdf	Tabbed Coaches Document	687KB	Download

continue reading

Using XSLT primitives for Data Transformation in ESB

Introduction:

Within a mediation module, the message is received from a service requester before it is sent to a service provider. The structure of the message from a service requester is not always the same as that of a service provider. One of the common uses of mediation is to transform data from one format to another. We have several data transformation primitives in WebSphere ESB. Here we are going to learn about XSLT Primitive. We will see different functionalities which we have in XSLT.

Overview:

In IBM® WebSphere® ESB, XSLT mediation primitives are the usual component for data transformation and mapping. The XSLT module offers basic built-in functions such as string, substring, floor, and ceiling for simple data transformation. But for complex mapping requirements such as Date/time format conversion, or for working with Java objects that XSLT does not support such as java.math.BigDecimal, we can use the custom Java bean functionality and custom Java functions for data transformation. This article will describe the custom Java bean functionality, explore the conditional data mapping techniques using xsl:choose, and conclude with a discussion of error handling.

XSL generation

An XSLT primitive offers two choices for data mapping: generating XSL through mapping created with the Mapping Editor interface, or else using your own XSL, though this second option is discouraged because any changes you make when using the Mapping Editor and rebuilding the project will overwrite the XSLT.
Implementation:

We will complete the following steps to implement application using XSLT primitive.

1. Create BO, Interface and Mediation.
2. Implement XSLT Primitive.
3. Test XSL Transformation.
4. Test the Application.

Create BO, Interface and Mediation:

Create a mediation Module called as ‘EAI_FlightBookingMediation’ under Data Types create the Business Objects for our application to store the date. The following Business Objects create before creating Interface.

Create two interfaces called ‘FlightBookingInterface’ and ‘FlightBookingService’ as shown below.

Open Assembly diagram and add ‘FlightBookingInterface’ as an interface to FlightBookingMediation component and add ‘FlightBookingService’ as a reference.

Dar and drop a Java component in Assembly diagram and rename as ‘FlightBookingService’. Wire from FlightBookingMediation to ‘FlightBookingService’ java component.

Implement the Java component and add the following code to flightBooking (DataObject request) method.

System.out.println("Flight Booking Request Received :: "+request);

String Response = null;

Response = "Request received successfully";

return Response;

Implement the FlightBookingMediation component as a blank mediation flow and add the following primitives as shown below.

Implement XSLT Primitive:

Now we will learn how to create a XSL transformation and implantation here. Drag and drop a XSL transformation from Transformation Pallet rename as ‘XSLT_Request’ drag a wire from MessageLogger_Entry to XSLT_Request and from XSLT_Request to SI_FlightBookingService.

Similarly add one more XSL transformation for response mapping. The flow should be look like below.

Now we will implement the transformation mapping for XSLT_Request and XSLT_Response.

Double click on XSLT_Request and Give the name as ‘XSLT_Request’ then click on next.

Select the Message Root as / and make sure the Input Message body and Output Message Body selected correctly then click on finish.

Now the XSLT_Request mapping will open in new window. It will be look like below.

Expand the source and destination smo body parts and wire as shown below, to Move the source values to destination.

Here the move work like copy the source values to the destination values.

Drag a wire from DepartDate to Depart in destination, from the move drop down select FormateDate under Date and Time Functions.

Select the Formate Date à Properties à General and select the Pattern from drop down as shown below.

Drag a wire from DepartDate to JournyDate and double click on Local map to implement local mapping transformation.

Drag a wire from DepartDate to Day, Date, Month, Year field and select the date functions as shown below.

This will give the Day name, Date, Month name and Year will be sent to service.

Rright click on FlightClass and select Create Assign to set static value to specified field.

Select the assign transformation à Properties à General à Give the value as ‘Business Class’

Drag a wire from ReturnDate, IsRoundTrip to return and select If.

Select the If à Properties à Condition and give the condition as $IsRoundTrip == true.

Double click on If and drag a wire from RetrunDate to Return as shown below.

Import the attached EAI_CommonUtility project which hold the utility java classes and add as a Dependency in ‘EAI_FlightBookingMediation’.

Drag a wire from Destination to CountryOfDeparture and select Custom Java Transfrmation.

Select the Custom Java Transformation à Properties à general, select the class name ,method name and parametes as shown below.

The above java class is available in EAI_CommonUtility. It has java code logic to select the country for destination value.

We have lot of functions to perform in XSL transformation. We can perform different string functions, Date functions, Maths functions similarly.

Similarly implement the XSLT_Response XSL transformation. It should be look like below.

 Test XSL Transformation:

WID has built in function to perform the XSL transformation test. We can directly test the XSLT after implementation.

Open the XSLT_Response XSL transformation and click on Test Map.

It will open a view call Test Map view and select ‘Use the Associated XML files’ button to add a sample input file.

Click on Generate Input, give the XML File name and click on Finish then click on Ok.

Now it will generate Input Sample XML file to test XSL Transformation. Now click on Run Transformations.

Now it will generate the response XML file based on the implementation we have in XSLT_Response transformation. We have passed the input as ‘SUCCESS’ and the implementation have Move, so the final response in Output is ‘SUCCESS’.

This input and output XML files we can save for future reference or for future testing purpose.

Test the Application:

Now save the all files, start the WESB server and deploy the EAI_FlightBookingMediation in server.

Open the Assembly diagram and Right click on FlightBookingMediation select test Component.

Give the values as shown below and click on continue.

The output will be look like below.

Select the Request activity in Test client and see the request message which sent to Service. It will be look like below.

Conclusion:

This article showed how to use XSLT functionality for common data type and date conversions. Although the XSLT module is not as feature-rich as the Business Object Mapping Editor provided for SCA components, it is the only option for data mapping in a mediation module apart from using a full-blown Java custom mediation component.

Downloads

File Name	Description	SIZE	Download
XSL Transformation.pdf	XSL Transformation Document	988 KB	Download
XSL Transformation.zip	XSL Sample	32 KB	Download
EAI_CommonUtility.zip	Common Utility	8 KB	Download

continue reading