Using External Web Applications (Process-based UI Mashups)

Process-based UI Mashup Applications provide the option to integrate data and services provided by different sources and support interactions between them. For details on the concept of using UI Mashup Applications, please refer to chapter Process-based UI Mashups of the Stardust Concepts.

• Using External Web Applications in Process Models
• Example Usage

Using External Web Applications in Process Models

To add an External Web Application to a model perform the following steps:

1. In the diagrams toolbar select Int. Applications > External Web Application.
   (Alternatively, in the Outline view right-click Applications and choose New Interactive Application > External Web Application.)

   
   Figure: Create an External Web Application.

2. Open the properties dialog.
3. Expand the Interactive tree in the left pane and select External Web Application.

   
   Figure: External Web Application Properties.

4. In the right pane enter an arbitrary URL for your application.
5. Select Typed Access Points in the Interactive tree in the right pane.
6. In the Typed Access Points pane, you may define an arbitrary list of access points for your application. Supported data types are primitive (except of type char or Calendar) or structured data.
7. Note that if the Displays Imported Model Elements as Groups check box is selected, the access point list displays references for the referenced structured data. Selecting the check box also groups local and referenced elements.

Figure: Add Input Source Parameters

Figure: Setting Typed Access Points.

Modifying the Typed Access Points

You can modify the specified source and target access points.

1. In the Typed Access Points pane, right-click the root of access point and then select Modify

   
   Figure: Modify Typed Access Point

2. Specify the parameters in the Modify Parameter dialog box and click OK

   
   Figure: Modify Typed Access Point

Deleting the Typed Access Point

You can delete the source and target access points.

1. In the Typed Access Points pane, right-click the root of access point and then select Delete Parameter

   
   Figure: Delete Typed Access Point

   The Warning dialog box gets displayed.
2. Click OK to delete the access point parameter

   
   Figure: Warning - Delete Typed Access Point

Data Mappings

You can use access point path as well as data path in the data mapping. Per default, only the full value of a parameter is used. You can change this behavior to either enter the name of declared parameters or the data mapping IDs. To have both options, change the property Carnot.Compatibility.Interactions.SupportDataMappingIds, in your carnot.properties file to true.

It is also possible to write an attribute of a structured parameter to a primitive variable, e.g.:

Figure: Using a Structured Data Attribute in Out Data Mapping

Example Usage

This is a small example to demonstrate the usage of an External Web Application associated with an application activity.

In a dynamic Web project create a model as follows:

• Create the following activities in a sequence:
  1. manual trigger
  2. manual activity
  3. application activity
  4. manual activity
• Create structured data types Address and Person, e.g.:

  
  Figure: Structured Type Address
  
  
  Figure: Structured Type Person

• Add structured data of each of these types.
• Create an External Web Application.
• In the properties page enter a URL for your application, e.g. http://www.wikipedia.com.
• In the properties page Typed Access Points pane, add the structured data of type Person as input and the structured data of type Address as output resources:

  
  Figure: Add Typed Access Points

• Add an in and out data mapping from the structured data of type Person to the first manual activity.
• Additionally create an in-data-mapping from this structured data to the External Web Application.
• Create an out data mapping from the External Web Application to the structured data of type Address.
• From both structured data create an out data mapping to the last manual activity.

Your model now looks similar to the model in the following figure:

Figure: Example Model

Testing the example

Now start your server, deploy the model and run the activity associated with the External Web Application in the Stardust Portal. Your application should come up with the URL you entered in the properties page.

For example, if you entered the URL http://www.wikipedia.com, the following page is coming up:

Figure: Example URL.

Now you may inspect the interaction via its REST interface.

Figure: Interaction URI

Selecting one of these options displays the according xml file. For example Show In Data Values displays all the in-data values of the activity, which invoked the External Web Application:

Figure: Example - Show In Data Values

entered in the entry fields for a structured data:

Figure: Example - Entered In Data Values.

Example Usage

An example usage is to mashup angular based UI into the Stardust Portal. For details on the steps to perform such a mashup, please refer to chapter Mashing up Angular based UI into Stardust Portal in our Tutorial Guide. This tutorial guides you through the steps to mash up Angular based UI into the Stardust Portal. It describes how to ensure that data entered on the Angular UI is saved in the Stardust data and the Stardust data can be read and displayed in the Angular UI mashed up in the Stardust Portal.

Note that the tutorial model is created in the Business Process Modeler, but the usage concept is applying to the Eclipse modeler as well.