Progress Bar

Description

The ProgressBar class manages a visual progress bar and supports two operating modes: Managed mode, using application callbacks, and Autonomous mode, using a RequestManager to poll a target URL automatically.

Parameters

Parameter	Type	Description
`updateCallback`	Function	Optional. Called periodically to fetch progress data (managed mode).
`completeCallback`	Function	Optional. Called when progress reaches 100%.
`requestManager`	Object	Optional. Instance of `RequestManager` for autonomous mode.
`targetUrl`	string	Optional. URL to send POST requests to when in autonomous mode.
`intervalMs`	number	Optional. Refresh interval in milliseconds. Default is 1500.

Behavior

Calls updateCallback or RequestManager.send_post_request() every interval.
Updates DOM elements #percent_progress, #progress_text, #progress_header.
Stops when percent >= 100, then calls completeCallback.

Example usage

// Example: managed mode
const bar = new ProgressBar({
  updateCallback: async () => ({ percent: 50, text: 'Halfway', header: 'Demo' }),
  completeCallback: () => console.log('Done!')
});
bar.start();

Requirements

DOM elements with IDs percent_progress, progress_text, progress_header.
A RequestManager instance or update callback.

Demo

Managed mode

Managed header

Managed text...

Autonomous mode

Autonomous header

Autonomous text...

Notes

The ProgressBar class is reusable across Whakerexa applications. It does not depend on any specific UI context. The same instance can operate either through callbacks (managed) or through network polling (autonomous) with a configured RequestManager.