Fakeprogress

Simulate smooth progression easily and combine real progression and fake progression.

Install

npm install fake-progress

Basic example

1var FakeProgress = require("fake-progress");
2
3// Create the fake progress with a timeConstant of 10 seconds
4// it means that :
5//  after 10 seconds, progress will be 0.6321 ( = 1-Math.exp(-1) )
6//  after 20 seconds, progress will be 0.8646 ( = 1-Math.exp(-2) )
7//  and so one
8var p = new FakeProgress({
9	timeConstant : 10000,
10	autoStart : true
11});
12
13var exampleAsyncFunction = function(callback){
14	setTimeout(function(){
15		callback()
16	},30000)
17};
18
19var onEachSecond = function(){
20	console.log("Progress is "+(p.progress*100).toFixed(1)+" %");
21};
22
23var interval = setInterval(onEachSecond, 1000);
24
25var onEnd = function(){
26	p.end();
27	clearInterval(interval);
28	console.log("Ended. Progress is "+(p.progress*100).toFixed(1)+" %")
29};
30
31exampleAsyncFunction(onEnd);

will print

Progress is 8.6 %
Progress is 17.3 %
Progress is 25.2 %
Progress is 32.3 %
...

The chart of progression over time.

Until the end is triggered, the progression is following the exponential curve, once "end" is triggered, progression goes to 100%.

More complex

In this example we will mix 3 functions, A and C are classical async functions, B is an async function with a 'real' callback.

Create 2 async function a, c

a and c are 2 basic async functions without progress.

1const a = function (cb) {
2	setTimeout(() => {
3		cb();
4	}, 1000);
5};
6
7const c = function (cb) {
8	setTimeout(() => {
9		cb();
10	}, 3000);
11};

Create a class for event emitter with linear progress

b will be an instance of an event emmiter that has a progress event

1const B = function () {
2	EventEmitter.call(this);
3
4	let count = 0;
5	const self = this;
6	const totalCount = 30;
7	self.emit('start', count / totalCount);
8	self._intervalId = setInterval(() => {
9		count++;
10		if (count >= totalCount) {
11			self.emit('end', count / totalCount);
12			clearInterval(self._intervalId);
13		} else {
14			self.emit('progress', count / totalCount);
15		}
16	}, 100);
17};
18
19util.inherits(B, EventEmitter);

Create a fake progress and log his value over time

1const p = new FakeProgress({});
2
3const onEachDeciSecond = function () {
4	console.log('Progress is ' + (p.progress * 100).toFixed(1) + ' %');
5};
6
7onEachDeciSecond();
8
9const interval = setInterval(onEachDeciSecond, 100);

Create sub progress bar of p, for a progress

A has no progress so we fake his progress. A succeed in 1000 ms, so we can consider 500 ms is a good timeConstant.

1const aProgress = p.createSubProgress({
2	timeConstant: 500,
3	end: 0.3,
4	autoStart: true
5});

Call async chain

Each time on the async chain, subProgress.stop() then call createSubProgress() to create a new subProgress.

1a(err => {
2	if (err) {
3		throw (err);
4	}
5	aProgress.stop();
6	const bProgress = p.createSubProgress({
7		end: 0.8
8	});
9	const b = new B();
10
11	b.on('progress', progress => {
12		bProgress.setProgress(progress);
13	});
14
15	b.on('end', () => {
16		bProgress.stop();
17		const cProgress = p.createSubProgress({
18			timeConstant: 1000,
19			autoStart: true
20		});
21		c(() => {
22			cProgress.end();
23			onEachDeciSecond();
24			clearInterval(interval);
25		});
26	});
27});

Call everything

After each call, stop previous sub, and create a new subProgress for next request.

1a(function(){
2	aProgress.stop();
3	var bProgress = p.createSubProgress({
4		end : 0.8
5	});
6	var b = new B();
7
8	b.on('progress', function(progress){
9		bProgress.setProgress(progress);
10	});
11
12	b.on('end', function(){
13		bProgress.stop();
14		var cProgress = p.createSubProgress({
15			timeConstant : 1000,
16			autoStart : true
17		});
18		c(function(){
19			cProgress.end()
20			onEachDeciSecond()
21			clearInterval(interval);
22		})
23	});
24});

All together

see source

Results

Documentation

See inside the code, documentated using JSDoc