@baianat/dropper
v0.0.1
Published
A drag and drop file upload library that it friendly and fun to use. It offers great accessibility, validation and a smooth user experience.
Downloads
5
Readme
Dropper (wip) 🐛
A drag and drop file upload library that it friendly and fun to use. It offers great accessibility, validation and a smooth user experience.
Getting Started
Installation
You can install dropper
using npm
npm install @baianat/dropper
# or using yarn
yarn add @baianat/dropper
Include necessary files
<head>
<link rel="stylesheet" href="dist/css/dropper.css">
</head>
<body>
...
<script type="text/javascript" src="dist/js/dropper.js"></script>
</body>
Make it work
You need a form element to bind dropper
to it.
<form class="dropper" id="dropper"></form>
Then create new dropper
instance, you have to path the uploading url to it
let dropper = new Dropper('#dropper', {
url: `${server}/upload`
});
Events Listeners
dropper
comes with may events that helps you to track file uploading and status
| event name | description |
|-----------------|-----------------------------------------|
| uploadFailed
| emits when a file uploaded successfully |
| uploadSuccees
| emits when a file failed to upload |
| fileDeleted
| emits when an uploaded file deleted |
dropper.on('uploadFailed', ($file) => {
console.log('😭', $file.name, 'uploading failed');
});
License
Copyright (c) 2017 Baianat