file-progress
v0.1.2
Published
An extended HTML file input that looks like a progress bar
Readme
file-progress
An extended HTML file input that looks like a progress bar.
Features
- Lightweight, no dependencies.
- Better HTML file input design.
- Has option to upload file via ajax and show progress.
- Use your own implementation for ajax file upload.
Installation
Using npm:
$ npm install file-progressUsing yarn:
$ yarn add file-progressCloning the repo:
$ git clone https://github.com/mrethical/file-progressUsage
...
<body>
<input type="file" id="file-progress-input">
<script type="text/javascript" src="./dist/file-progress.js"></script>
</body>
...const fileProgress = new FileProgress('file-progress-input');If you installed the library via package manager, you can use the library by importing it.
import FileProgress from "file-progress";
const fileProgress = new FileProgress('file-progress-input');Options
| option | type | description | | :------- | :--------------------------------- | :-------------------------------------------------------------- | | url | string | if set, will send selected file to the url via ajax | | upload | function(File, FileProgress): void | function for implementing custom ajax call rather than built in | | label | function(File?): void | function for setting custom label | | onRemove | function(): void | callback when file was cleared/removed |
To set options, provide them at class initialization.
const fileProgress = new FileProgress('file-progress-input', {
url: 'https://example.com/upload'
});Methods
| name | parameters | description | | :------- | :------------------ | :----------------------------------------------------------------- | | progress | percentage (number) | set file progress bar (useful when using own ajax upload function) | | prefill | prefill (label) | update the input label without updating the file | | open | | open file modal | | set | fileList (FileList) | programatically set files of input | | clear | | remove files |
Screenshots
License
This library is open-sourced software licensed under the MIT license.