Skip to content

Commit 49acc27

Browse files
committed
Deprecate .status in favor of .getPercent()
1 parent cf83fd2 commit 49acc27

File tree

3 files changed

+83
-48
lines changed

3 files changed

+83
-48
lines changed

README.md

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
[![Status](https://api.travis-ci.org/rstacruz/nprogress.svg?branch=master)](http://travis-ci.org/rstacruz/nprogress)
44
[![npm version](https://img.shields.io/npm/v/nprogress.png)](https://npmjs.org/package/nprogress "View this project on npm")
5-
[![jsDelivr Hits](https://data.jsdelivr.com/v1/package/npm/nprogress/badge?style=rounded)](https://www.jsdelivr.com/package/npm/nprogress)
5+
[![jsDelivr hits](https://data.jsdelivr.com/v1/package/npm/nprogress/badge?style=rounded)](https://www.jsdelivr.com/package/npm/nprogress)
66

77
> Minimalist progress bar
88
@@ -167,7 +167,11 @@ do anything if _.start()_ isn't called)
167167
NProgress.done(true);
168168
```
169169

170-
**Get the status value:** To get the status value, use `.status`.
170+
**Get the current percentage:** Use `getPercent()` to get the current value.
171+
172+
```js
173+
console.log(NProgress.getPercent());
174+
```
171175

172176
## Configuration
173177

@@ -181,9 +185,7 @@ NProgress.configure({ minimum: 0.1 });
181185

182186
#### `template`
183187

184-
You can change the markup using `template`. To keep the progress
185-
bar working, keep an element with `role='bar'` in there. See the [default template]
186-
for reference.
188+
You can change the markup using `template`. To keep the progress bar working, keep an element with `role='bar'` in there. See the [default template] for reference.
187189

188190
```js
189191
NProgress.configure({
@@ -193,8 +195,7 @@ NProgress.configure({
193195

194196
#### `easing` and `speed`
195197

196-
Adjust animation settings using _easing_ (a CSS easing string)
197-
and _speed_ (in ms). (default: `ease` and `200`)
198+
Adjust animation settings using _easing_ (a CSS easing string) and _speed_ (in ms). (default: `ease` and `200`)
198199

199200
```js
200201
NProgress.configure({ easing: "ease", speed: 500 });

src/nprogress.js

Lines changed: 65 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,31 @@ import {
88
} from "./utilities";
99
import setCSS from "./css";
1010

11-
const NProgress = {};
11+
/**
12+
* The current progress number from 0...1, or `null` if not started.
13+
* @type {number | null}
14+
*/
15+
16+
let status = null;
1217

1318
/**
14-
* Last number.
15-
* @type {null | number}
19+
* Returns the current percentage.
20+
* @return {number | null
1621
*/
1722

18-
NProgress.status = null;
23+
function getPercent() {
24+
return status;
25+
}
26+
27+
/**
28+
* (Internal) sets the percent value.
29+
* This is only used in tests. Please use `set()` instead.
30+
* @param {number} value
31+
*/
32+
33+
function setPercent(value) {
34+
status = value;
35+
}
1936

2037
/**
2138
* @typedef CSSDefinition
@@ -39,6 +56,25 @@ let Settings = {
3956
'<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>',
4057
};
4158

59+
/**
60+
* Default export for CommonJS and for chaining
61+
*/
62+
63+
const NProgress = {
64+
configure,
65+
done,
66+
getPercent,
67+
inc,
68+
isRendered,
69+
isStarted,
70+
remove,
71+
render,
72+
set,
73+
settings: Settings,
74+
start,
75+
trickle: inc,
76+
};
77+
4278
/**
4379
* Updates configuration.
4480
*
@@ -74,7 +110,7 @@ function set(n) {
74110
var started = isStarted();
75111

76112
n = clamp(n, Settings.minimum, 1);
77-
NProgress.status = n === 1 ? null : n;
113+
setPercent(n === 1 ? null : n);
78114

79115
var progress = render(!started),
80116
bar = progress.querySelector(Settings.barSelector),
@@ -121,7 +157,7 @@ function set(n) {
121157
}
122158

123159
function isStarted() {
124-
return typeof NProgress.status === "number";
160+
return typeof getPercent() === "number";
125161
}
126162

127163
/**
@@ -132,12 +168,12 @@ function isStarted() {
132168
* NProgress.start();
133169
*/
134170

135-
NProgress.start = function () {
136-
if (!NProgress.status) set(0);
171+
function start() {
172+
if (!getPercent()) set(0);
137173

138174
var work = function () {
139175
setTimeout(function () {
140-
if (!NProgress.status) return;
176+
if (!getPercent()) return;
141177
inc();
142178
work();
143179
}, Settings.trickleSpeed);
@@ -146,7 +182,7 @@ NProgress.start = function () {
146182
if (Settings.trickle) work();
147183

148184
return NProgress;
149-
};
185+
}
150186

151187
/**
152188
* Hides the progress bar.
@@ -162,13 +198,13 @@ NProgress.start = function () {
162198
* @param {boolean | null | void} force
163199
*/
164200

165-
NProgress.done = function (force) {
166-
if (!force && !NProgress.status) return NProgress;
201+
function done(force) {
202+
if (!force && !getPercent()) return NProgress;
167203

168204
inc(0.3 + 0.5 * Math.random());
169205
set(1);
170206
return NProgress;
171-
};
207+
}
172208

173209
/**
174210
* Increments by a random amount.
@@ -178,10 +214,10 @@ NProgress.done = function (force) {
178214
*/
179215

180216
function inc(amount) {
181-
var n = NProgress.status;
217+
var n = getPercent();
182218

183219
if (!n) {
184-
return NProgress.start();
220+
return start();
185221
} else if (n > 1) {
186222
return;
187223
} else {
@@ -205,14 +241,16 @@ function inc(amount) {
205241
}
206242

207243
/**
244+
* Returns the parent node as an HTMLElement.
208245
* @return {HTMLElement}
209246
*/
210247

211-
function getParent() {
248+
function getParentElement() {
212249
if (typeof Settings.parent === "string") {
213250
let parent = document.querySelector(Settings.parent);
214251
if (!parent)
215252
throw new Error(`NProgress: Invalid parent '${Settings.parent}'`);
253+
216254
return parent;
217255
} else {
218256
return Settings.parent;
@@ -240,10 +278,10 @@ function render(fromStart) {
240278
if (!bar)
241279
throw new Error(`NProgress: No bar found for '${Settings.barSelector}'`);
242280

243-
let perc = fromStart ? "-100" : toBarPerc(NProgress.status || 0);
281+
let perc = fromStart ? "-100" : toBarPerc(getPercent() || 0);
244282

245283
/** @type HTMLElement */
246-
let parent = getParent();
284+
let parent = getParentElement();
247285

248286
/** @type HTMLElement | null */
249287
let spinner;
@@ -289,28 +327,24 @@ function isRendered() {
289327
return !!document.getElementById("nprogress");
290328
}
291329

292-
// Default export for commonjs / import NProgress
293-
NProgress.configure = configure;
294-
NProgress.inc = inc;
295-
NProgress.isRendered = isRendered;
296-
NProgress.isStarted = isStarted;
297-
NProgress.remove = remove;
298-
NProgress.render = render;
299-
NProgress.set = set;
300-
NProgress.settings = Settings;
301-
NProgress.trickle = inc;
302-
303-
// Export for ESM
330+
/*
331+
* Export for ESM
332+
*/
333+
304334
export {
305335
configure,
306-
inc,
336+
done,
337+
getPercent,
307338
inc as trickle,
339+
inc,
308340
isRendered,
309341
isStarted,
310342
remove,
311343
render,
312344
set,
345+
setPercent as _setPercent,
313346
Settings as settings,
347+
start,
314348
};
315349

316350
export default NProgress;

src/nprogress.test.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import NProgress from "./nprogress";
1+
import NProgress, { _setPercent } from "./nprogress";
22

33
jest.useFakeTimers();
44

@@ -17,7 +17,7 @@ beforeEach(() => {
1717

1818
afterEach(() => {
1919
remove(qs("#nprogress"));
20-
NProgress.status = null;
20+
_setPercent(null);
2121
Object.assign(NProgress.settings, defaults);
2222
});
2323

@@ -40,17 +40,17 @@ describe("set()", () => {
4040

4141
it("must respect minimum", () => {
4242
NProgress.set(0);
43-
expect(NProgress.status).toEqual(NProgress.settings.minimum);
43+
expect(NProgress.getPercent()).toEqual(NProgress.settings.minimum);
4444
});
4545

4646
it("must clamp to minimum", () => {
4747
NProgress.set(-100);
48-
expect(NProgress.status).toEqual(NProgress.settings.minimum);
48+
expect(NProgress.getPercent()).toEqual(NProgress.settings.minimum);
4949
});
5050

5151
it("must clamp to maximum", () => {
5252
NProgress.set(400);
53-
expect(NProgress.status).toEqual(null);
53+
expect(NProgress.getPercent()).toEqual(null);
5454
});
5555
});
5656

@@ -63,7 +63,7 @@ describe(".start()", function () {
6363

6464
it("must respect minimum", function () {
6565
NProgress.start();
66-
expect(NProgress.status).toEqual(NProgress.settings.minimum);
66+
expect(NProgress.getPercent()).toEqual(NProgress.settings.minimum);
6767
});
6868
});
6969

@@ -120,24 +120,24 @@ describe(".inc()", function () {
120120

121121
it("should start with minimum", function () {
122122
NProgress.inc();
123-
expect(NProgress.status).toEqual(NProgress.settings.minimum);
123+
expect(NProgress.getPercent()).toEqual(NProgress.settings.minimum);
124124
});
125125

126126
it("should increment", function () {
127127
NProgress.start();
128128

129-
let start = NProgress.status;
129+
let start = NProgress.getPercent();
130130
NProgress.inc();
131131

132-
expect(NProgress.status).toBeGreaterThan(start);
132+
expect(NProgress.getPercent()).toBeGreaterThan(start);
133133
});
134134

135135
it("should never reach 1.0", function () {
136136
for (let i = 0; i < 100; ++i) {
137137
NProgress.inc();
138138
}
139139

140-
expect(NProgress.status).toBeLessThan(1);
140+
expect(NProgress.getPercent()).toBeLessThan(1);
141141
});
142142
});
143143

0 commit comments

Comments
 (0)