From da08ae3eaf87c3e18151217ea9aee3aeaca21e40 Mon Sep 17 00:00:00 2001 From: Christoph Oberhofer Date: Tue, 29 Mar 2016 12:08:57 +0200 Subject: [PATCH] Upgrade to webpack 2 and babel 6 --- .babelrc | 33 +++++++++ example/node-test.js | 4 +- karma-integration.conf.js | 24 +++---- karma.conf.js | 38 ++++------ package.json | 47 +++++++++--- plugins/umd.js | 10 +-- src/common/cluster.js | 5 +- src/common/cv_utils.js | 103 ++++++++++++++------------- src/common/image_wrapper.js | 8 ++- src/decoder/bresenham.js | 15 ---- src/input/camera_access.js | 4 +- src/input/frame_grabber.js | 14 ++-- src/locator/barcode_locator.js | 47 ++++++++---- src/locator/skeletonizer.js | 4 +- src/quagga.js | 9 +-- src/reader/i2of5_reader.js | 2 +- tasks/uglyasm.js | 2 +- test/integration/integration.spec.js | 2 +- test/spec/array_helper.spec.js | 2 +- test/spec/barcode_locator.spec.js | 6 +- test/spec/camera_access.spec.js | 2 +- test/spec/cv_utils.spec.js | 34 +++++---- test/spec/events.spec.js | 2 +- test/spec/result_collector.spec.js | 4 +- webpack.config.js | 12 ++-- webpack.config.min.js | 18 ++++- webpack.node.config.js | 13 ++-- 27 files changed, 268 insertions(+), 196 deletions(-) create mode 100644 .babelrc diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..09b5e3c --- /dev/null +++ b/.babelrc @@ -0,0 +1,33 @@ +{ + "plugins": [ + "check-es2015-constants", + "transform-es2015-arrow-functions", + "transform-es2015-block-scoped-functions", + "transform-es2015-block-scoping", + ["transform-es2015-classes", { "loose": true }], + ["transform-es2015-computed-properties", { "loose": true }], + ["transform-es2015-destructuring", { "loose": true }], + ["transform-es2015-for-of", { "loose": true }], + "transform-es2015-function-name", + "transform-es2015-literals", + + "transform-es2015-object-super", + "transform-es2015-parameters", + "transform-es2015-shorthand-properties", + ["transform-es2015-spread", { "loose": true }], + "transform-es2015-sticky-regex", + ["transform-es2015-template-literals", { "loose": true }], + "transform-es2015-unicode-regex", + "transform-es2015-typeof-symbol", + "transform-object-rest-spread", + "lodash" +], +"env": { + "commonjs": { + "plugins": [ + ["transform-es2015-modules-commonjs", { "loose": true }], + "add-module-exports" + ] + } + } +} diff --git a/example/node-test.js b/example/node-test.js index 7ce4b8c..7efbd32 100644 --- a/example/node-test.js +++ b/example/node-test.js @@ -1,4 +1,4 @@ -var Quagga = require('../lib/quagga'); +var Quagga = require('../lib/quagga').default; Quagga.decodeSingle({ src: "../test/fixtures/code_128/image-001.jpg", @@ -18,4 +18,4 @@ Quagga.decodeSingle({ } else { console.log("not detected"); } -}); \ No newline at end of file +}); diff --git a/karma-integration.conf.js b/karma-integration.conf.js index 8791b1a..5bab904 100644 --- a/karma-integration.conf.js +++ b/karma-integration.conf.js @@ -15,23 +15,17 @@ module.exports = function(config) { }, webpack: { module: { - preLoaders: [ - { - test: /\.js$/, - exclude: [ - /node_modules/ - ], - loader: 'babel' - } - ] + loaders: [{ + test: /\.jsx?$/, + exclude: /node_modules/, + loader: 'babel-loader' + }] }, resolve: { - extensions: ['', '.js', '.jsx'], - root: path.resolve(__dirname), - alias: { - 'input_stream$': 'src/input/input_stream', - 'frame_grabber$': 'src/input/frame_grabber' - } + modules: [ + path.resolve('./src/input/'), + 'node_modules' + ] }, plugins: [ new webpack.DefinePlugin({ diff --git a/karma.conf.js b/karma.conf.js index 3f95643..59b26e9 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -14,31 +14,23 @@ module.exports = function(config) { }, webpack: { module: { - preLoaders: [ - { - test: /\.js$/, - exclude: [ - /node_modules/ - ], - loader: 'babel' - }, - { - test: /\.js$/, - include: [ - path.resolve('src') - ], - exclude: /node_modules/, - loader: 'isparta' - } - ] + loaders: [{ + test: /\.jsx?$/, + exclude: [ + path.resolve('node_modules/') + ], + loader: 'babel-loader' + }, { + test: /\.js$/, + include: path.resolve('src'), + loader: 'babel-istanbul' + }] }, resolve: { - extensions: ['', '.js', '.jsx'], - root: path.resolve(__dirname), - alias: { - 'input_stream$': 'src/input/input_stream', - 'frame_grabber$': 'src/input/frame_grabber' - } + modules: [ + path.resolve('./src/input/'), + 'node_modules' + ] }, plugins: [ new webpack.DefinePlugin({ diff --git a/package.json b/package.json index e71d31b..1a010ed 100644 --- a/package.json +++ b/package.json @@ -6,9 +6,34 @@ "browser": "dist/quagga.min.js", "devDependencies": { "async": "^1.4.2", - "babel-core": "^5.8.25", - "babel-eslint": "^4.1.3", - "babel-loader": "^5.3.2", + "babel-cli": "^6.5.1", + "babel-core": "^6.7.4", + "babel-eslint": "^6.0.0", + "babel-istanbul-loader": "^0.1.0", + "babel-loader": "^6.2.4", + "babel-plugin-add-module-exports": "^0.1.2", + "babel-plugin-check-es2015-constants": "^6.3.13", + "babel-plugin-lodash": "^2.2.1", + "babel-plugin-transform-es2015-arrow-functions": "^6.3.13", + "babel-plugin-transform-es2015-block-scoped-functions": "^6.3.13", + "babel-plugin-transform-es2015-block-scoping": "^6.3.13", + "babel-plugin-transform-es2015-classes": "^6.3.13", + "babel-plugin-transform-es2015-computed-properties": "^6.3.13", + "babel-plugin-transform-es2015-destructuring": "^6.3.13", + "babel-plugin-transform-es2015-for-of": "^6.3.13", + "babel-plugin-transform-es2015-function-name": "^6.3.13", + "babel-plugin-transform-es2015-literals": "^6.3.13", + "babel-plugin-transform-es2015-modules-commonjs": "^6.3.13", + "babel-plugin-transform-es2015-object-super": "^6.3.13", + "babel-plugin-transform-es2015-parameters": "^6.3.13", + "babel-plugin-transform-es2015-shorthand-properties": "^6.3.13", + "babel-plugin-transform-es2015-spread": "^6.3.13", + "babel-plugin-transform-es2015-sticky-regex": "^6.3.13", + "babel-plugin-transform-es2015-template-literals": "^6.3.13", + "babel-plugin-transform-es2015-typeof-symbol": "^6.3.13", + "babel-plugin-transform-es2015-unicode-regex": "^6.3.13", + "babel-plugin-transform-object-rest-spread": "^6.5.0", + "babel-plugin-transform-regenerator": "^6.3.13", "chai": "^3.4.1", "core-js": "^1.2.1", "cross-env": "^1.0.7", @@ -17,7 +42,7 @@ "grunt-cli": "^0.1.13", "grunt-contrib-nodeunit": "^0.4.1", "grunt-karma": "^0.12.1", - "isparta-loader": "^1.0.0", + "isparta-loader": "^2.0.0", "karma": "^0.13.9", "karma-chai": "0.1.0", "karma-chrome-launcher": "^0.2.0", @@ -34,18 +59,18 @@ "phantomjs": "^1.9.18", "sinon": "^1.16.1", "sinon-chai": "^2.8.0", - "webpack": "^1.12.2", - "webpack-core": "^0.6.8" + "webpack": "^2.1.0-beta.4", + "webpack-sources": "^0.1.1" }, "directories": { "doc": "doc" }, "scripts": { - "test": "grunt test", + "test": "cross-env BABEL_ENV=commonjs grunt test", "integrationtest": "grunt integrationtest", "build:dev": "cross-env BUILD_ENV=development webpack", "build:prod": "cross-env BUILD_ENV=production webpack --config webpack.config.min.js && grunt uglyasm", - "build:node": "cross-env BUILD_ENV=node webpack --config webpack.node.config.js", + "build:node": "cross-env BABEL_ENV=commonjs BUILD_ENV=node webpack --config webpack.node.config.js", "build": "npm run build:dev && npm run build:prod && npm run build:node", "watch": "cross-env BUILD_ENV=development webpack --watch", "lint": "eslint src" @@ -77,8 +102,10 @@ }, "dependencies": { "get-pixels": "^3.2.3", - "gl-matrix": "^2.3.1", - "lodash": "^3.10.1", + "gl-mat2": "^1.0.0", + "gl-vec2": "^1.0.0", + "gl-vec3": "^1.0.3", + "lodash": "^4.6.1", "ndarray": "^1.0.18", "ndarray-linear-interpolate": "^1.0.0", "webrtc-adapter": "^1.0.6" diff --git a/plugins/umd.js b/plugins/umd.js index f01c6ba..1e76385 100644 --- a/plugins/umd.js +++ b/plugins/umd.js @@ -1,5 +1,5 @@ -var ConcatSource = require("webpack-core/lib/ConcatSource"); -var OriginalSource = require("webpack-core/lib/OriginalSource"); +var ConcatSource = require("webpack-sources").ConcatSource; +var OriginalSource = require("webpack-sources").OriginalSource; function MyUmdPlugin(options) { this.name = options.library; @@ -13,11 +13,11 @@ MyUmdPlugin.prototype.apply = function(compiler) { return new ConcatSource(new OriginalSource( "(function webpackUniversalModuleDefinition(root, factory) {\n" + " if(typeof exports === 'object' && typeof module === 'object')\n" + - " module.exports = factory(factory.toString());\n" + + " module.exports = factory(factory.toString()).default;\n" + " else if(typeof exports === 'object')\n" + - " exports[\"" + this.name + "\"] = factory(factory.toString());\n" + + " exports[\"" + this.name + "\"] = factory(factory.toString()).default;\n" + " else\n" + - " root[\"" + this.name + "\"] = factory(factory.toString());\n" + + " root[\"" + this.name + "\"] = factory(factory.toString()).default;\n" + "})(this, function(__factorySource__) {\nreturn ", "webpack/myModuleDefinition"), source, "\n});\n"); }.bind(this)); mainTemplate.plugin("global-hash-paths", function(paths) { diff --git a/src/common/cluster.js b/src/common/cluster.js index de4d141..d46df91 100644 --- a/src/common/cluster.js +++ b/src/common/cluster.js @@ -1,4 +1,7 @@ -import {vec2} from 'gl-matrix'; +const vec2 = { + clone: require('gl-vec2/clone'), + dot: require('gl-vec2/dot') +} /** * Creates a cluster for grouping similar orientations of datapoints */ diff --git a/src/common/cv_utils.js b/src/common/cv_utils.js index 18485fd..d41727d 100644 --- a/src/common/cv_utils.js +++ b/src/common/cv_utils.js @@ -1,15 +1,18 @@ import Cluster2 from './cluster'; import ArrayHelper from './array_helper'; -import {vec2, vec3} from 'gl-matrix'; - -var CVUtils = {}; +const vec2 = { + clone: require('gl-vec2/clone'), +}; +const vec3 = { + clone: require('gl-vec3/clone'), +}; /** * @param x x-coordinate * @param y y-coordinate * @return ImageReference {x,y} Coordinate */ -CVUtils.imageRef = function(x, y) { +export function imageRef(x, y) { var that = { x: x, y: y, @@ -32,7 +35,7 @@ CVUtils.imageRef = function(x, y) { * Computes an integral image of a given grayscale image. * @param imageDataContainer {ImageDataContainer} the image to be integrated */ -CVUtils.computeIntegralImage2 = function(imageWrapper, integralWrapper) { +export function computeIntegralImage2(imageWrapper, integralWrapper) { var imageData = imageWrapper.data; var width = imageWrapper.size.x; var height = imageWrapper.size.y; @@ -75,7 +78,7 @@ CVUtils.computeIntegralImage2 = function(imageWrapper, integralWrapper) { } }; -CVUtils.computeIntegralImage = function(imageWrapper, integralWrapper) { +export function computeIntegralImage(imageWrapper, integralWrapper) { var imageData = imageWrapper.data; var width = imageWrapper.size.x; var height = imageWrapper.size.y; @@ -97,7 +100,7 @@ CVUtils.computeIntegralImage = function(imageWrapper, integralWrapper) { } }; -CVUtils.thresholdImage = function(imageWrapper, threshold, targetWrapper) { +export function thresholdImage(imageWrapper, threshold, targetWrapper) { if (!targetWrapper) { targetWrapper = imageWrapper; } @@ -108,7 +111,7 @@ CVUtils.thresholdImage = function(imageWrapper, threshold, targetWrapper) { } }; -CVUtils.computeHistogram = function(imageWrapper, bitsPerPixel) { +export function computeHistogram(imageWrapper, bitsPerPixel) { if (!bitsPerPixel) { bitsPerPixel = 8; } @@ -124,7 +127,7 @@ CVUtils.computeHistogram = function(imageWrapper, bitsPerPixel) { return hist; }; -CVUtils.sharpenLine = function(line) { +export function sharpenLine(line) { var i, length = line.length, left = line[0], @@ -141,7 +144,7 @@ CVUtils.sharpenLine = function(line) { return line; }; -CVUtils.determineOtsuThreshold = function(imageWrapper, bitsPerPixel) { +export function determineOtsuThreshold(imageWrapper, bitsPerPixel) { if (!bitsPerPixel) { bitsPerPixel = 8; } @@ -171,7 +174,7 @@ CVUtils.determineOtsuThreshold = function(imageWrapper, bitsPerPixel) { var vet = [0], p1, p2, p12, k, m1, m2, m12, max = (1 << bitsPerPixel) - 1; - hist = CVUtils.computeHistogram(imageWrapper, bitsPerPixel); + hist = computeHistogram(imageWrapper, bitsPerPixel); for ( k = 1; k < max; k++) { p1 = px(0, k); p2 = px(k + 1, max); @@ -191,16 +194,16 @@ CVUtils.determineOtsuThreshold = function(imageWrapper, bitsPerPixel) { return threshold << bitShift; }; -CVUtils.otsuThreshold = function(imageWrapper, targetWrapper) { - var threshold = CVUtils.determineOtsuThreshold(imageWrapper); +export function otsuThreshold(imageWrapper, targetWrapper) { + var threshold = determineOtsuThreshold(imageWrapper); - CVUtils.thresholdImage(imageWrapper, threshold, targetWrapper); + thresholdImage(imageWrapper, threshold, targetWrapper); return threshold; }; // local thresholding -CVUtils.computeBinaryImage = function(imageWrapper, integralWrapper, targetWrapper) { - CVUtils.computeIntegralImage(imageWrapper, integralWrapper); +export function computeBinaryImage(imageWrapper, integralWrapper, targetWrapper) { + computeIntegralImage(imageWrapper, integralWrapper); if (!targetWrapper) { targetWrapper = imageWrapper; @@ -241,7 +244,7 @@ CVUtils.computeBinaryImage = function(imageWrapper, integralWrapper, targetWrapp } }; -CVUtils.cluster = function(points, threshold, property) { +export function cluster(points, threshold, property) { var i, k, cluster, point, clusters = []; if (!property) { @@ -270,7 +273,7 @@ CVUtils.cluster = function(points, threshold, property) { return clusters; }; -CVUtils.Tracer = { +export const Tracer = { trace: function(points, vec) { var iteration, maxIterations = 10, top = [], result = [], centerPos = 0, currentPos = 0; @@ -340,10 +343,10 @@ CVUtils.Tracer = { } }; -CVUtils.DILATE = 1; -CVUtils.ERODE = 2; +export const DILATE = 1; +export const ERODE = 2; -CVUtils.dilate = function(inImageWrapper, outImageWrapper) { +export function dilate(inImageWrapper, outImageWrapper) { var v, u, inImageData = inImageWrapper.data, @@ -370,7 +373,7 @@ CVUtils.dilate = function(inImageWrapper, outImageWrapper) { } }; -CVUtils.erode = function(inImageWrapper, outImageWrapper) { +export function erode(inImageWrapper, outImageWrapper) { var v, u, inImageData = inImageWrapper.data, @@ -397,7 +400,7 @@ CVUtils.erode = function(inImageWrapper, outImageWrapper) { } }; -CVUtils.subtract = function(aImageWrapper, bImageWrapper, resultImageWrapper) { +export function subtract(aImageWrapper, bImageWrapper, resultImageWrapper) { if (!resultImageWrapper) { resultImageWrapper = aImageWrapper; } @@ -411,7 +414,7 @@ CVUtils.subtract = function(aImageWrapper, bImageWrapper, resultImageWrapper) { } }; -CVUtils.bitwiseOr = function(aImageWrapper, bImageWrapper, resultImageWrapper) { +export function bitwiseOr(aImageWrapper, bImageWrapper, resultImageWrapper) { if (!resultImageWrapper) { resultImageWrapper = aImageWrapper; } @@ -425,7 +428,7 @@ CVUtils.bitwiseOr = function(aImageWrapper, bImageWrapper, resultImageWrapper) { } }; -CVUtils.countNonZero = function(imageWrapper) { +export function countNonZero(imageWrapper) { var length = imageWrapper.data.length, data = imageWrapper.data, sum = 0; while (length--) { @@ -434,7 +437,7 @@ CVUtils.countNonZero = function(imageWrapper) { return sum; }; -CVUtils.topGeneric = function(list, top, scoreFunc) { +export function topGeneric(list, top, scoreFunc) { var i, minIdx = 0, min = 0, queue = [], score, hit, pos; for ( i = 0; i < top; i++) { @@ -463,18 +466,18 @@ CVUtils.topGeneric = function(list, top, scoreFunc) { return queue; }; -CVUtils.grayArrayFromImage = function(htmlImage, offsetX, ctx, array) { +export function grayArrayFromImage(htmlImage, offsetX, ctx, array) { ctx.drawImage(htmlImage, offsetX, 0, htmlImage.width, htmlImage.height); var ctxData = ctx.getImageData(offsetX, 0, htmlImage.width, htmlImage.height).data; - CVUtils.computeGray(ctxData, array); + computeGray(ctxData, array); }; -CVUtils.grayArrayFromContext = function(ctx, size, offset, array) { +export function grayArrayFromContext(ctx, size, offset, array) { var ctxData = ctx.getImageData(offset.x, offset.y, size.x, size.y).data; - CVUtils.computeGray(ctxData, array); + computeGray(ctxData, array); }; -CVUtils.grayAndHalfSampleFromCanvasData = function(canvasData, size, outArray) { +export function grayAndHalfSampleFromCanvasData(canvasData, size, outArray) { var topRowIdx = 0; var bottomRowIdx = size.x; var endIdx = Math.floor(canvasData.length / 4); @@ -507,7 +510,7 @@ CVUtils.grayAndHalfSampleFromCanvasData = function(canvasData, size, outArray) { } }; -CVUtils.computeGray = function(imageData, outArray, config) { +export function computeGray(imageData, outArray, config) { var l = (imageData.length / 4) | 0, i, singleChannel = config && config.singleChannel === true; @@ -524,7 +527,7 @@ CVUtils.computeGray = function(imageData, outArray, config) { } }; -CVUtils.loadImageArray = function(src, callback, canvas) { +export function loadImageArray(src, callback, canvas) { if (!canvas) { canvas = document.createElement('canvas'); } @@ -538,7 +541,7 @@ CVUtils.loadImageArray = function(src, callback, canvas) { var array = new Uint8Array(this.width * this.height); ctx.drawImage(this, 0, 0); var data = ctx.getImageData(0, 0, this.width, this.height).data; - CVUtils.computeGray(data, array); + computeGray(data, array); this.callback(array, { x: this.width, y: this.height @@ -551,7 +554,7 @@ CVUtils.loadImageArray = function(src, callback, canvas) { * @param inImg {ImageWrapper} input image to be sampled * @param outImg {ImageWrapper} to be stored in */ -CVUtils.halfSample = function(inImgWrapper, outImgWrapper) { +export function halfSample(inImgWrapper, outImgWrapper) { var inImg = inImgWrapper.data; var inWidth = inImgWrapper.size.x; var outImg = outImgWrapper.data; @@ -573,7 +576,7 @@ CVUtils.halfSample = function(inImgWrapper, outImgWrapper) { } }; -CVUtils.hsv2rgb = function(hsv, rgb) { +export function hsv2rgb(hsv, rgb) { var h = hsv[0], s = hsv[1], v = hsv[2], @@ -611,7 +614,7 @@ CVUtils.hsv2rgb = function(hsv, rgb) { return rgb; }; -CVUtils._computeDivisors = function(n) { +export function _computeDivisors(n) { var largeDivisors = [], divisors = [], i; @@ -627,7 +630,7 @@ CVUtils._computeDivisors = function(n) { return divisors.concat(largeDivisors); }; -CVUtils._computeIntersection = function(arr1, arr2) { +function _computeIntersection(arr1, arr2) { var i = 0, j = 0, result = []; @@ -646,11 +649,11 @@ CVUtils._computeIntersection = function(arr1, arr2) { return result; }; -CVUtils.calculatePatchSize = function(patchSize, imgSize) { - var divisorsX = this._computeDivisors(imgSize.x), - divisorsY = this._computeDivisors(imgSize.y), +export function calculatePatchSize(patchSize, imgSize) { + var divisorsX = _computeDivisors(imgSize.x), + divisorsY = _computeDivisors(imgSize.y), wideSide = Math.max(imgSize.x, imgSize.y), - common = this._computeIntersection(divisorsX, divisorsY), + common = _computeIntersection(divisorsX, divisorsY), nrOfPatchesList = [8, 10, 15, 20, 32, 60, 80], nrOfPatchesMap = { "x-small": 5, @@ -687,15 +690,15 @@ CVUtils.calculatePatchSize = function(patchSize, imgSize) { optimalPatchSize = findPatchSizeForDivisors(common); if (!optimalPatchSize) { - optimalPatchSize = findPatchSizeForDivisors(this._computeDivisors(wideSide)); + optimalPatchSize = findPatchSizeForDivisors(_computeDivisors(wideSide)); if (!optimalPatchSize) { - optimalPatchSize = findPatchSizeForDivisors((this._computeDivisors(desiredPatchSize * nrOfPatches))); + optimalPatchSize = findPatchSizeForDivisors((_computeDivisors(desiredPatchSize * nrOfPatches))); } } return optimalPatchSize; }; -CVUtils._parseCSSDimensionValues = function(value) { +export function _parseCSSDimensionValues(value) { var dimension = { value: parseFloat(value), unit: value.indexOf("%") === value.length - 1 ? "%" : "%" @@ -704,7 +707,7 @@ CVUtils._parseCSSDimensionValues = function(value) { return dimension; }; -CVUtils._dimensionsConverters = { +export const _dimensionsConverters = { top: function(dimension, context) { if (dimension.unit === "%") { return Math.floor(context.height * (dimension.value / 100)); @@ -727,13 +730,13 @@ CVUtils._dimensionsConverters = { } }; -CVUtils.computeImageArea = function(inputWidth, inputHeight, area) { +export function computeImageArea(inputWidth, inputHeight, area) { var context = {width: inputWidth, height: inputHeight}; var parsedArea = Object.keys(area).reduce(function(result, key) { var value = area[key], - parsed = CVUtils._parseCSSDimensionValues(value), - calculated = CVUtils._dimensionsConverters[key](parsed, context); + parsed = _parseCSSDimensionValues(value), + calculated = _dimensionsConverters[key](parsed, context); result[key] = calculated; return result; @@ -746,5 +749,3 @@ CVUtils.computeImageArea = function(inputWidth, inputHeight, area) { sh: parsedArea.bottom - parsedArea.top }; }; - -export default CVUtils; diff --git a/src/common/image_wrapper.js b/src/common/image_wrapper.js index 9e39652..0544b72 100644 --- a/src/common/image_wrapper.js +++ b/src/common/image_wrapper.js @@ -1,7 +1,9 @@ import SubImage from './subImage'; -import CVUtils from '../common/cv_utils'; +import {hsv2rgb} from '../common/cv_utils'; import ArrayHelper from '../common/array_helper'; -import {vec2} from 'gl-matrix'; +const vec2 = { + clone: require('gl-vec2/clone'), +}; /** * Represents a basic image combining the data and size. @@ -335,7 +337,7 @@ ImageWrapper.prototype.overlay = function(canvas, scale, from) { var length = this.data.length; while (length--) { hsv[0] = this.data[length] * scale; - result = hsv[0] <= 0 ? whiteRgb : hsv[0] >= 360 ? blackRgb : CVUtils.hsv2rgb(hsv, rgb); + result = hsv[0] <= 0 ? whiteRgb : hsv[0] >= 360 ? blackRgb : hsv2rgb(hsv, rgb); data[length * 4 + 0] = result[0]; data[length * 4 + 1] = result[1]; data[length * 4 + 2] = result[2]; diff --git a/src/decoder/bresenham.js b/src/decoder/bresenham.js index bedd1a3..ca213a0 100644 --- a/src/decoder/bresenham.js +++ b/src/decoder/bresenham.js @@ -1,4 +1,3 @@ -import CVUtils from '../common/cv_utils'; import ImageWrapper from '../common/image_wrapper'; var Bresenham = {}; @@ -90,20 +89,6 @@ Bresenham.getBarcodeLine = function(imageWrapper, p1, p2) { }; }; -Bresenham.toOtsuBinaryLine = function(result) { - var line = result.line, - image = new ImageWrapper({x: line.length - 1, y: 1}, line), - threshold = CVUtils.determineOtsuThreshold(image, 5); - - line = CVUtils.sharpenLine(line); - CVUtils.thresholdImage(image, threshold); - - return { - line: line, - threshold: threshold - }; -}; - /** * Converts the result from getBarcodeLine into a binary representation * also considering the frequency and slope of the signal for more robust results diff --git a/src/input/camera_access.js b/src/input/camera_access.js index 9722001..ccb74a7 100644 --- a/src/input/camera_access.js +++ b/src/input/camera_access.js @@ -1,6 +1,4 @@ -const merge = require('lodash/object/merge'); -const pick = require('lodash/object/pick'); -const mapKeys = require('lodash/object/mapKeys'); +import {merge, pick} from 'lodash'; var streamRef, loadedDataHandler; diff --git a/src/input/frame_grabber.js b/src/input/frame_grabber.js index 12441bc..503f52b 100644 --- a/src/input/frame_grabber.js +++ b/src/input/frame_grabber.js @@ -1,13 +1,17 @@ -import CVUtils from '../common/cv_utils'; +import { + imageRef, + grayAndHalfSampleFromCanvasData, + computeGray +} from '../common/cv_utils'; var FrameGrabber = {}; FrameGrabber.create = function(inputStream, canvas) { var _that = {}, _streamConfig = inputStream.getConfig(), - _video_size = CVUtils.imageRef(inputStream.getRealWidth(), inputStream.getRealHeight()), + _video_size = imageRef(inputStream.getRealWidth(), inputStream.getRealHeight()), _canvasSize = inputStream.getCanvasSize(), - _size = CVUtils.imageRef(inputStream.getWidth(), inputStream.getHeight()), + _size = imageRef(inputStream.getWidth(), inputStream.getHeight()), topRight = inputStream.getTopRight(), _sx = topRight.x, _sy = topRight.y, @@ -55,9 +59,9 @@ FrameGrabber.create = function(inputStream, canvas) { _ctx.drawImage(frame, 0, 0, _canvasSize.x, _canvasSize.y); ctxData = _ctx.getImageData(_sx, _sy, _size.x, _size.y).data; if (doHalfSample){ - CVUtils.grayAndHalfSampleFromCanvasData(ctxData, _size, _data); + grayAndHalfSampleFromCanvasData(ctxData, _size, _data); } else { - CVUtils.computeGray(ctxData, _data, _streamConfig); + computeGray(ctxData, _data, _streamConfig); } return true; } else { diff --git a/src/locator/barcode_locator.js b/src/locator/barcode_locator.js index ae1fa99..aa7aa69 100644 --- a/src/locator/barcode_locator.js +++ b/src/locator/barcode_locator.js @@ -1,11 +1,30 @@ import ImageWrapper from '../common/image_wrapper'; -import CVUtils from '../common/cv_utils'; +import { + calculatePatchSize, + otsuThreshold, + hsv2rgb, + cluster, + topGeneric, + imageRef, + halfSample, + computeImageArea +} from '../common/cv_utils'; import ArrayHelper from '../common/array_helper'; import ImageDebug from '../common/image_debug'; import Rasterizer from './rasterizer'; import Tracer from './tracer'; import skeletonizer from './skeletonizer'; -import {vec2, mat2} from 'gl-matrix'; +const vec2 = { + clone: require('gl-vec2/clone'), + dot: require('gl-vec2/dot'), + scale: require('gl-vec2/scale'), + transformMat2: require('gl-vec2/transformMat2') +}; +const mat2 = { + copy: require('gl-mat2/copy'), + create: require('gl-mat2/create'), + invert: require('gl-mat2/invert') +} var _config, _currentImageWrapper, @@ -41,7 +60,7 @@ function initBuffers() { _currentImageWrapper = _inputImageWrapper; } - _patchSize = CVUtils.calculatePatchSize(_config.patchSize, _currentImageWrapper.size); + _patchSize = calculatePatchSize(_config.patchSize, _currentImageWrapper.size); _numPatches.x = _currentImageWrapper.size.x / _patchSize.x | 0; _numPatches.y = _currentImageWrapper.size.y / _patchSize.y | 0; @@ -117,7 +136,7 @@ function boxFromPatches(patches) { } overAvg = (180 - overAvg) * Math.PI / 180; - transMat = mat2.clone([Math.cos(overAvg), Math.sin(overAvg), -Math.sin(overAvg), Math.cos(overAvg)]); + transMat = mat2.copy(mat2.create(), [Math.cos(overAvg), Math.sin(overAvg), -Math.sin(overAvg), Math.cos(overAvg)]); // iterate over patches and rotate by angle for ( i = 0; i < patches.length; i++) { @@ -178,7 +197,7 @@ function boxFromPatches(patches) { * Creates a binary image of the current image */ function binarizeImage() { - CVUtils.otsuThreshold(_currentImageWrapper, _binaryImageWrapper); + otsuThreshold(_currentImageWrapper, _binaryImageWrapper); _binaryImageWrapper.zeroBorder(); if (_config.showCanvas) { _binaryImageWrapper.show(_canvasContainer.dom.binary, 255); @@ -309,7 +328,7 @@ function findBoxes(topLabels, maxLabel) { for ( j = 0; j < patches.length; j++) { patch = patches[j]; hsv[0] = (topLabels[i].label / (maxLabel + 1)) * 360; - CVUtils.hsv2rgb(hsv, rgb); + hsv2rgb(hsv, rgb); ImageDebug.drawRect(patch.pos, _subImageWrapper.size, _canvasContainer.ctx.binary, {color: "rgb(" + rgb.join(",") + ")", lineWidth: 2}); } @@ -324,8 +343,8 @@ function findBoxes(topLabels, maxLabel) { * @param {Object} moments */ function similarMoments(moments) { - var clusters = CVUtils.cluster(moments, 0.90); - var topCluster = CVUtils.topGeneric(clusters, 1, function(e) { + var clusters = cluster(moments, 0.90); + var topCluster = topGeneric(clusters, 1, function(e) { return e.getPoints().length; }); var points = [], result = []; @@ -339,12 +358,12 @@ function similarMoments(moments) { } function skeletonize(x, y) { - _binaryImageWrapper.subImageAsCopy(_subImageWrapper, CVUtils.imageRef(x, y)); + _binaryImageWrapper.subImageAsCopy(_subImageWrapper, imageRef(x, y)); _skeletonizer.skeletonize(); // Show skeleton if requested if (ENV.development && _config.debug.showSkeleton) { - _skelImageWrapper.overlay(_canvasContainer.dom.binary, 360, CVUtils.imageRef(x, y)); + _skelImageWrapper.overlay(_canvasContainer.dom.binary, 360, imageRef(x, y)); } } @@ -496,7 +515,7 @@ function rasterizeAngularSimilarity(patchesFound) { if (_patchLabelGrid.data[j] > 0 && _patchLabelGrid.data[j] <= label) { patch = _imageToPatchGrid.data[j]; hsv[0] = (_patchLabelGrid.data[j] / (label + 1)) * 360; - CVUtils.hsv2rgb(hsv, rgb); + hsv2rgb(hsv, rgb); ImageDebug.drawRect(patch.pos, _subImageWrapper.size, _canvasContainer.ctx.binary, {color: "rgb(" + rgb.join(",") + ")", lineWidth: 2}); } @@ -521,7 +540,7 @@ export default { boxes; if (_config.halfSample) { - CVUtils.halfSample(_inputImageWrapper, _currentImageWrapper); + halfSample(_inputImageWrapper, _currentImageWrapper); } binarizeImage(); @@ -557,7 +576,7 @@ export default { // calculate width and height based on area if (inputStream.getConfig().area) { - area = CVUtils.computeImageArea(width, height, inputStream.getConfig().area); + area = computeImageArea(width, height, inputStream.getConfig().area); inputStream.setTopRight({x: area.sx, y: area.sy}); inputStream.setCanvasSize({x: width, y: height}); width = area.sw; @@ -569,7 +588,7 @@ export default { y: Math.floor(height * halfSample) }; - patchSize = CVUtils.calculatePatchSize(config.patchSize, size); + patchSize = calculatePatchSize(config.patchSize, size); if (ENV.development) { console.log("Patch-Size: " + JSON.stringify(patchSize)); } diff --git a/src/locator/skeletonizer.js b/src/locator/skeletonizer.js index 3f8241b..b92489f 100644 --- a/src/locator/skeletonizer.js +++ b/src/locator/skeletonizer.js @@ -198,12 +198,10 @@ function Skeletonizer(stdlib, foreign, buffer) { done = ((sum | 0) == 0 | 0); } while (!done); } - return { skeletonize: skeletonize }; } - +/* @preserve ASM END */ export default Skeletonizer; /* eslint-enable eqeqeq*/ -/* @preserve ASM END */ diff --git a/src/quagga.js b/src/quagga.js index 47b71cc..7843641 100644 --- a/src/quagga.js +++ b/src/quagga.js @@ -6,13 +6,14 @@ import BarcodeDecoder from './decoder/barcode_decoder'; import Events from './common/events'; import CameraAccess from './input/camera_access'; import ImageDebug from './common/image_debug'; -import {vec2} from 'gl-matrix'; import ResultCollector from './analytics/result_collector'; import Config from './config/config'; import InputStream from 'input_stream'; import FrameGrabber from 'frame_grabber'; - -const merge = require('lodash/object/merge'); +import {merge} from 'lodash'; +const vec2 = { + clone: require('gl-vec2/clone') +}; var _inputStream, _framegrabber, @@ -364,7 +365,7 @@ function initWorker(cb) { function workerInterface(factory) { /* eslint-disable no-undef*/ if (factory) { - var Quagga = factory(); + var Quagga = factory().default; if (!Quagga) { self.postMessage({'event': 'error', message: 'Quagga could not be created'}); return; diff --git a/src/reader/i2of5_reader.js b/src/reader/i2of5_reader.js index f2a2f90..a064074 100644 --- a/src/reader/i2of5_reader.js +++ b/src/reader/i2of5_reader.js @@ -1,5 +1,5 @@ import BarcodeReader from './barcode_reader'; -const merge = require('lodash/object/merge'); +import {merge} from 'lodash'; function I2of5Reader(opts) { opts = merge(getDefaulConfig(), opts); diff --git a/tasks/uglyasm.js b/tasks/uglyasm.js index a630298..24e8f30 100644 --- a/tasks/uglyasm.js +++ b/tasks/uglyasm.js @@ -11,7 +11,7 @@ module.exports = function(grunt) { var code = fs.readFileSync('dist/quagga.js', 'utf-8'), minifiedCode = fs.readFileSync('dist/quagga.min.js', 'utf-8'), commentEnd = '/* @preserve ASM END */', - moduleFunctionRegex = /function\s*\((\w+,\s*\w+)\)\s*\{\s*\/\* \@preserve ASM BEGIN \*\//, + moduleFunctionRegex = /function\s*\((\w+,\s*\w+,\s*\w+)\)\s*\{\s*\/\* \@preserve ASM BEGIN \*\//, commentStartIdx = code.indexOf("/* @preserve ASM BEGIN */"), asmEndIdxTmp = code.indexOf(commentEnd), asmEndIdx = code.indexOf("}", asmEndIdxTmp), diff --git a/test/integration/integration.spec.js b/test/integration/integration.spec.js index 873ff29..7e50e8a 100644 --- a/test/integration/integration.spec.js +++ b/test/integration/integration.spec.js @@ -1,4 +1,4 @@ -const Quagga = require('../../src/quagga'); +const Quagga = require('../../src/quagga').default; const async = require('async'); describe('decodeSingle', function () { diff --git a/test/spec/array_helper.spec.js b/test/spec/array_helper.spec.js index bfb65fe..7186e7c 100644 --- a/test/spec/array_helper.spec.js +++ b/test/spec/array_helper.spec.js @@ -1,4 +1,4 @@ -const ArrayHelper = require('../../src/common/array_helper'); +import ArrayHelper from '../../src/common/array_helper'; describe('init', function() { it('initializes an array with the given value', function() { diff --git a/test/spec/barcode_locator.spec.js b/test/spec/barcode_locator.spec.js index c6e1cfc..590f614 100644 --- a/test/spec/barcode_locator.spec.js +++ b/test/spec/barcode_locator.spec.js @@ -1,6 +1,6 @@ -const BarcodeLocator = require('../../src/locator/barcode_locator'); -const Config = require('../../src/config/config'); -const merge = require('lodash/object/merge'); +import BarcodeLocator from '../../src/locator/barcode_locator'; +import Config from '../../src/config/config'; +import {merge} from 'lodash'; describe('checkImageConstraints', function() { var config, diff --git a/test/spec/camera_access.spec.js b/test/spec/camera_access.spec.js index 91ddf35..490900d 100644 --- a/test/spec/camera_access.spec.js +++ b/test/spec/camera_access.spec.js @@ -1,4 +1,4 @@ -const CameraAccess = require('../../src/input/camera_access'); +import CameraAccess from '../../src/input/camera_access'; var originalURL, originalMediaStreamTrack, diff --git a/test/spec/cv_utils.spec.js b/test/spec/cv_utils.spec.js index 64abb57..2d158a4 100644 --- a/test/spec/cv_utils.spec.js +++ b/test/spec/cv_utils.spec.js @@ -1,8 +1,14 @@ -const CVUtils = require('../../src/common/cv_utils'); +const { + imageRef, + calculatePatchSize, + _parseCSSDimensionValues, + _dimensionsConverters, + computeImageArea +} = require('../../src/common/cv_utils'); describe('imageRef', function() { it('gets the image Reference for a coordinate', function() { - var res = CVUtils.imageRef(1, 2); + var res = imageRef(1, 2); expect(res.x).to.equal(1); expect(res.y).to.equal(2); expect(res.toVec2()[0]).to.equal(1); @@ -12,14 +18,14 @@ describe('imageRef', function() { describe('calculatePatchSize', function() { it('should not throw an error in case of valid image size', function() { var expected = {x: 32, y: 32}, - patchSize = CVUtils.calculatePatchSize("medium", {x: 640, y: 480}); + patchSize = calculatePatchSize("medium", {x: 640, y: 480}); expect(patchSize).to.be.deep.equal(expected); }); it('should thow an error if image size it not valid', function() { var expected = {x: 32, y: 32}, - patchSize = CVUtils.calculatePatchSize("medium", {x: 640, y: 480}); + patchSize = calculatePatchSize("medium", {x: 640, y: 480}); expect(patchSize).to.be.deep.equal(expected); }); @@ -31,7 +37,7 @@ describe('_parseCSSDimensionValues', function() { value: 10, unit: "%" }, - result = CVUtils._parseCSSDimensionValues("10%"); + result = _parseCSSDimensionValues("10%"); expect(result).to.be.deep.equal(expected); }); @@ -41,7 +47,7 @@ describe('_parseCSSDimensionValues', function() { value: 100, unit: "%" }, - result = CVUtils._parseCSSDimensionValues("100%"); + result = _parseCSSDimensionValues("100%"); expect(result).to.be.deep.equal(expected); }); @@ -51,7 +57,7 @@ describe('_parseCSSDimensionValues', function() { value: 0, unit: "%" }, - result = CVUtils._parseCSSDimensionValues("0%"); + result = _parseCSSDimensionValues("0%"); expect(result).to.be.deep.equal(expected); }); @@ -61,7 +67,7 @@ describe('_parseCSSDimensionValues', function() { value: 26.3, unit: "%" }, - result = CVUtils._parseCSSDimensionValues("26.3px"); + result = _parseCSSDimensionValues("26.3px"); console.log(result); expect(result).to.be.deep.equal(expected); @@ -80,28 +86,28 @@ describe("_dimensionsConverters", function(){ it("should convert a top-value correclty", function() { var expected = 48, - result = CVUtils._dimensionsConverters.top({value: 10, unit: "%"}, context); + result = _dimensionsConverters.top({value: 10, unit: "%"}, context); expect(result).to.be.equal(expected); }); it("should convert a right-value correclty", function() { var expected = 640 - 128, - result = CVUtils._dimensionsConverters.right({value: 20, unit: "%"}, context); + result = _dimensionsConverters.right({value: 20, unit: "%"}, context); expect(result).to.be.equal(expected); }); it("should convert a bottom-value correclty", function() { var expected = 480 - 77, - result = CVUtils._dimensionsConverters.bottom({value: 16, unit: "%"}, context); + result = _dimensionsConverters.bottom({value: 16, unit: "%"}, context); expect(result).to.be.equal(expected); }); it("should convert a left-value correclty", function() { var expected = 57, - result = CVUtils._dimensionsConverters.left({value: 9, unit: "%"}, context); + result = _dimensionsConverters.left({value: 9, unit: "%"}, context); expect(result).to.be.equal(expected); }); @@ -115,7 +121,7 @@ describe("computeImageArea", function() { sw: 429, sh: 336 }, - result = CVUtils.computeImageArea(640, 480, { + result = computeImageArea(640, 480, { top: "10%", right: "15%", bottom: "20%", @@ -132,7 +138,7 @@ describe("computeImageArea", function() { sw: 640, sh: 480 }, - result = CVUtils.computeImageArea(640, 480, { + result = computeImageArea(640, 480, { top: "0%", right: "0%", bottom: "0%", diff --git a/test/spec/events.spec.js b/test/spec/events.spec.js index fc22c5f..18dc67c 100644 --- a/test/spec/events.spec.js +++ b/test/spec/events.spec.js @@ -1,4 +1,4 @@ -const Events = require('../../src/common/events'); +import Events from '../../src/common/events'; beforeEach(function() { Events.unsubscribe(); diff --git a/test/spec/result_collector.spec.js b/test/spec/result_collector.spec.js index e3f0889..ef45678 100644 --- a/test/spec/result_collector.spec.js +++ b/test/spec/result_collector.spec.js @@ -1,5 +1,5 @@ -const ResultCollector = require('../../src/analytics/result_collector'); -const ImageDebug = require('../../src/common/image_debug'); +import ResultCollector from '../../src/analytics/result_collector'; +import ImageDebug from '../../src/common/image_debug'; var canvasMock, imageSize, diff --git a/webpack.config.js b/webpack.config.js index f754c5f..afc23cb 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -11,16 +11,14 @@ module.exports = { loaders: [{ test: /\.jsx?$/, exclude: /node_modules/, - loader: 'babel' + loader: 'babel-loader' }] }, resolve: { - extensions: ['', '.js', '.jsx'], - root: path.resolve(__dirname), - alias: { - 'input_stream$': 'src/input/input_stream', - 'frame_grabber$': 'src/input/frame_grabber' - } + modules: [ + path.resolve('./src/input/'), + 'node_modules' + ] }, output: { path: __dirname + '/dist', diff --git a/webpack.config.min.js b/webpack.config.min.js index 8c9fc37..4f4bfc9 100644 --- a/webpack.config.min.js +++ b/webpack.config.min.js @@ -1,9 +1,21 @@ var webpack = require('webpack'); module.exports = require('./webpack.config.js'); -module.exports.plugins.unshift( - new webpack.optimize.UglifyJsPlugin() -); +module.exports.plugins = module.exports.plugins.concat([ + new webpack.LoaderOptionsPlugin({ + minimize: true, + debug: false + }), + new webpack.optimize.UglifyJsPlugin({ + compress: { + warnings: false + }, + output: { + comments: /@preserve/ + }, + sourceMap: false + }), +]); module.exports.output.filename = 'quagga.min.js'; diff --git a/webpack.node.config.js b/webpack.node.config.js index 261ad4d..d32f36b 100644 --- a/webpack.node.config.js +++ b/webpack.node.config.js @@ -4,12 +4,10 @@ var webpack = require('webpack'), module.exports = require('./webpack.config.js'); module.exports.resolve = { - extensions: ['', '.js', '.jsx'], - root: path.resolve(__dirname), - alias: { - 'input_stream': 'lib/input_stream', - 'frame_grabber': 'lib/frame_grabber' - } + modules: [ + path.resolve('./lib/'), + 'node_modules' + ] }; module.exports.externals = [ @@ -19,7 +17,8 @@ module.exports.externals = [ "ndarray", "ndarray-linear-interpolate" ]; -module.exports.output.libraryTarget = "commonjs2"; +module.exports.output.libraryTarget = "umd"; +module.exports.output.library = "Quagga"; module.exports.plugins = [ new webpack.DefinePlugin({ ENV: require(path.join(__dirname, './env/', process.env.BUILD_ENV))