uppy/packages/@uppy/progress-bar
Nico Jones 3ebe9a91be
Hide Progressbar if no upload in progress (#2252)
* 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)
2020-05-07 16:37:39 +02:00
..
src Hide Progressbar if no upload in progress (#2252) 2020-05-07 16:37:39 +02:00
types Actually check types (#1918) 2020-02-12 16:22:09 +01:00
LICENSE Move ProgressBar plugin to @uppy/progress-bar 2018-06-14 20:06:19 -04:00
package.json Release 2020-04-30 12:52:46 +01:00
README.md docs: update webpack homepage URLs 2019-03-04 13:43:37 +01:00

@uppy/progress-bar

Uppy logo: a superman puppy in a pink suit

Build Status

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.

License

The MIT License.