{section}
{column}

h1. Flowable User Interfaces

Flowable provides several web applications to demonstrate and leverage the functionality provided by the Flowable project. These web applications can be used with the Petals SE Flowable instance.

h2. UI Applications

Flowable offers four web applications:
* Flowable IDM: an identity management application that provides single sign-on authentication functionality for all others Flowable UI applications, and, for users with the IDM administrative privilege, it also provides functionality to manage users, groups and privileges,
* Flowable Admin: an administrative application that allows users with the right privilege to query the BPMN, DMN, form and content engines and provides several options to change process instances, tasks, jobs and so on. The Flowable Admin application connects to the engines through the REST API that is deployed within the Petals SE Flowable instance,
* Flowable Modeler
* Flowable Task

The Flowable User Interface does not need the four web applications to work correctly. In our case we will only use Flowable IDM and Flowable Admin.

{column}

{column:width=40%}
{panel:title=Table of contents}{toc:outline=true}{panel}
{panel:title=Contributors}{contributors:order=name|mode=list|showAnonymous=true|showCount=true|showLastTime=true}{panel}
{column}
{section}

h2. Flowable UI Admin Installation

Here, you can find some information to install Flowable UI Admin linked with a Flowable engine embedded into a Petals SE Flowable. More information about Flowable UI Admin can be found into the [Flowable's documentation|http://www.flowable.org/documentation.html].

For our sample installation, the required configuration is:
* a working Apache Tomcat installation with the application "Tomcat Manager Application" deployed. Apache Tomcat can be downloaded at : [http://tomcat.apache.org/],
* a Petals container where the Petals SE Flowable is running,
* the Flowable's REST API is enabled on the Petals SE Flowable.

And download the Flowable's distribution whose the version is the same as the Flowable engine embedded into Petals SE Flowable. This version can be downloaded at : [http://www.flowable.org/downloads.html].

{note}
Petals SE Flowable must be configured with a database reachable by external clients. So, using an in-memory or embedded database can be troubling.
{note}

h3. Installation

Flowable UI Admin requires Flowable UI IDM for its identity management that's why it is needed to deploy both webapplications.

rest.process.app.name=Flowable engine REST API
rest.process.app.description=Flowable engine REST API embedded into the Petals SE Flowable
rest.process.app.host=http://localhost
rest.process.app.port=8089
rest.process.app.contextroot=flowable-rest-api
rest.process.app.restroot=/
rest.process.app.user=rest-api-user
rest.process.app.password=user-api-rest-password

idm.app.url=http://localhost:8080/flowable-idm
idm.admin.user=admin
idm.admin.password=test
{code}
where:
|| Property name || Description ||
| {{rest.process.app.host}} | URL (scheme + host part) of the Flowable REST API running into the Petals SE Flowable |
| {{rest.process.app.port}} | URL (port part) of the Flowable REST API running into the Petals SE Flowable |
| {{rest.process.app.contextroot}} | URL (context part) of the Flowable REST API running into the Petals SE Flowable |
| {{rest.process.app.restroot}} | URL (service part) of the Flowable REST API running into the Petals SE Flowable |
| {{rest.process.app.user}}/{{rest.process.app.password}} | Credentials of the user with privileges to access the Flowable REST API running into the Petals SE Flowable |
| {{idm.app.url}} | The URL of the Flowable IDM UI web-application, used for authenticate user by other Flowable UIs. |
| {{idm.admin.user}}/{{idm.admin.password}} | Credentials of the IDM user with admin privileges (when running with default configuration: admin/test) |
# '{{db.properties}}' located in Tomcat classpath ({{$TOMCAT_HOME.lib}} or {{/var/lib/tomcatX/lib/}} according to your Tomcat's installation). Create it with the following content:
{code}
db=h2
datasource.driver=org.h2.Driver
datasource.url=jdbc:h2:tcp://localhost//tmp/h2-flowable.db
datasource.username=sa
datasource.password=
{code}
where:
|| Property name || Description ||
| {{db}} | Your database type. Available types are: {{h2}}, {{mysql}}, {{oracle}}, {{postgre}}, {{db2}}, {{mssql}} |
| {{datasource.driver}} | The JDBC driver to use |
| {{datasource.username}}/{{datasource.password}} | Credentials to connect to the database |

First, starts to install the Flowable UI IDM deploying the WAR file '{{flowable-idm.war}}' available in the Flowable's distribution archive with the Tomcat manager ([http://localhost:8080/manager]). Check this installation going to [http://localhost:8080/flowable-idm] and login with a user having an admin role. You should be able to manage users, groups and privileges. The default user with admin role is 'admin/test'.

Next, install the Flowable UI Admin deploying the WAR file '{{flowable-admin.war}}' available in the Flowable's distribution archive with the Tomcat manager ([http://localhost:8080/manager]). Check this installation going to [http://localhost:8080/flowable-admin] and login with a user having an admin role. You should be able to manage Flowable.

{note}
If you use a database different from H2, don't forget to add your JDBC driver into the web-applications copying the associated JAR-file in '{{/var/lib/tomcatX/webapps/flowable-idm/WEB-INF/lib}}' and '{{/var/lib/tomcatX/webapps/flowable-admin/WEB-INF/lib}}'.
{note}

{warning}
If you use a h2 database, you have to change the version of the H2 JDBC Driver embedded in Flowable UI web applications to be aligned with the one used by Petals SE Flowable:
* Get the convenient jar file at: [https://search.maven.org/remotecontent?filepath=com/h2database/h2/1.4.178/h2-1.4.178.jar].
* Go inside '{{/var/lib/tomcatX/webapps/flowable-idm/WEB-INF/lib}}' or '{{$TOMCAT_HOME/webapps/flowable-idm/WEB-INF/lib}}' and delete h2-1.3.176.jar file.
* Copy the downloaded h2 jar file in this directory.
* Go inside '{{/var/lib/tomcatX/webapps/flowable-admin/WEB-INF/lib}}' or '{{$TOMCAT_HOME/webapps/flowable-admin/WEB-INF/lib}}' and delete h2-1.3.176.jar file.
* Copy the downloaded h2 jar file in this directory.
* Reload both web applications
{warning}