Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

With this example, we create a new process that can be initiated anonymously which can be embedded to a web site website or other application.

Steps

...

Create a new process with name the "Anonymous Task" name from the folder menu and edit the process version to open process designer.

Click to on “Pool” to open the design of the pool.

Before designing the process diagram check the “Is Anonymously Accessible ?” box from the left side bar to enable access to this pool to anonymous users.

...

In this example we create 2 task tasks as following graph;

...

Workflow The process will be started with the “Service Request” task and when completed workflow moves to the “Service Handling” task to handle the related request.

Create Roles

Create a role with the “Service Handler” name to define who is filling the this role in the process.

...

When role a added designer automatically opens the role definition editor. Click to on the “+” icon to add a new row and select an a responsible person by clicking to on the “Assigned To” column.

...

Select the “Service Handling” task from the process diagram and choose “Service Handler” from the task options at on the left side of the screen.

Create Form

Click on “Form” from process designer to open form designer.

...

After the form designer is open click on the “Add New” button and expand the “Layout Options” and choose “Row Content” to append a new row layout content to the form.

...

Select the row content and click again to “Add New” and expand “Input Controls” and choose “Html Editor” from the options.

...

Because we are creating a new field designer will ask for the name of the field to be added to the form. Enter “Request” and click to on the “Ok” button.

...

After the field is appended, the form design should be looking like this;

...

You may add additional fields to form as many as you want. This These fields are asked to the anonymous user while filling out the form.

Saving Process

Click to “Close” button on top of the screen to close the designer and click on to “Commit Changes” button to save your work.

...

At this step, we have finalized the design of the process and we can test it.

Testing

In folder of the process we should see a new start point as the “Service Request” option as followingfollows;

...

At this stage, if we start a new instance of the “Service Request” process it be is started in test mode and all of the tasks are will be assigned to the current user for easier testing.

...

Anonymous access requires an API key to limit certain features that can be used as by an anonymous user. To create a an API key open the “Edit Domain” from the “System Administration” menu.

Open the “Security” tab and than then select the “API Keys” sub-tab.

...

Click to on the “Add New” menu to create a new api API key, and enter the purpose of this api API key for why this API key is needed. Click the “Done” button to close the editor.

...

Click on the “Details” button to specify which features are can be used with this API key.

For anonymous anonymously accessed form forms at least “login” and “process_initiate” features must be enabled. Choose “Enabled” for these features.

...

Before closing copy the API key with a copy to clipboard button with the red circle. We will need this api API key later while embedding the form.

...

Select the “Save” action from the top menu to save these changes.

Embedding Form to a Web SiteWebSite

After the api API key has been created we can embed the “Service Request” step in a web sitewebsite.

Create a an empty html file with the following content;

Code Block
<html>
  <body>
  Hello!
  <iframe src="" width="100%" height="600" frameborder="0"></iframe>
  </body>
</html>

Navigate to the folder where the “Service Request” process is saved, instead of clicking to on the service request start step right click on it and choose “Copy Link Address” from the menu.

...

In html file content replace the IFrame src attribute with copied address and replace the ‘#' character with '?’ and add generated API Key parameter to the end of the address in “&apiKey=…..” format.

Final The final address should be like this;

Code Block
<html>
  <body>
  Hello!
  <iframe src="https://mydomain.emakin.com/app/?/initiate/129b8....48d0/fe0....8/976...c5&apiKey=58....5a" width="100%" height="600" frameborder="0"></iframe>
  </body>
</html>

Save the html and now can open the html in the browser.

More details can be found at on the Embedding Emakin page.

Example File

...