Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@baianat/dropper

Package Overview
Dependencies
Maintainers
2
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@baianat/dropper

A drag and drop file upload library that it friendly and fun to use. It offers great accessibility, validation and a smooth user experience.

  • 0.0.1
  • latest
  • npm
  • Socket score

Version published
Maintainers
2
Created
Source

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 namedescription
uploadFailedemits when a file uploaded successfully
uploadSucceesemits when a file failed to upload
fileDeletedemits when an uploaded file deleted
dropper.on('uploadFailed', ($file) => {
  console.log('😭', $file.name, 'uploading failed');
});

License

MIT

Copyright (c) 2017 Baianat

FAQs

Package last updated on 13 Sep 2018

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc