topic Re: User tasks with custom GUI mask elements with validators in Alfresco Archive

User tasks with custom GUI mask elements with validators

udoderk — Sun, 02 Sep 2012 20:41:54 GMT

Hi all,In project it’s needed to create a custom user task, that have 1) a lot of additional editable GUI elements, that shell be displayed in Activiti Explorer . (Not only s.c “Forms” from user guide http://www.activiti.org/userguide/index.html#forms)2) The GUI elements input values given by

Re: User tasks with custom GUI mask elements with validators

naag — Tue, 04 Sep 2012 05:56:15 GMT

Activiti only provides the engine for process execution via its API. All GUI related tasks have to be handled by yourself, e.g. via a JSF based application. That JSF application would then call to Activiti either via the API or via REST. Activiti Explorer is just a demo application to quickly show off Activiti (it's written in Vaadin btw).

Re: User tasks with custom GUI mask elements with validators

udoderk — Tue, 04 Sep 2012 20:24:39 GMT

Activiti only provides the engine for process execution via its API. All GUI related tasks have to be handled by yourself, e.g. via a JSF based application. That JSF application would then call to Activiti either via the API or via REST. Activiti Explorer is just a demo application to quickly show off Activiti (it's written in Vaadin btw).

Thank you naag,

Then I have another question:
it is possible to extend the Activiti Explorer task management webapp, so that on basis of xml definitions some additional GUI elements (written in Vaadin) in that webapp were provided???

Re: User tasks with custom GUI mask elements with validators

ronald_van_kuij — Wed, 05 Sep 2012 20:44:09 GMT

it is possible to extend the Activiti Explorer task management webapp, so that on basis of xml definitions some additional GUI elements (written in Vaadin) in that webapp were provided???

Yes, although I do not know directly how. Search the forum for this. Has been discussed before afaik

Re: User tasks with custom GUI mask elements with validators

udoderk — Thu, 06 Sep 2012 21:08:43 GMT

it is possible to extend the Activiti Explorer task management webapp, so that on basis of xml definitions some additional GUI elements (written in Vaadin) in that webapp were provided???
..
Yes, although I do not know directly how. Search the forum for this. Has been discussed before afaik

Thanks.
i'm found currently only one way - source code download and change it

"…Only by changing the source code of the image rendering…"
http://forums.activiti.org/en/viewtopic.php?f=6&t=3091&p=12405&hilit=Activiti+Explorer+customize#p12405

P.s

"…While Activiti Explorer would - surely - need to be customized in real-life applications, there's absolutely no documentation on that. - There's a mixture of JavaScript, an Activiti REST API, and a Java server backend, - however, that domain is not documented, at all…."

http://forums.activiti.org/en/viewtopic.php?f=6&t=95&p=357&hilit=Activiti+Explorer+customize#p357

Re: User tasks with custom GUI mask elements with validators

ronald_van_kuij — Thu, 06 Sep 2012 21:38:24 GMT

That is one of the reason we choose not to use it, but use jsf2 wiith cdi and use the form key and no form properties…

Re: User tasks with custom GUI mask elements with validators

udoderk — Sun, 09 Sep 2012 20:19:07 GMT

That is one of the reason we choose not to use it, but use jsf2 wiith cdi and use the form key and no form properties…

The using of jsf2-cdi is imho to expensive:-/ because you have to create all the GUI from scratch.
I will be try the following steps:
1. Project Creation
1.1 Activiti Explorer sources download

1.2. Download of needed jars (e.g. using WAR-file of A.E.)

2. Custom form type creation
2.1 describe the needed custom form type, that inherits from the org.activiti.engine.impl.form.AbstractFormType class.
The AbstractFormType implements the org.activiti.engine.form.FormType, that has a i.a. the getName method. This name will be used in in the form property definition of a BPMN 2.0 XML file.
Examples:
org.activiti.engine.impl.form.BooleanFormType or DoubleFormType

3. Creation of the vaadin validator of user inputs
3.1 Describe the java class, that inherits from com.vaadin.data.validator.AbstractStringValidator class.
Example: org.activiti.explorer.ui.validator.LongValidator.

4. Custom render creation
4.1 describe the renderer, that inherits from the org.activiti.explorer.ui.form.AbstractFormPropertyRenderer class.
4.2 register the validator on vaadin field
The examples:
org.activiti.explorer.ui.form.LongFormPropertyRenderer
org.activiti.explorer.ui.form.BooleanFormPropertyRenderer

5. Register the custom form type and renderer as beans into spring xmls, that placed
into <activiti-dir>\apps\apache-tomcat-<x.y.z>\webapps\activiti-explorer\WEB-INF:
5.1 Add to the process engine configuration in the applicationContext.xml file - the example:

<property name="customFormTypes">
<list>
<ref bean="userFormType"/>
<ref bean="textAreaFormType"/>
</list>
</property>
</bean>
<bean id="textAreaFormType"
class="org.bpmnwithactiviti.explorer.form.TextAreaFormType"/>

(i'm used the example from activitiinaction coding.)

5.2 Add the form property renderer class to the UI spring configuration activiti-ui-context.xml - the example from activiti forum:

<!– Custom form property renderers can be plugged in here –>
  <bean id="formPropertyRendererManager" class="org.activiti.explorer.ui.form.FormPropertyRendererManager" lazy-init="true">
    <!– Default renderer –>
    <property name="noTypePropertyRenderer">
      <bean class="org.activiti.explorer.ui.form.StringFormPropertyRenderer" />
    </property>
    <!– Renderers by property type –>
    <property name="propertyRenderers">
      <list>
        <bean class="org.activiti.explorer.ui.form.StringFormPropertyRenderer" />
        <bean class="org.activiti.explorer.ui.form.EnumFormPropertyRenderer" />
        <bean class="org.activiti.explorer.ui.form.LongFormPropertyRenderer" />
        <bean class="org.activiti.explorer.ui.form.DateFormPropertyRenderer" />
        <bean class="org.activiti.explorer.ui.form.UserFormPropertyRenderer" />
        <bean class="org.activiti.explorer.ui.form.BooleanFormPropertyRenderer" />
      </list>
    </property>

6. Export the created java classes (steps 2-4) to .jar file. It is not needed to create the war file for activiti-explorer application, because it is used into tomcat webap directory directly without .war container.

7. Place that jar file into lib dir of WEB-INF (so <activiti-dir>\apps\apache-tomcat-<x.y.z>\webapps\activiti-explorer\WEB-INF)

8. Describe of the custom form property definition within BPMN 2.0 XML file like the following

   <startEvent id="ID0" name="Start" activiti:initiator="initiator">
      <extensionElements>
<!– some standard type using–>
<!– custom type using–>
        <activiti:formProperty id="ID1" name="somename" type="theName-Defined-Into-Custom-Type-Java-Class" />
      </extensionElements>
    </startEvent>

Re: User tasks with custom GUI mask elements with validators

ronald_van_kuij — Mon, 10 Sep 2012 19:43:03 GMT

I'd think developing jsf2 forms with cdi a lot easier then doing what you propose, but that is my opinion…

Re: User tasks with custom GUI mask elements with validators

burn83 — Wed, 19 Dec 2012 16:30:01 GMT

i have realized this video in which i'm stopping in a first part of previous tutorial…

I use Netbeans 7.1.2 , with Maven Plugin.

i have downloaded any war and any sources …but my problem it's not solved.. :'(

http://www.youtube.com/watch?v=creTYWxCTWA

Re: User tasks with custom GUI mask elements with validators

frederikherema1 — Wed, 19 Dec 2012 16:34:23 GMT

The description by @udoderk should work fine. What exactly is the problem you're facing? A video isn't exactly the best/quickest way of showing your problem here…

Re: User tasks with custom GUI mask elements with validators

burn83 — Wed, 19 Dec 2012 17:02:00 GMT

i don't come to import, in Maven project, the libraries of webapp-explorer2 .. in particular way, the library that contains AbstractFormPropertyRenderer, in order to extends it.

I think that i have a scope problem…but i didn't solve it easiest…any idea?!

I don't come to access to a part of webapp-explorer2…i have import so a war so a jar…

in my video i try to demostrate this.. Sorry for the link…

Re: User tasks with custom GUI mask elements with validators

udoderk — Wed, 19 Dec 2012 17:18:23 GMT

i don't come to import, in Maven project, the libraries of webapp-explorer2 .. in particular way, the library that contains AbstractFormPropertyRenderer, in order to extends it.

I think that i have a scope problem…but i didn't solve it easiest…any idea?!

I don't come to access to a part of webapp-explorer2…i have import so a war so a jar…

in my video i try to demostrate this.. Sorry for the link…

hi, i use no maven to configurate the eclipse project. i configurate it manually.
I remember now. I've had any problems, then I have included all A.E. sources to eclispe project. But in that case whole A.E was compiled. Thus i created from A.E sources the jar file with .class files and referenced it as lib.

Re: User tasks with custom GUI mask elements with validators

frederikherema1 — Fri, 21 Dec 2012 07:59:33 GMT

As of 5.11, the activiti-explorer project contains all the classes and activiti-webapp-explorer2 war contains all web-stuff and dependency to the activiti-explorer JAR. This way, you can just use the activiti-explorer.jar as a dependency for your customizations…

Re: User tasks with custom GUI mask elements with validators

udoderk — Sat, 22 Dec 2012 09:27:25 GMT

i have realized this video in which i'm stopping in a first part of previous tutorial…

I use Netbeans 7.1.2 , with Maven Plugin.

i have downloaded any war and any sources …but my problem it's not solved.. :'(

http://www.youtube.com/watch?v=creTYWxCTWA

Hi burn83,

you are added not .jar but whole .war file (see thatfragment)

[img]http://img827.imageshack.us/img827/4336/netbeanactexpwar.png[/img]