blurhash-map's Introduction

blurhash-map

blurhash-map

Install

npm install blurhash-map

Usage

// Generate hash-map for all images in a directory
import { BlurHashMap, BlurHashMapConfig } from 'blurhash-map';

const options: BlurHashMapConfig = {
  assetsRoot: 'assets',
  imageExtensions: ['jpg', 'jpeg'],
  components: { x: 4, y: 3 },
  targetJson: 'assets/test-map.json',
};
const blurHashGenerator = new BlurHashMap(options);

return blurHashGenerator.init().then(() => {
  // Now, there should be files created next to images
  // with the same name but having `.hash` suffix. You should commit these files
  // to avoid re-generate them next time you run `BlurHashMap`.
  console.log(
    `
    - Blurhash for all files at: ${options.assetsRoot} created.
    - Generated hash-map saved here as ${target.targetJson}
    `
  );
});

API

BlurHashMap(config)

config

Type: BlurHashMapConfig

param	type	required	description
assetsRoot	string	yes	Where to find the images
hashMapJsonPath	string	yes	Where to save generated JSON
imageExtensions	Array	no	Define which image files. Default : 'jpg' \| 'jpeg' \| 'png' \| 'bmp' \| 'webp'
components	Object { x: number; y: number }	no	Optional between 1-9. Default {x:4,y:3}. Higher is more detailed blur but longer string
targetJson	string	no	Path to save generated json file. Default: `<root>./hashmap\.json`

Run as npm script with params:

scripts:{
  "blurhash-watch":"blurhash-map -a \"assets/images\" -e \"jpg,jpeg,bmp\" -x 4 -x 3 -t \"assets/hashmap.json\""
}

Run as npm script with config file:

create a config file called blurhash-maprc.js at the root of your project.

module.exports = {
  assetsRoot: 'assets/images',
  components: { x: 4, y: 3 },
  extensions:['jpg','jpeg','bmp']
  targetJson: 'assets/images/hashmap.json',
};

And then add a script to your package.json file

scripts:{
  "blurhash-watch":"blurhash-map"
}

init()

Initialize BlurHashMap asynchronously. Creates .hash files and generates hash-map.json.

generateOrDelete(imageOrHashFilePath: string, skipIfHasHash = false)

Generates a hash file if image is found. If Image is not found, deletes the .hash file of it.

getShortPath(file: string): string

Returns the relative path of the given file to the assetsRoot

async createJson(): Promise

Creates hash-map.json from the found .hash files

blurhash-map's People

Contributors

Watchers

blurhash-map's Issues

Add examples for testing and documentation

Feature Request

Is your feature request related to a problem? Please describe.

Describe the solution you'd like

Describe alternatives you've considered

Are you willing to resolve this issue by submitting a Pull Request?

Yes, I have the time, and I know how to start.
Yes, I have the time, but I don't know how to start. I would need guidance.
No, I don't have the time, although I believe I could do it if I had the time...
No, I don't have the time and I wouldn't even know how to start.

Recommend Projects