Open ESB Tip : Generating Business SVG with the AjaxGetBpelProcessSvgServlet

Read the original article at The Crooked Stick

To allow our Pre-Sales people to extend their Cars Online Demo I was ask to document the usage of the AjaxGetBpelProcessSvgServlet Servlet so that it can be called from any web page and return  displayable SVG Code that represents the BPEL Process in a business format. Hence because this information may be useful to the general community I have decide to document it in this blog. I will assume that the reader has read the previous blog "Giving the BPEL Monitor a Business Skin" which describes how to add the a specific images and hence will not be covering that.

<script type="text/javascript"> $(document).ready(function(){ $("#traildiv").load("../resource/bpel-monitor/MonitorTrail.html"); $("#resourcediv").load("../resource/bpel-monitor/MonitorResources.html"); $("#traildiv").load("resource/bpel-monitor/MonitorTrail.html"); $("#resourcediv").load("resource/bpel-monitor/MonitorResources.html"); }); </script>


Client Side Call


To insert the SVG into an existing Web Page we will need some simple JavaScript to define a JQuery Ajax call to the AjaxGetBpelProcessSvgServlet and and a simple <div> in the web page. with the id = "processSVGDiv". The following JavaScript function will execute the Servlet Asynchronously and replace the html within the div when it succeeds.

If you use Internet Explorer, Opera or an old version of FireFox then it will not display the SVG directly. Therefore the Servlet will return the svg wrapped in an <embed> tag.

function refreshProcess() {
$.ajax({
type: "GET",
cache: false,
url: makeUrl("AjaxGetBpelProcessSvgServlet"),
dataType: "text",
async: true,
success: function(data, status) {
$("#processSVGDiv").html(data);
},
error: function (XMLHttpRequest, status, error) {
$("#processSVGDiv").html("BPEL Process Must Be Selected");
}
});
}
function makeUrl(base) {
var url = window.location.href;
var index = url.lastIndexOf("/");
var baseUrl = url.substring(0, index);
var fullUrl = baseUrl + "/" + base;
return fullUrl;
}

Parameters will be passed to the Servlet using Session based Cookies and these should be set before the call to the Servlet.

Parameter Cookies

As mentioned the Servlet uses Cookies to configure the resulting SVG code and the required Cookies are documented below:

  • bpel.suName : Service Unit Name (Required).
  • bpel.bpelId : BPEL Id (Required). 
  • bpel.bpelName : Name of the BPEL Process (Optional).
  • bpel.id : BPEL Instance Id (Optional).
  • svg.scale : Scaling factor (Optional).
  • svg.show.business.icon : Flag to indicate business Icons should be used (Required = true).
  • svg.collapse.composites : Flag to indicate that the Sequences should be collapsed (Required = true).
  • svg.layout : Define if Horizontal or Vertical (Optional).

I will briefly describe the required Cookies in more detail.

bpel.suName

The Service Unit Name is required so that the Servlet can retrieve the actual BPEL File from the SERVICEUNIT Database table that exists within the monitoring database. At present the servlet does not search the deployed application only those that have been registered as being Monitored and hence exists in the SERVICEUNIT database table.

bpel.bpelId

The BPEL Id is used to query the MONITORBPELACTIVITYICONS table to identify the Business icons associated with the collapsed sequences. This table needs to be created manually as define in "Giving the BPEL Monitor a Business Skin" blog entry. In addition the name of the BPEL Process will be stripped off this id and then used to identify the actual BPEL file within the SERVICEUNIT Clob field.

bpel.id

This is the unique Id of a specific BPEL Instance and needs to be passed only if the progress of a specific instance needs to be tracked.

svg.show.business.icons

This flag indicates that the business icon should be retrieved from the MONITORBPELACTIVITYICONStable and used in preference to the standard icons. The table will be queried based on the bpelId and the Activity name.

svg.collapse.composites

This flag indicates that the Sequences should be collapsed and displayed as a simple icon. If this is combined with the svg.show.business.icons flag then the default collapsed icons will be replaced by the appropriate business icon.

Summary


Setting the appropriate Cookies and using the JavaScript above, you will need JQuery, will cause the BPEL Process to be converted from its technical layout to the business layout.

Technical

Process

Business

Process

Comments:

Post a Comment:
Comments are closed for this entry.
About

As a member of the Oracle A-Team we specialise in enabling and supporting the Oracle Fusion Middleware communities.

Search

Archives
« April 2014
MonTueWedThuFriSatSun
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
    
       
Today