Another try on web-workers; works with decoding single-images only; live-stream and video-input won't work

This commit is contained in:
Christoph Oberhofer
2015-01-12 23:04:14 +01:00
parent ebceb1f78c
commit 72940990d3
11 changed files with 5387 additions and 151 deletions
+69 -32
View File
@@ -26,7 +26,11 @@ function(ImageWrapper, CVUtils, Rasterizer, Tracer, skeletonizer, ArrayHelper, I
},
_numPatches = {x: 0, y: 0},
_inputImageWrapper,
_skeletonizer;
_skeletonizer,
self = this,
_worker,
_locatedCb,
_initialized;
function initBuffers() {
var skeletonImageData;
@@ -52,10 +56,10 @@ function(ImageWrapper, CVUtils, Rasterizer, Tracer, skeletonizer, ArrayHelper, I
_labelImageWrapper = new ImageWrapper(_patchSize, undefined, Array, true);
skeletonImageData = new ArrayBuffer(_patchSize.x * _patchSize.y * 16);
skeletonImageData = new ArrayBuffer(64*1024);
_subImageWrapper = new ImageWrapper(_patchSize, new Uint8Array(skeletonImageData, 0, _patchSize.x * _patchSize.y));
_skelImageWrapper = new ImageWrapper(_patchSize, new Uint8Array(skeletonImageData, _patchSize.x * _patchSize.y * 3, _patchSize.x * _patchSize.y), undefined, true);
_skeletonizer = skeletonizer(window, {
_skeletonizer = skeletonizer(self, {
size : _patchSize.x
}, skeletonImageData);
@@ -68,6 +72,9 @@ function(ImageWrapper, CVUtils, Rasterizer, Tracer, skeletonizer, ArrayHelper, I
}
function initCanvas() {
if (_config.useWorker || typeof document === 'undefined') {
return;
}
_canvasContainer.dom.binary = document.createElement("canvas");
_canvasContainer.dom.binary.className = "binaryBuffer";
if (_config.showCanvas === true) {
@@ -471,44 +478,74 @@ function(ImageWrapper, CVUtils, Rasterizer, Tracer, skeletonizer, ArrayHelper, I
return label;
}
function initWorker(cb) {
var tmpData;
_worker = new Worker('../src/worker_locator.js');
tmpData = _inputImageWrapper.data;
_inputImageWrapper.data = null; // do not send the data along
_worker.postMessage({cmd: 'init', inputImageWrapper: _inputImageWrapper});
_inputImageWrapper.data = tmpData;
_worker.onmessage = function(e) {
if (e.data.event === 'initialized') {
_initialized = true;
cb();
} else if (e.data.event === 'located') {
_inputImageWrapper.data = new Uint8Array(e.data.buffer);
_locatedCb(e.data.result);
}
};
}
return {
init : function(config, data) {
init : function(config, data, cb) {
_config = config;
_inputImageWrapper = data.inputImageWrapper;
initBuffers();
initCanvas();
// 1. check config for web-worker
if (_config.useWorker) {
initWorker(cb);
} else {
initBuffers();
initCanvas();
cb();
}
},
locate : function() {
locate : function(cb) {
var patchesFound,
topLabels = [],
boxes = [];
if (_halfSample) {
CVUtils.halfSample(_inputImageWrapper, _currentImageWrapper);
if (_config.useWorker) {
_locatedCb = cb;
_worker.postMessage({cmd: 'locate', buffer: _inputImageWrapper.data}, [_inputImageWrapper.data.buffer]);
} else {
if (_halfSample) {
CVUtils.halfSample(_inputImageWrapper, _currentImageWrapper);
}
binarizeImage();
patchesFound = findPatches();
// return unless 5% or more patches are found
if (patchesFound.length < _numPatches.x * _numPatches.y * 0.05) {
return cb(null);
}
// rasterrize area by comparing angular similarity;
var maxLabel = rasterizeAngularSimilarity(patchesFound);
if (maxLabel <= 1) {
return cb(null);
}
// search for area with the most patches (biggest connected area)
topLabels = findBiggestConnectedAreas(maxLabel);
if (topLabels.length === 0) {
return cb(null);
}
boxes = findBoxes(topLabels, maxLabel);
cb(boxes);
}
binarizeImage();
patchesFound = findPatches();
// return unless 5% or more patches are found
if (patchesFound.length < _numPatches.x * _numPatches.y * 0.05) {
return;
}
// rasterrize area by comparing angular similarity;
var maxLabel = rasterizeAngularSimilarity(patchesFound);
if (maxLabel <= 1) {
return null;
}
// search for area with the most patches (biggest connected area)
topLabels = findBiggestConnectedAreas(maxLabel);
if (topLabels.length === 0) {
return null;
}
boxes = findBoxes(topLabels, maxLabel);
return boxes;
}
};
});
+1
View File
@@ -24,6 +24,7 @@ define(function(){
]
},
locator: {
useWorker: true,
showCanvas: false,
showPatches: false,
showFoundPatches: false,
+29 -29
View File
@@ -78,18 +78,19 @@ function(Code128Reader, EANReader, InputStream, ImageWrapper, BarcodeLocator, Ba
}
function canRecord() {
initBuffers();
initCanvas();
_decoder = BarcodeDecoder.create(_config.decoder, _inputImageWrapper);
_framegrabber = FrameGrabber.create(_inputStream, _canvasContainer.dom.image);
_framegrabber.attachData(_inputImageWrapper.data);
initBuffers(function() {
initCanvas();
_decoder = BarcodeDecoder.create(_config.decoder, _inputImageWrapper);
_framegrabber = FrameGrabber.create(_inputStream, _canvasContainer.dom.image);
_framegrabber.attachData(_inputImageWrapper.data);
initConfig();
_inputStream.play();
_initialized = true;
if (_config.readyFunc) {
_config.readyFunc.apply();
}
initConfig();
_inputStream.play();
_initialized = true;
if (_config.readyFunc) {
_config.readyFunc.apply();
}
});
}
function initCanvas() {
@@ -124,7 +125,7 @@ function(Code128Reader, EANReader, InputStream, ImageWrapper, BarcodeLocator, Ba
_canvasContainer.dom.overlay.height = _inputImageWrapper.size.y;
}
function initBuffers() {
function initBuffers(cb) {
_inputImageWrapper = new ImageWrapper({
x : _inputStream.getWidth(),
y : _inputStream.getHeight()
@@ -137,35 +138,34 @@ function(Code128Reader, EANReader, InputStream, ImageWrapper, BarcodeLocator, Ba
vec2.create([_inputStream.getWidth() - 20, _inputStream.getHeight() / 2 + 100]),
vec2.create([_inputStream.getWidth() - 20, _inputStream.getHeight() / 2 - 100])
];
BarcodeLocator.init(_config.locator, {
inputImageWrapper : _inputImageWrapper
});
BarcodeLocator.init(_config.locator, {inputImageWrapper : _inputImageWrapper}, cb);
}
function getBoundingBoxes() {
var boxes;
function getBoundingBoxes(cb) {
if (_config.locate) {
boxes = BarcodeLocator.locate();
BarcodeLocator.locate(cb);
} else {
boxes = [_boxSize];
cb([_boxSize]);
}
return boxes;
}
function update() {
var result,
boxes;
var result;
if (_framegrabber.grab()) {
_canvasContainer.ctx.overlay.clearRect(0, 0, _inputImageWrapper.size.x, _inputImageWrapper.size.y);
boxes = getBoundingBoxes();
if (boxes) {
result = _decoder.decodeFromBoundingBoxes(boxes);
if (result && result.codeResult) {
Events.publish("detected", result.codeResult.code);
console.time("getBoundingBoxes");
getBoundingBoxes(function(boxes) {
console.timeEnd("getBoundingBoxes");
// attach data back to grabber
_framegrabber.attachData(_inputImageWrapper.data);
if (boxes) {
result = _decoder.decodeFromBoundingBoxes(boxes);
if (result && result.codeResult) {
Events.publish("detected", result.codeResult.code);
}
}
}
});
}
}
+14 -14
View File
@@ -4,18 +4,18 @@
*/
glMatrixArrayType = Float32Array;
if (typeof window !== 'undefined') {
window.requestAnimFrame = (function () {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function (/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
window.setTimeout(callback, 1000 / 60);
};
})();
window.requestAnimFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
window.setTimeout(callback, 1000/60);
};
})();
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
}
+39
View File
@@ -0,0 +1,39 @@
/* jshint undef: true, unused: true, browser:true, devel: true */
/* global importScripts, self, Locator */
importScripts('../dist/locator.js');
var inputImageWrapper = null;
self.onmessage = function(e) {
if (e.data.cmd === 'init') {
inputImageWrapper = e.data.inputImageWrapper;
init(function() {
self.postMessage({'event': 'initialized'});
});
} else if (e.data.cmd === 'locate') {
locate(new Uint8Array(e.data.buffer), function(result) {
self.postMessage({'event': 'located', result: result, buffer : inputImageWrapper.data}, [inputImageWrapper.data.buffer]);
});
}
};
function init(cb) {
Locator.init({
showCanvas: false,
showPatches: false,
showFoundPatches: false,
showSkeleton: false,
showLabels: false,
showPatchLabels: false,
showRemainingPatchLabels: false,
boxFromPatches: {
showTransformed: false,
showTransformedBox: false,
showBB: false
}
}, {
inputImageWrapper : inputImageWrapper
}, cb);
}
function locate(buffer, cb) {
inputImageWrapper.data = buffer;
Locator.locate(cb);
}