Prerequisites

You need a zip file containing the desired Javascript library code (.js, or .min.js) [e.g., tesseractJS-2_1_4].

Step 1 – Upload the library js code

From the Simplifier Dashboard click ‘Applications’ and select the ‘libraries’ tab:

Click ‘+’ to upload your library code:

Enter ‘name’ and ‘version’ details, and upload the zip file:

Step 2 – Integration code

Enter the code snippet which should be used to integrate the Javascript code of the library:

In this case, we use the ‘addScript’ method for integration. The first parameter is the relative path to the Javascript file in your zip folder (.js or .min.js). The second parameter defines a name which can be used to specify dependencies between this library and possible others, which are also integrated via ‘addScript’ in this code block (cf. Example – Simplifier Documentation).

Further available integration methods (e.g., for integration .css styles) can be found in the Simplifier Documentation.

Click ‘Save’ to finish the upload and integration step.

Step 3 – Add library to Simplifier App

Now, go to your Simplifier App, where you want to use the library. Open the ‘libraries’ tab in the Application Editor:

Click ‘+’, use the search bar to find your library, and select it:

Now, the library is added to the list of available libraries:

Step 4 – Use library in Simplifier App

The library can now be used in Scripts in the Process Designer:

Step 5 – Libraries with Dependencies

Some JavaScript libraries have dependencies to other JavaScript libraries. In these cases, it’s important to ensure that the dependent library is loaded after the library it has a dependency on.

For example, there’s a plugin for the ChartJS library called chartjs-plugin-datalabels. To use this library in Simplifier, you first have to upload ChartJS:

Then, upload the dependent plugin library for ChartJS:

Finally, add ChartJS as a dependency in the section ‘Dependencies’, as well as in the JavaScript integration code. To do so, add the library name as third parameter to the ‘addScript’ code, with the following syntax:

addScript('dependent_lib_minjs_file', 'dependent_lib_name', ['dependency_name']);

In our case:

addScript('chartjs-plugin-datalabels.min.js', 'datalabelsjs', ['chartjs']);

Now, when using the dependent library in an application or a widget, all the libraries in the dependency list are loaded beforehand to ensure functionality.