User Tools

Site Tools


pleak-frontend

Frontend of PLEAK

There is NodeJS runtime using ExpressJS framework as a web-server. ExpressJS serves client applications to the second component - users web browser.

NGINX web server is used to act as a web proxy between users web browser and NodeJS runtime. Proxy is used to add an extra layer of requests filtering to be sure that only the right services are accessible to the client application.

Client application is a custom user-facing frontend application, written in Angular, that handles file management and serves as an entry point to the PLEAK tools. Parts of frontend are also BPMN files modeller and viewer, based on open-source bpmn.io tools. All the work with a single selected file is done within modeller application, that provides a possibility to create and modify BPMN models, work with them and save to the local machine if necessary. All BPMN modelling related libraries are loaded and handled by NodeJS and client browser and proxied by NGINX. Modeller and viewer applications are integrated into frontend, but analyser-editor components are currently separated.

Quick guide

Currently there is no registration allowed, so all new users must be added manually into pleak database - see list of supported features.

Frontend of PLEAK provides a platform to create, view, edit, rename, copy, delete, move, share, publish and export models and folders that contain them. These models and folders are divided into two lists - own and shared files/models. In these lists, under each model and directory, you can perform different operations on these models and directories by selecting between options from Actions menu (with burger-menu icon). The list of options under Actions menu depends of the ownership or permissions provided to the user.

Creating, viewing, editing, importing and exporting models

Open Files tab of the frontend and click on green button New model to create new models, select suitable name for it. You can also create models by selecting corresponding option from the Actions menu.

Click on the name of a model in the list to view and edit it. You can also view and edit the model by selecting a corresponding option from the Actions menu.

Models open in a separate tab of a modeller - there you can import an already existing model from your computer or create and export new ones.

The model can be renamed in the modeller or by selecting the corresponding option from the Actions menu.

Creating and viewing directories

Open Files tab of the frontend and click on green button New directory to create new items, select suitable name for it.

Click on the name of a directory in the list to open/close it. You can also create directories by selecting corresponding option from the Actions menu.

Sharing and publishing models

Select Share option from the Actions menu and insert and e-mail of the existing PLEAK user to whom you would like to share the model. Select permissions you would like the user to provide with (view / edit).

Select Publish option from the Actions menu and create a public link for the model. Model is accessible through this link without requiring an existing PLEAK account to view it.

Sharing directories

Select Share option from the Actions menu and insert and e-mail of the existing PLEAK user to whom you would like to share the directory. Select permissions you would like the user to provide with (view / edit).

Other features

See list of features for more operations you can perform on models and directories.

More detailed instructions will be added soon.

Source code

The source code is available at pleak-frontend repository.

pleak-frontend.txt · Last modified: 2019/10/01 13:53 (external edit)