image-filter-sepia - npm Package Compare versions

Comparing version 0.0.6 to 1.0.0

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: {

package.json

 {
   "name": "image-filter-sepia",
-  "version": "0.0.6",
-  "description": "Small library to apply a sepia filter to a image",
+  "version": "1.0.0",
+  "description": "Small library to apply a sepia 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",
@@ -23,3 +24,3 @@ "codecov": "cat coverage/*/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js",
     "image",
-    "image-sepia",
+    "image-filter-sepia",
     "filter",
@@ -34,9 +35,7 @@ "filters",
   "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",
@@ -56,10 +55,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"
   }
 }

README.md

 ![build status](https://travis-ci.org/canastro/image-filter-sepia.svg?branch=master)
 [![npm version](https://badge.fury.io/js/image-filter-sepia.svg)](https://badge.fury.io/js/image-filter-sepia)
+[![codecov](https://codecov.io/gh/canastro/image-filter-sepia/branch/master/graph/badge.svg)](https://codecov.io/gh/canastro/image-filter-sepia)
 
-# image-sepia
+# image-filter-sepia
 
-Small library to apply a sepia transformation to a image.
+Small library to apply a sepia transformation to a image relying on `image-filter-core` handle the transformation and distribute work with webworkers.
 
+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-sepia](https://www.npmjs.com/package/image-filter-sepia)
+* [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
@@ -17,15 +29,13 @@
 
-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 imageFilterSepia = require('image-sepia');
+var imageSepia = require('image-sepia');
+var nWorkers = 4;
 
-var result = imageFilterSepia({
-    data: IMAGE_DATA,
-    asDataURL: true //if you want data to data transformation you don't need to include this
-});
+imageSepia(IMAGE_DATA, 4);
 ```
 
-# Frequent questions:
+## Frequent questions:
 ### How can I get image data from a image tag?
@@ -52,11 +62,12 @@
 ```js
-var result = imageFilterSepia({
-    data: IMAGE_DATA
-});
+var imageFilterCore = require('image-filter-core');
+var nWorkers = 4;
 
-var image = document.createElement('img');
-image.setAttribute('src', result);
-
-var target = document.getElementById('#dummy-target');
-target.appendChild(image);
+imageSepia(IMAGE_DATA, nWorkers)
+    .then(function (result) {
+        // result === ImageData object
+        var image = document.createElement('img');
+        image.setAttribute('src', imageFilterCore.convertImageDataToCanvasURL(imageData));
+        target.appendChild(image);
+    });
 ```

sandbox/sandbox.js

@@ -1,11 +0,8 @@
-import imageSepia from '../src/index';
+var imageFilterCore = require('image-filter-core');
+var imageSepia = 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,26 +12,19 @@ }
 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);
 
-        imageSepia({
-            data: data
-        }).then((results) => {
-            applyResults('#target-1', results);
-        });
+        imageSepia(data)
+            .then(function (results) {
+                applyResults('#target-1', canvas, context, results);
+            });
+    };
 
-        imageSepia({
-            data: data
-        }).then((results) => {
-            applyResults('#target-2', results);
-        });
-    };
     img.src = 'dummy.jpg';
 };

src/index.js

@@ -1,38 +0,16 @@
-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 sepia
+ * @param {ImageData} data - data of a image extracted from a canvas
+ * @param {Number} nWorkers - number of workers
+ * @returns {Promise}
  */
-export default function contrastImage(options) {
-    if (!options.data) {
+module.exports =  function sepia(data, nWorkers) {
+    if (!data) {
         throw new Error('image-filter-sepia:: invalid options provided');
     }
 
-    const nWorkers = options.nWorkers || 4;
-    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,
-        null,
-        blockSize,
-        segmentLength
-    );
-}
+    return imageFilterCore.apply(data, transform, nWorkers);
+};

tests/index-spec.js

@@ -1,13 +0,12 @@
-import sinon from 'sinon';
-import { expect } from 'chai';
-import * as utils from 'image-filter-core';
-import imageSepia from '../src/index';
-import 'babel-polyfill';
+const sinon = require('sinon');
+const expect = require('chai').expect;
+const imageFilterCore = require('image-filter-core');
+const imageFilterSepia = 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,33 @@ 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 = () => {
-            imageSepia({});
-        };
+    context('when no data is provided', function () {
+        it('should throw error by missing parameters', function () {
+            function fn() {
+                imageFilterSepia();
+            };
 
-        expect(fn).to.throw(/image-filter-sepia:: invalid options provided/);
+            expect(fn).to.throw(/image-filter-sepia:: invalid options provided/);
+        });
     });
 
-    it.skip('should apply transformation and return as imageData', () => {
-        var imageData = {
-            data: [193, 219, 242, 255]
-        };
+    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]
+            };
 
-        // const expectedData = {
-        //     data: [224.34440379022422, 262.88216530631394, 296.9732620320856, 255]
-        // };
+            sandbox.stub(imageFilterCore, 'apply', function () { return Promise.resolve(); });
 
-        imageSepia({
-            data: imageData,
-            brightness: 50
-        }).then((result) => {
-            console.log(result);
+            imageFilterSepia(imageData, { adjustment: 10 }, 4)
+                .then(function (result) {
+                    expect(imageFilterCore.apply.calledOnce).to.equal(true);
+                    done();
+                });
         });
     });
 });

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

63084

increased by2.68%

Dependency count

1

decreased by-50%

Dev dependency count

17

decreased by-10.53%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

72

increased by18.03%

Worsened metrics

Number of package files

17

decreased by-10.53%

Lines of code

206

decreased by-27.97%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removedbabel-preset-es2015@^6.5.0

• - Removedansi-regex@2.1.1(transitive)

• - Removedansi-styles@2.2.1(transitive)

• - Removedbabel-code-frame@6.26.0(transitive)

• - Removedbabel-helper-call-delegate@6.24.1(transitive)

• - Removedbabel-helper-define-map@6.26.0(transitive)

• - Removedbabel-helper-function-name@6.24.1(transitive)

• - Removedbabel-helper-get-function-arity@6.24.1(transitive)

• - Removedbabel-helper-hoist-variables@6.24.1(transitive)

• - Removedbabel-helper-optimise-call-expression@6.24.1(transitive)

• - Removedbabel-helper-regex@6.26.0(transitive)

• - Removedbabel-helper-replace-supers@6.24.1(transitive)

• - Removedbabel-messages@6.23.0(transitive)

• - Removedbabel-plugin-check-es2015-constants@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-arrow-functions@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-block-scoped-functions@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-block-scoping@6.26.0(transitive)

• - Removedbabel-plugin-transform-es2015-classes@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-computed-properties@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-destructuring@6.23.0(transitive)

• - Removedbabel-plugin-transform-es2015-duplicate-keys@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-for-of@6.23.0(transitive)

• - Removedbabel-plugin-transform-es2015-function-name@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-literals@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-modules-amd@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-modules-commonjs@6.26.2(transitive)

• - Removedbabel-plugin-transform-es2015-modules-systemjs@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-modules-umd@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-object-super@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-parameters@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-shorthand-properties@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-spread@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-sticky-regex@6.24.1(transitive)

• - Removedbabel-plugin-transform-es2015-template-literals@6.22.0(transitive)

• - Removedbabel-plugin-transform-es2015-typeof-symbol@6.23.0(transitive)

• - Removedbabel-plugin-transform-es2015-unicode-regex@6.24.1(transitive)

• - Removedbabel-plugin-transform-regenerator@6.26.0(transitive)

• - Removedbabel-plugin-transform-strict-mode@6.24.1(transitive)

• - Removedbabel-preset-es2015@6.24.1(transitive)

• - Removedbabel-runtime@6.26.0(transitive)

• - Removedbabel-template@6.26.0(transitive)

• - Removedbabel-traverse@6.26.0(transitive)

• - Removedbabel-types@6.26.0(transitive)

• - Removedbabylon@6.18.0(transitive)

• - Removedchalk@1.1.3(transitive)

• - Removedcore-js@2.6.12(transitive)

• - Removeddebug@2.6.9(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedesutils@2.0.3(transitive)

• - Removedglobals@9.18.0(transitive)

• - Removedhas-ansi@2.0.0(transitive)

• - Removedinvariant@2.2.4(transitive)

• - Removedjs-tokens@3.0.2(transitive)

• - Removedjsesc@0.5.0(transitive)

• - Removedlodash@4.17.21(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedms@2.0.0(transitive)

• - Removedprivate@0.1.8(transitive)

• - Removedregenerate@1.4.2(transitive)

• - Removedregenerator-runtime@0.11.1(transitive)

• - Removedregenerator-transform@0.10.1(transitive)

• - Removedregexpu-core@2.0.0(transitive)

• - Removedregjsgen@0.2.0(transitive)

• - Removedregjsparser@0.1.5(transitive)

• - Removedstrip-ansi@3.0.1(transitive)

• - Removedsupports-color@2.0.0(transitive)

• - Removedto-fast-properties@1.0.3(transitive)

• Updatedimage-filter-core@^2.0.0