Skip to main content

Attributes

Settings​

Action​

Progress bar listener - Used mainly on the global page to load running processes in the background (JOBs, Events). This action is required in order for the "Show List" action, which displays all running processes, to work. It is also possible to define the progress bar listener in a single modal page in the combination with the “Show List” action, to avoid running the initialization code on each page.

Show progress bar (Process name) - This action is used when the user needs to wait for the completion of the process. This way we provide a better user experience for processes that require the user to stand by until the process is complete.

Show progress bar (JOB name) - This action is used for long-running processes and database jobs which we want to run in the background while the user continues with their work. This action will automatically pick up the running process used in the Progress Bar Pro API. The progress bar can be displayed in the “Show list” dialog and/or in a page component defined in the affected elements. We can also define a success message that is displayed after the process is completed.

Show progress bar (Event data) - This action is used as the listener for event data. If we are able to provide this.data on an event with this action then it is possible to dynamically display the progress bar. The purpose of this action is to trigger events like DB Job completion or failure in the background from the external library such as "APEX Office Print".

Show list (All running JOBs) - This action is used to display a list of jobs and events. Affected elements also has an impact on where to display the list.

Clear list (Event data) - With this action, we clear all events from a list in a current session. All events are put into "archive" mode (not displayed anymore).

Process / Job Name​

With this attribute, we link the progress bar with our program logic (API). The progress bar will periodically represent the status of the process or DB Job.
This field is mandatory for the "Process" or "Job" type action.
The name of this process or job must be the same as was used in the "UC_PROGRESSBAR_PKG" API call (argument p_process_name as in the example below).

Style​

Some basic settings to define the style of the progress bar. Additional options are possible by defining JavaScript Initialization Code or adding CSS settings.

Available options include:

Striped - The progress bar is displayed with a striped pattern.

Animation - Should the progress bar include an animation – only applicable when the striped option is enabled.

Overlay - Enable or disable full-screen overlay. Only applicable for the "Process" Type action.

Display text - If the text should be displayed inside or among the progress bar at all.

Small (no text inline) - This setting makes the progress bar a bit thinner. This is only applicable if the location of the text is set above or below the progress bar itself.

Color​

Option to choose one of the APEX Universal Theme default color classes.

Check interval​

Refresh interval defined in seconds.
For job types, we suggest putting more time between check status in order to avoid checking status in case of multiple jobs running at the same time.
In other words, this setting is the time between AJAX calls to the database.

Behavior​

The behavior option is used only in "Job" and "Event" types of actions since the "Process" type is straight forward (the user needs to wait until it's finished).

Available options include:

Show inline success/error message - Show a success message after DB Job completion. Only applicable for the "Job" and "Event" type action.
In the case of custom message scripts (SweetAlert, Alertify...) you can turn down this option and use plug-in events to display your custom messages.

Remove after complete - Hide progress bar after completion from the affected elements of the built-in list.

Hide small on complete - Hide progress bar but keep the completion message. Only applicable on small progress bar (no text inline).

Auto open list - Show Job/Event directly on the built-in list. This way we avoid opening Job/Event in the center of the page.

Selection Type​

Select how to define the page components to be affected when this action is executed.

 Available options include:

 Button - The action affects the button you select.

Region - The action affects the region you select.

jQuery Selector - The action affects the page element(s) returned using the jQuery selector syntax you enter.

JavaScript Initialization Code​

With this attribute, some settings of the plug-in can be specified on the instance level.

Instead of repeating template settings, you can use "text messages" defined with the option "Used in JavaScript" set to "Yes".
For example, you can add the following text messages to your application :

UCPROCESS.STATUS       > "%3"

UCPROCESS.PERCENT      > "%1%"

UCPROCESS.PERCENT_OF   > "%1% of %2%"

UCPROCESS.PERCENT_NAME > "%0 %1% of %2%"

UCPROCESS.ROWS         > "%1 of %2 rows"

UCPROCESS.COMPLETE     > "Complete %0!"

Replacement string parameters :

%0 - Name

%1 - Current value

%2 - Max value

%3 - Text status

Dialog lists can be translated with following text messages used with option "Used in JavaScript" set to "Yes".

UC.PROGRESSBAR.DIALOG.TITLEL               > "Process list"

UC.PROGRESSBAR.DIALOG.BUTTON.CLOSE_LIST    > "Close list"

UC.PROGRESSBAR.DIALOG.BUTTON.CLEAR_LIST    > "Clear event list"

Example code

function( pOptions ) {
     
    //style settings
    pOptions.style.textLocation = "inline"; // inline, top, bottom
    pOptions.style.textPosition = "center"; // center, left, right
    
    pOptions.style.textTemplate = "%1%";
    pOptions.style.completeText = "Completed !";

    /* or it can be used as text message :
    pOptions.style.textTemplate = "UCPROCESS.ROWS";
    pOptions.style.completeText = "UCPROCESS.COMPLETE"; 
    */
     
    // Process/Job name used in a replace string %0
    pOptions.progress.displayName = "Custom job name";
     
    return pOptions;
}