mirror of
https://github.com/transloadit/uppy.git
synced 2026-07-29 04:50:05 +00:00
* Fixing an error that would prevent the ProgressBar from hiding
Fixing an error that would prevent the ProgressBar from hiding, displaying a `0` in the HTML element .uppy-ProgressBar-inner whenever no files were being uploaded. This fix sets the .uppy-ProgressBar element a class, so the user can decide when to hide it (or what to do)
* Update index.js
improved comment
* removed custom class
* Fixing an error that would prevent the ProgressBar from hiding
`state.totalProgress` is not `100`. It's `0` instead
----------
To reproduce the error:
```
.use(ProgressBar, {
target: '._progress_bar_',
fixed: false,
hideAfterFinish: true
})
```
This will set a `div` inside the `_progress_bar_` element, and this element will be visible, showing `0` to the user.
The problem is that, currently, the bar only hides when `progress === 100`, but that is never true, as `progress` resets to `0` once the upload has been completed.
That means, it is __always__ visible, and only hidden for a brief period after an upload completes (when the `progress === 100`, briefly).
This fix allows the bar to be hidden also when the progress is `0` (after and before uploads)
|
||
|---|---|---|
| .. | ||
| src | ||
| types | ||
| LICENSE | ||
| package.json | ||
| README.md | ||
@uppy/progress-bar
ProgressBar is a minimalist plugin that shows the current upload progress in a thin bar element. Similar to the ones used by YouTube and GitHub when navigating between pages.
Uppy is being developed by the folks at Transloadit, a versatile file encoding service.
Example
const Uppy = require('@uppy/core')
const ProgressBar = require('@uppy/progress-bar')
const uppy = Uppy()
uppy.use(ProgressBar, {
// Options
})
Installation
$ npm install @uppy/progress-bar --save
We recommend installing from npm and then using a module bundler such as Webpack, Browserify or Rollup.js.
Alternatively, you can also use this plugin in a pre-built bundle from Transloadit's CDN: Edgly. In that case Uppy will attach itself to the global window.Uppy object. See the main Uppy documentation for instructions.
Documentation
Documentation for this plugin can be found on the Uppy website.