Chapter 18. Intelligent Process Server UI Extension

The Intelligent Process Server is focused on execution and contains no UI for interaction. To simplify creating custom UI, Intelligent Process Server is capable of providing:

  • Process form structures.
  • Task form structures.
  • SVG image of the process definition diagram.
  • Annotated SVG image of the process definition diagram.

Business Central, the authoring environment, allows users to build assets, such as rules, decision tables, forms, and others. In Business Central, Form Modeler generates forms that are well integrated with process and task variables, and provides binding between the inputs and outputs.

The Intelligent Process Server expects data to be mapped onto correct process and task variables. By generating form structures, you are able to create custom UI that will properly map the input data onto process and task variables.

18.1. Using the Intelligent Process Server UI Extension

The Intelligent Process Server UI Extension supports the following commands through the REST API. Note the following before using these commands:

  • The base URL for these will remain as the endpoint defined earlier (http://_SERVER:PORT/kie-server/services/rest/server/_).
  • All requests require basic HTTP Authentication for the role kie-server.
  • You need to enable SVG image storing in order to be able to retrieve it through REST API. To do that, follow these steps:

    1. Change into $SERVER_HOME/standalone/deployments/business-central.war/org.kie.workbench.KIEWebapp/profiles/.
    2. In jbpm.xml, find <storesvgonsave enabled="false"/>.
    3. Change it to <storesvgonsave enabled="true"/>
    4. Restart your server.
    5. Modify your business process and save it. This step is necessary, otherwise you will receive an empty SVG image.
    6. Build and deploy your project.

If you set the package attribute of your business process, ensure that it matches the package structure of your project. That means if you set the package attribute to com.example.myproject, place your business process into the com/example/myproject directory of your JAR file.

If you set the package attribute to a structure different from the directory structure of your business process, you will receive an error similar to the following:

16:35:52,155 WARN  [org.kie.server.services.jbpm.ui.ImageServiceBase] (http-127.0.0.1:8180-1) Could not find SVG image file for process 'sampleproject1.sampleprocess' within container TestKieUIContainer
  • The default form structure of the Intelligent Process Server is XML. You can change the format to JSON by providing HTTP header Accept: application/json.
Note

Start the process through Intelligent Process Server (for example, through the REST API) to ensure the following endpoints work.

[GET] /containers/CONTAINER_ID/forms/processes/PROCESS_ID

Server Response

<form id="1634631252">
  <property name="subject" value=""/>
  <property name="name" value="com.sample.evaluation-taskform"/>
  <property name="displayMode" value="default"/>
  <property name="labelMode" value="undefined"/>
  <property name="status" value="0"/>
  <field id="301394101" name="301394101" position="0" type="InputText">
    <property name="fieldRequired" value="true"/>
    <property name="groupWithPrevious" value="false"/>
    <property name="labelCSSClass" value=""/>
    <property name="labelCSSStyle" value=""/>
    <property name="label" value=""/>
    <property name="errorMessage" value=""/>
    <property name="title" value=""/>
    <property name="disabled" value="false"/>
    <property name="readonly" value="false"/>
    <property name="size" value=""/>
    <property name="formula" value=""/>
    <property name="rangeFormula" value=""/>
    <property name="pattern" value=""/>
    <property name="styleclass" value=""/>
    <property name="cssStyle" value=""/>
    <property name="isHTML" value="false"/>
    <property name="hideContent" value="false"/>
    <property name="defaultValueFormula" value=""/>
    <property name="inputBinding" value=""/>
    <property name="outputBinding" value="employee"/>
  </field>
  <field id="1698224711" name="1698224711" position="1" type="InputTextArea">
    <property name="fieldRequired" value="true"/>
    <property name="groupWithPrevious" value="false"/>
    <property name="height" value="3"/>
    <property name="labelCSSClass" value=""/>
    <property name="labelCSSStyle" value=""/>
    <property name="label" value=""/>
    <property name="errorMessage" value=""/>
    <property name="title" value=""/>
    <property name="disabled" value="false"/>
    <property name="readonly" value="false"/>
    <property name="size" value=""/>
    <property name="formula" value=""/>
    <property name="rangeFormula" value=""/>
    <property name="pattern" value=""/>
    <property name="styleclass" value=""/>
    <property name="cssStyle" value=""/>
    <property name="defaultValueFormula" value=""/>
    <property name="inputBinding" value=""/>
    <property name="outputBinding" value="reason"/>
  </field>
</form>

The XML response maps the following form:

Figure 18.1. Form Mapped to XML

9801
[GET] /containers/CONTAINER_ID/forms/tasks/TASK_ID

Server Response

<form id="1635016860">
  <property name="name" value="PerformanceEvaluation-taskform"/>
  <property name="displayMode" value="default"/>
  <property name="status" value="0"/>
  <field id="822358072" name="822358072" position="0" type="InputTextArea">
    <property name="fieldRequired" value="false"/>
    <property name="groupWithPrevious" value="false"/>
    <property name="label" value="Reason"/>
    <property name="errorMessage" value=""/>
    <property name="title" value=""/>
    <property name="readonly" value="true"/>
    <property name="inputBinding" value="reason"/>
    <property name="fieldClass" value="java.lang.String"/>
  </field>
  <field id="348604726" name="348604726" position="1" type="InputText">
    <property name="fieldRequired" value="true"/>
    <property name="groupWithPrevious" value="false"/>
    <property name="label" value="Performance"/>
    <property name="errorMessage" value=""/>
    <property name="title" value=""/>
    <property name="readonly" value="false"/>
    <property name="isHTML" value="false"/>
    <property name="hideContent" value="false"/>
    <property name="inputBinding" value="performance"/>
    <property name="outputBinding" value="performance"/>
    <property name="fieldClass" value="java.lang.String"/>
  </field>
  <field id="1048590899" name="initiator" position="2" type="InputText">
    <property name="fieldRequired" value="false"/>
    <property name="label" value="BusinessAdministratorId (initiator)"/>
    <property name="readonly" value="false"/>
    <property name="inputBinding" value="BusinessAdministratorId"/>
    <property name="fieldClass" value="java.lang.String"/>
  </field>
  <dataHolder id="initiator" inputId="BusinessAdministratorId" name="#9BCAFA" outId="" type="basicType" value="java.lang.String"/>
  <dataHolder id="performance" inputId="" name="#BBBBBB" outId="performance" type="basicType" value="java.lang.String"/>
  <dataHolder id="reason" inputId="reason" name="#FF54A7" outId="" type="basicType" value="java.lang.String"/>
</form>

The XML response maps the following form:

Figure 18.2. Form Mapped to XML

9803
[GET] /containers/CONTAINER_ID/images/processes/PROCESS_ID

Returns an SVG image of the process definition diagram.

Example 18.1. Server Response

9802
[GET] /containers/CONTAINER_ID/images/processes/instances/PROCESS_INSTANCE_ID

Returns an annotated SVG image of the process definition diagram.

Example 18.2. Server Response

9804