JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 11
  • Score
    100M100P100Q42978F
  • License MIT

Generate data to create blur up effect when uploading through Uppy.

Package Exports

  • uppy-blur-up

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (uppy-blur-up) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

uppy-blur-up

Uppy logo: a superman puppy in a pink suit

Build Status

Uppy plugin that generates data to create the “blur up” technique popularized by Medium and Facebook where a small 20px wide version of the image is shown as a placeholder until the actual image is downloaded.

The relevant data is added to the file's metadata.

This plugin is not part of Uppy but inherits a lot from @uppy/thumbnail-generator. The original idea is inspired from gatsby-remark-image.

It is currently maintained by Arthur Puyou with support from Fotokorner.

Example

const Uppy = require('@uppy/core');
const BlurUp = require('uppy-blur-up');

const uppy = Uppy();
uppy.use(BlurUp);

uppy.on('blurup:generated', (file, data) => {
  console.log(`Blurup data generated for ${file.id}`, data);
});

Installation

$ npm install uppy-blur-up --save

We recommend installing from npm and then using a module bundler such as Webpack, Browserify or Rollup.js.

License

The MIT License.