New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

image-filter-brightness

Package Overview
Dependencies
Maintainers
1
Versions
5
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

image-filter-brightness - npm Package Compare versions

Comparing version

0.0.4
to
1.0.0

contributing.json
src/transform.js
tests/transform-spec.js

4

karma.conf.js
var istanbul = require('istanbul');
var bistanbul = require('browserify-babel-istanbul');
var babelify = require('babelify');
var bistanbul = require('browserify-istanbul');

@@ -45,3 +44,2 @@ module.exports = function (config) {

transform: [
babelify,
bistanbul({

@@ -48,0 +46,0 @@ instrumenterConfig: {

21

package.json
{
"name": "image-filter-brightness",
"version": "0.0.4",
"version": "1.0.0",
"description": "Small library to apply a brightness transformation to a image",
"main": "src/index.js",
"scripts": {
"build": "browserify -t babelify sandbox/sandbox.js > sandbox/bundle.js",
"eslint": "eslint src/**/*.js",
"build": "npm run eslint && browserify sandbox/sandbox.js > sandbox/bundle.js",
"test": "./node_modules/.bin/karma start",

@@ -33,9 +34,7 @@ "codecov": "cat coverage/*/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js",

"devDependencies": {
"babel-polyfill": "^6.9.0",
"babelify": "^7.2.0",
"browserify": "^13.0.0",
"browserify-babel-istanbul": "^0.4.0",
"browserify": "^13.1.1",
"browserify-istanbul": "^2.0.0",
"chai": "^3.5.0",
"codecov.io": "^0.1.6",
"eslint": "^3.12.2",
"eslint": "^3.13.0",
"http-server": "^0.9.0",

@@ -55,10 +54,4 @@ "istanbul": "^0.4.3",

"dependencies": {
"babel-preset-es2015": "^6.5.0",
"image-filter-core": "latest"
},
"browserify": {
"transform": [
"babelify"
]
"image-filter-core": "^2.0.0"
}
}

48

README.md
![build status](https://travis-ci.org/canastro/image-filter-brightness.svg?branch=master)
[![npm version](https://badge.fury.io/js/image-filter-brightness.svg)](https://badge.fury.io/js/image-filter-brightness)
[![codecov](https://codecov.io/gh/canastro/image-filter-brightness/branch/master/graph/badge.svg)](https://codecov.io/gh/canastro/image-filter-brightness)
# image-filter-brightness
Small library to apply a brightness transformation to a image.
Small library to apply a brightness transformation to a image relying on `image-filter-core` handle the transformation and distribute work with webworkers.
# Install
Other related modules:
* [image-filter-core](https://www.npmjs.com/package/image-filter-core)
* [image-filter-contrast](https://www.npmjs.com/package/image-filter-contrast)
* [image-filter-grayscale](https://www.npmjs.com/package/image-filter-grayscale)
* [image-filter-threshold](https://www.npmjs.com/package/image-filter-threshold)
* [image-filter-sepia](https://www.npmjs.com/package/image-filter-sepia)
* [image-filter-invert](https://www.npmjs.com/package/image-filter-invert)
* [image-filter-gamma](https://www.npmjs.com/package/image-filter-gamma)
* [image-filter-colorize](https://www.npmjs.com/package/image-filter-colorize)
* [image-filters](https://www.npmjs.com/package/image-filters)
## Install
```

@@ -14,17 +26,15 @@ npm install image-filter-brightness --save

# Usage
## Usage
It applies a brightness transformation to a base64 image. If you want a more complete library, please check image-filters that wraps this and other libraries to provide a more complete suite of image filters.
The default operation of this library is to consume imageData and return transformed imageData, but to facilitate a bit you can pass `asDataURL` as true to return a dataURL that you can inject into a image tag.
This library consumes ImageData and outputs ImageData in a Promise. You can use `image-filter-core` to convert from ImageData to dataURL.
JS file:
```js
var imageBrightness = require('image-filter-brightness');
var imageBrightness = require('image-brightness');
imageBrightness({
data: IMAGE_DATA,
adjustment: 30
});
imageBrightness(IMAGE_DATA, { adjustment: 30 });
```
# Frequent questions:
## Frequent questions:
### How can I get image data from a image tag?

@@ -51,12 +61,10 @@

```js
imageBrightness({
data: IMAGE_DATA,
adjustment: 30
}).then(function (result) {
var image = document.createElement('img');
image.setAttribute('src', result);
var target = document.getElementById('#dummy-target');
target.appendChild(image);
});
var imageFilterCore = require('image-filter-core');
imageBrightness(IMAGE_DATA, { adjustment: 30 })
.then(function (result) {
// result === ImageData object
var image = document.createElement('img');
image.setAttribute('src', imageFilterCore.convertImageDataToCanvasURL(imageData));
target.appendChild(image);
});
```

47

sandbox/sandbox.js

@@ -1,11 +0,8 @@

import imageBrightness from '../src/index';
var imageFilterCore = require('image-filter-core');
var imageBrightness = require('../src/index');
function applyResults(selector, src) {
var target;
var image;
target = document.querySelectorAll(selector)[0];
image = document.createElement('img');
image.setAttribute('src', src);
function applyResults(selector, canvas, context, src) {
var target = document.querySelectorAll(selector)[0];
var image = document.createElement('img');
image.setAttribute('src', imageFilterCore.convertImageDataToCanvasURL(src));
target.appendChild(image);

@@ -15,28 +12,24 @@ }

window.onload = function () {
const img = new Image;
img.onload = () => {
const canvas = document.createElement('canvas');
var img = new Image;
img.onload = function () {
var canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
const context = canvas.getContext('2d');
var context = canvas.getContext('2d');
context.drawImage(img, 0, 0);
const data = context.getImageData(0, 0, img.width, img.height);
var data = context.getImageData(0, 0, img.width, img.height);
imageBrightness({
data: data,
adjustment: 30
}).then((results) => {
applyResults('#target-1', results);
});
imageBrightness(data, { adjustment: 30 })
.then(function (results) {
applyResults('#target-1', canvas, context, results);
});
imageBrightness({
data: data,
adjustment: 70
}).then((results) => {
applyResults('#target-2', results);
});
imageBrightness(data, { adjustment: 70 })
.then(function (results) {
applyResults('#target-2', canvas, context, results);
});
};
img.src = 'dummy.jpg';
};

47

src/index.js

@@ -1,41 +0,18 @@

import worker from './worker';
import { apply, getCanvas } from 'image-filter-core';
var imageFilterCore = require('image-filter-core');
var transform = require('./transform');
/**
* @name contrastImage
* @param {object} options
* @param {string} options.data - data of a image extracted from a canvas
* @param {string} options.contrast - contrast value to apply
* @param {string} options.nWorkers - number of workers
* @param {bool} options.asDataURL
* @returns {promise}
* @name brightness
* @param {ImageData} data - data of a image extracted from a canvas
* @param {Object} options - options to pass to the transformation function
* @param {Number} [options.adjustment] - adjustment to apply in the transformation
* @param {Number} nWorkers - number of workers
* @returns {Promise}
*/
export default function contrastImage(options) {
if (!options.data || !options.adjustment) {
module.exports = function brightness(data, options, nWorkers) {
if (!data || !options || !options.adjustment) {
throw new Error('image-filter-brightness:: invalid options provided');
}
const nWorkers = options.nWorkers || 4;
const params = {
adjustment: options.adjustment
};
const canvas = getCanvas(options.data.width, options.data.height);
const context = canvas.getContext('2d');
// Drawing the source image into the target canvas
context.putImageData(options.data, 0, 0);
const len = canvas.width * canvas.height * 4;
const segmentLength = len / nWorkers; // This is the length of array sent to the worker
const blockSize = canvas.height / nWorkers; // Height of the picture chunck for every worker
return apply(
worker,
nWorkers,
canvas,
context,
params,
blockSize,
segmentLength
);
}
return imageFilterCore.apply(data, transform, options, nWorkers);
};

81

tests/index-spec.js

@@ -1,13 +0,12 @@

import sinon from 'sinon';
import { expect } from 'chai';
import * as utils from 'image-filter-core';
import imageBrightness from '../src/index';
import 'babel-polyfill';
const sinon = require('sinon');
const expect = require('chai').expect;
const imageFilterCore = require('image-filter-core');
const imageFilterBrightness = require('../src/index');
describe('index', () => {
describe('index', function() {
var sandbox;
var canvas;
var context;
var ctx;
beforeEach(() => {
beforeEach(function() {
// Create a sandbox for the test

@@ -17,3 +16,3 @@ sandbox = sinon.sandbox.create();

afterEach(() => {
afterEach(function() {
// Restore all the things made through the sandbox

@@ -23,4 +22,4 @@ sandbox.restore();

beforeEach(() => {
context = {
beforeEach(function() {
ctx = {
getImageData: sandbox.stub(),

@@ -33,32 +32,54 @@ putImageData: sandbox.stub()

height: 150,
getContext: sandbox.stub().returns(context)
getContext: sandbox.stub().returns(ctx)
};
sandbox.stub(utils, 'getCanvas').returns(canvas);
sandbox.stub(imageFilterCore, 'getCanvas').returns(canvas);
});
it('should throw error by missing parameters', () => {
const fn = () => {
imageBrightness({});
};
context('when no data is provided', function () {
it('should throw error by missing parameters', function () {
function fn() {
imageFilterBrightness();
};
expect(fn).to.throw(/image-filter-brightness:: invalid options provided/);
expect(fn).to.throw(/image-filter-brightness:: invalid options provided/);
});
});
it.skip('should apply transformation and return as imageData', () => {
var imageData = {
data: [193, 219, 242, 255]
};
// const expectedData = {
// data: [224.34440379022422, 262.88216530631394, 296.9732620320856, 255]
// };
context('when no options are provided', function () {
it('should throw error by missing parameters', function () {
function fn() {
imageFilterBrightness({});
};
imageBrightness({
data: imageData,
brightness: 50
}).then((result) => {
console.log(result);
expect(fn).to.throw(/image-filter-brightness:: invalid options provided/);
});
});
context('when no brightness is provided', function () {
it('should throw error by missing parameters', function () {
function fn() {
imageFilterBrightness({}, {});
};
expect(fn).to.throw(/image-filter-brightness:: invalid options provided/);
});
});
context('when all required parameters are provided', function () {
it('should apply transformation and return as imageData', function (done) {
var imageData = {
data: [193, 219, 242, 255]
};
sandbox.stub(imageFilterCore, 'apply', function () { return Promise.resolve(); });
imageFilterBrightness(imageData, { adjustment: 10 }, 4)
.then(function (result) {
expect(imageFilterCore.apply.calledOnce).to.equal(true);
done();
});
});
});
});
.babelrc
src/brightness.js
src/worker.js
tests/brightness-spec.js
tests/worker-spec.js
.eslintrc

Sorry, the diff of this file is not supported yet

.travis.yml

Sorry, the diff of this file is not supported yet