@harikulendran/filterjs v1.2.0

FilterJS

An image filtering library built on top of Jimp incorporating much of the image manipulation functionality of CamanJS including the preset filters implemented therein.

As with Jimp, supports: jpeg, png, bmp, tiff, gif.

Installation

npm install --save @harikulendran/filterjs

Basic Usage

var FJS = new FilterJS();
var filteredBase64 = await FJS.apply(inputBase64, {name:'filterName'});
var filteredBase64 = await FJS.apply(inputPath, {name:'filterName'}, "path");

Apply a filter 'filterName' to an image, either from a path or from a base 64 representation and return a promise for the base 64 representation of the filtered image.

Custom Filters

Custom filters can be passed to the apply method like so:

var filter = {
	name: 'customFilterName', //Name must not clash with existing filters
	instructions: [
		...
	]
};

Instructions

Instructions are made up of layers and functions, layers allow you to composite multiple lists of functions onto each other, and functions modify image data. For example a basic filter that increases brightness would be defined as:

var brightenFilter = {
	name: 'brightenFilter',
	instructions: 
		{ layer:'base', idx:0, blend:'', instructions: [
			{ apply:'brightness', params:[0.5] } //Parameters must be enclosed in an array
		]}
	]
};

Layers

A layer is comprised of a type, an index, and blend mode and a set of instructions, the types are defined as such:

layer: 'base'  <- the base image, onto which all layers are composited
       'clone' <- a layer created by cloning another layer (specified in the cl param)
       'blank' <- a blank layer

The index, idx is used to define the order of the layers. An additional cl parameter is given when creating a clone layer, this is to let FilterJS know which layer to clone from.

The supported blend modes are from Jimp and can be found here.

Supported Instructions

The instructions argument takes a list of functions to apply to the layer, all of the Jimp operations are support (listed here), and are converted into the correct syntax as such:

image.posterize( n );             => { apply:'posterize', params:[n] }

image.color([                        { apply:'color', params: [
	{ apply: 'red', params:[10] } =>     { apply: 'red', params:[10] }
]);                                  ]}

On top of these functions, FilterJS also supports/overrides the following:

//Adjust the gamma
{apply:'gamma', params:[amt]}

//Apply curves, clipped at max and min, and applied to the selected channels
{apply:'curves', params:[start, c1, c2, end, min, max, ch]}

//Adjust the exposure
{apply:'exposure', params:[amt]}

//Add noise with the given strength
{apply:'noise', params:[amt]}

//Adjust the vibrance
{apply:'vibrance', params:[amt]}

//Sharpen the image
{apply:'sharpen', params:[amt]}

//Apply a vignette to the given percentage of the given strength
{apply:'vignette', params:[p, str]}

//Apply sepia
{apply:'sepia', params:[amt]}

//Colorise the image
{apply:'colorise', params:[amt]}

//Fill the image with a given colour
{apply:'fill', params:[rgb]}

//Clip the image on both extremes by the given amount
{apply:'clip', params:[amt]}

Preset Filters

FilterJS supports all the preset filters implemented in CamanJS:

• Vintage
• Lomo
• Clarity
• Sin City
• Sunrise
• Cross Process
• Orange Peel
• Love
• Grungy
• Jarques
• Pinhole
• Old Boot
• Glowing Sun
• Hazy Days
• Her Majesty
• Nostalgia
• Hemingway
• Concentrate