Custom options and advanced settings

<< Click to Display Table of Contents >>

Navigation:  Bizagi Studio > Bizagi from external applications > Portals integration > Bizagi Web parts for SharePoint > Bizagi Web parts for SharePoint Online > Using the Web parts >

Custom options and advanced settings

Overview

The following article describes how to use additional options when choosing to integrate Bizagi into SharePoint through diverse specific Web parts, as described in the second option at Using the Web parts.

 

Such additional options provide advanced settings for a SharePoint Web designers to enhance flexibility so that they may:

Customize where each of the Web parts (that compose the complete Bizagi Work portal) is exactly displayed.

Decide if certain options are available and shown for a given SharePoint page (e.g, you may show the inbox from a certain page as a summarized view without having the full work portal options).

 

SPWB_SP2010_intranetInbox

 

Notice that in the example above, the inbox presents 5 cases per page.

 

Specific Web parts

For this approach you choose to include separately each piece of information and views that Bizagi presents at its Work portal.

Such specific web parts are: Activity Form, Inbox, Case summary, Start Process list, Start Process button, and they will be described in the sections below.

 

SPonline_015

 

By including all of these, you may build up the Bizagi Work portal manually (instead of directly using the Work portal Web part, which is already composed by the aforementioned).

If you wish to automatically include Bizagi Work portal as a whole Web part, refer to The Work portal Web part.

 

1. My Inbox

This Web part shows the list of pending work of a user (his or her Inbox).

In this Web part, the user will view a filtered list of his or her to-do list (according to activities' due date or to specific Processes).

 

07MyInbox

 

Notice that Bizagi Inbox is presented in 2 different views: grid or details, and that you may switch these:

 

07MyInbox2

 

Keep in mind this Web part has some settings which require configuration (as described in the next section: Web parts settings).

 

2. Activity form

This Web part allows users to work on new cases. Every time the web part is loaded a new case is created.

 

08ActivityForm

 

Keep in mind this Web part has some settings which require configuration (as described in the next section: Web parts settings).

 

3. Case summary

This Web part allows users to view the summary form of a case, and to decide if he or she wishes to work on this case (by clicking on the Work on it button).

It is really useful when a user needs to first take a look at summarized and important information related to processes, in order to start working on it.

It is shown by default in the right hand side of the Inbox when in a details view (or also shown by clicking on the View Summary button when in a grid view).

 

15Summary

 

Clicking Work on it will open an Activity form pop up.

 

Keep in mind this Web part has some settings which require configuration (as described in the next section: Web parts settings).

 

4. Start process list

This Web part allows users to start Process instances (create new cases).

It will show the available Process list, with the option to search or filter according to recent Processes.

It is really useful when a user has many possible Processes to start, otherwise it can be best to use the Start Process button Web part instead.

 

Selecting and clicking on a Process chosen to start, will trigger an Activity form pop up to show the first form of that Process.

 

09Startprocesslist

 

Keep in mind this Web part has some settings which require configuration (as described in the next section: Web parts settings).

 

5. Start process button

This Web part allows users to start Process instances (create new cases) one-click away.

It will show a button with an optional label to provide a shortcut which is really useful when a user will most likely only start a few types of Processes (you may have 1 or more of this Web part).

 

On the other hand, if the user can choose from many possible Processes to start, it can be best to use the Start Process list Web part instead.

 

Clicking on the button will trigger the Activity form pop up to show the first form of that Process.

 

10Startprocesbutton

 

Keep in mind this Web part has some settings which require configuration (as described in the next section: Web parts settings).

 

note_pin

To configure this Web part, it is recommended to sign in with a user that has the proper rights in Bizagi to access processes.

 

Interaction between Web parts

The following diagram illustrates how these Web parts interact with each other (their dependencies):

 

Interaction

 

 

Note that for instance, the Activity form is shown by any click events coming from either: the Start process button, the Start process list, the Case summary, or the very Inbox.

 

There are different ways of showing the linked Web parts on your site: Pop up, Parent pop up and Other page.

Pop up: The invoked web part appears as a modal within the summoning web part's iframe.

Parent pop up: The invoked web part appears as a modal within the container that holds the summoning web part's iframe.

Other page: The invoked web part is shown on a new page.

 

To set the widget to work correctly when attempting to use the Parent Pop up option, you need to equip your portal with the following script:

 

<script type="text/javascript" src="../BizagiAdd-in/Scripts/bizagi.addin.controller.js"></script>

 

To do so, click on Add a Web part on the page editor and select Script Editor from the Media and Content category and add the web part.

 

SPonline_016

 

Next, click on Edit Snippet.

 

SPonline_017

 

SharePoint will now show a dialog, paste the script code on the text box shown, and click on Insert.

 

SPonline_018

 

note_pin

Currently SharePoint Site Pages do not support third party scripts on their sites, therefore we recommend using SharePoint Web part Pages.

 

Example

SharePoint Online offers two types of web pages: Web part Page and Site Page. The main difference between these two types of pages is that a Site Page is responsive and it is compatible with mobile devices. They both support Web parts, though for Site Pages Web parts are named App parts. Bizagi Web parts keep the same settings and properties regardless of the type of page they are being used on.

 

This example will show how to add Web parts to these type of pages.

 

Add Web parts in a Web part page

To add Web parts to a page, keep in mind you may also do this from scratch in blank pages. If you do create new pages, these Web parts are recommended to be included in a page with the "Header, Left column, Body" layout:

 

SPonline_019

 

Adding Web parts is done by clicking on the Add Web part sections and choosing from the Apps category:

 

SPonline_020

 

 

To configure the Web part, click on the drop-down icon and in Edit Web part:

 

SPonline_021

 

Then configure the Web part settings in the panel appearing at the right side of the edited page.

 

The following table lists the configuration settings for these Web parts:

 

SETTINGS GROUP

PROPERTY

DESCRIPTION

APPLIES TO

Bizagi Server

Bizagi Server URL

Defines the Bizagi Workportal location.

Important: The URL must have https protocol and end without the final slash, like this:

https://www.mydomain.com/bizagiproject

All Web parts

Bizagi Configuration

Adjust buttons to content

Allows you to define how the activity buttons are displayed. If it is enabled, the buttons will be displayed at the bottom of the web part. Otherwise, they will be displayed at the bottom of the created form.

Activity form

idWfClass

Determines the process ID to which the new case will be created.

Activity form, Start process button

Graphic Query Behavior

Specifies how the Graphic query will be displayed:

Pop-up: Open the content on a modal dialog within the widget canvas.

Parent Pop-up: Open the content on a SharePoint Pop-up. To use this option it is necessary to enable interaction between webparts.

Other page: Open the content on a new page.

Case summary, Inbox

Render Behavior

Defines how the links or buttons will be displayed: Pop-up, parent pop-up or other page.

Case summary, Inbox, Start process button,  Start process list

Render Page URL

Assigns the URL where the action of the links and buttons will be displayed when other page is selected as Render Behavior.

Case summary, Inbox, Start process button,  Start process list

idCase

Represents an instance of a process.

Case summary

idWorkitem

Sets the process element ID selected to display.

Case summary

Default View

Personalizes how the inbox will be displayed. There are two possible values: Details and grid.

Inbox

Page Size

Specifies the number of records to be displayed when Default view is set as grid.

Inbox

Show View Toggle

Allows you to choose if there will be a button displayed to switch between grid and details view.

Inbox

Summary Behavior

Helps you specify how will the activity summary be displayed: Pop-up, parent pop-up or other page.

Inbox

Summary Page URL

Establishes the URL where the link and button actions will be displayed when other page is selected as Summary Behavior.

Inbox

Button CSS Style

Interprets the CSS to be added to the button.

Start process button, Start process list

Button Name

Designates the button's display name.

Start process button

Label Text

Defines the object's display name

Start process list

Appearance,

Layout and

Advanced

(SharePoint usual settings)

Settings in these groups are SharePoint standard.

When using Bizagi Web parts, you may choose to edit settings such as: their title, height and width, and if title and borders are shown (Chrome type).

For instance, select Chrome type = None to hide the default title and border.

All SharePoint Web parts.

 

When you have configured the Web part, save the edited settings.

Keep in mind you should configure each of the involved Web parts, and then check-in your changes.

 

Setting up Web parts on a Site Page

All you need to do to add a new App part on your Site Page is click on the Add new icon and then select the Bizagi App part you wish to insert on your page. For the sake of this example we'll select Bizagi Inbox.

 

SPonline_025

 

Once added, click on your App part's Edit icon to continue with our set up.

 

SPonline_026

 

Type in your server's URL keeping in mind the URL need https protocol and it avoids ending with a slash. To set up the App part as responsive, make sure you check on Resize to fit page.

 

SPonline_027

After you set up your App part click on Apply and you're ready to go.

 

note_pin

Bizagi App parts have the same settings as Bizagi Web parts. Currently, SharePoint Online doesn't allow scripting on their Site Pages, therefore the Parent Pop-up display option won't work correctly on this type of pages. If you wish to use that feature, we recommend using a Web part Page instead.

 

Viewing your Web parts

In the example below, we are using 4 Bizagi web parts: 3 Start process buttons, and one Inbox:

 

SPWB_SP2010_intranetInbox_exp

 

At this point, we are done configuring the Web parts with custom options!