From 5231824d98a0817cd2a372f8570e148eeaed7f95 Mon Sep 17 00:00:00 2001 From: Christoph Oberhofer Date: Sun, 19 Jun 2016 17:32:21 +0200 Subject: [PATCH] Moved DOM objects to helper module --- example/file-input/index.js | 6 +++--- example/scan-to-input/index.js | 2 +- src/common/dom_helper.js | 21 +++++++++++++++++++++ src/input/config_factory.js | 18 +++++++++--------- 4 files changed, 34 insertions(+), 13 deletions(-) create mode 100644 src/common/dom_helper.js diff --git a/example/file-input/index.js b/example/file-input/index.js index f8a9d23..a8acf52 100644 --- a/example/file-input/index.js +++ b/example/file-input/index.js @@ -4,11 +4,11 @@ var App = { init: function() { this.attachListeners(); }, - decode: function(src) { + decode: function(file) { Quagga .decoder({readers: ['ean_reader']}) .locator({patchSize: 'medium'}) - .fromImage(src, {size: 800}) + .fromSource(file, {size: 800}) .toPromise() .then(function(result) { document.querySelector('input.isbn').value = result.codeResult.code; @@ -35,7 +35,7 @@ var App = { e.preventDefault(); fileInput.removeEventListener("change", onChange); if (e.target.files && e.target.files.length) { - self.decode(URL.createObjectURL(e.target.files[0])); + self.decode(e.target.files[0]); } }); } diff --git a/example/scan-to-input/index.js b/example/scan-to-input/index.js index 3f805d8..09d2d15 100644 --- a/example/scan-to-input/index.js +++ b/example/scan-to-input/index.js @@ -66,7 +66,7 @@ var App = { this._scanner = Quagga .decoder({readers: ['ean_reader']}) .locator({patchSize: 'medium'}) - .fromVideo({ + .fromSource({ target: selector, constraints: { width: 800, diff --git a/src/common/dom_helper.js b/src/common/dom_helper.js new file mode 100644 index 0000000..dfae643 --- /dev/null +++ b/src/common/dom_helper.js @@ -0,0 +1,21 @@ +const hasWindow = typeof window !== 'undefined'; +const windowRef = hasWindow ? window : {}; + +const windowObjects = [ + "MediaStream", + "HTMLImageElement", + "HTMLVideoElement", + "HTMLCanvasElement", + "FileList", + "File", + "URL" +]; + +const DOMHelper = windowObjects.reduce((result, obj) => { + return { + ...result, + [obj]: obj in windowRef ? windowRef[obj] : () => {} + }; +}, {}); + +export default DOMHelper; diff --git a/src/input/config_factory.js b/src/input/config_factory.js index 0c49587..b345c20 100644 --- a/src/input/config_factory.js +++ b/src/input/config_factory.js @@ -1,29 +1,29 @@ import {merge, pick, omitBy, isEmpty} from 'lodash'; +import DOMHelper from '../common/dom_helper'; + const isDataURL = {regex: /^\s*data:([a-z]+\/[a-z0-9\-\+]+(;[a-z\-]+\=[a-z0-9\-]+)?)?(;base64)?,[a-z0-9\!\$\&\'\,\(\)\*\+\,\;\=\-\.\_\~\:\@\/\?\%\s]*\s*$/i}, // eslint-disable-line max-len isBlobURL = {regex: /^\s*blob:(.*)$/i}, isMediaURL = {regex: /^(?:(?:http[s]?|ftp):\/)?\/?(?:(?:[^:\/\s]+)(?:(?:\/\w+)*\/))?([\w\-]+\.([^#?\s]+))(?:.*)?(?:#[\w\-]+)?$/i}, // eslint-disable-line max-len isImageExt = {regex: /(jpe?g|png|gif|tiff)(?:\s+|$)/i}, isVideoExt = {regex: /(webm|ogg|mp4|m4v)/i}; -const MediaStream = "MediaStream" in window ? window.MediaStream : function(){}; - export function createConfigFromSource(config, sourceConfig, source) { - if (source instanceof MediaStream) { + if (source instanceof DOMHelper.MediaStream) { return createConfigForStream(config, sourceConfig, {srcObject: source}); - } else if (source instanceof HTMLImageElement) { + } else if (source instanceof DOMHelper.HTMLImageElement) { throw new Error('Source "HTMLImageElement": not yet supported'); // return createConfigForImage(config, inputConfig, {image: source}); - } else if (source instanceof HTMLVideoElement) { + } else if (source instanceof DOMHelper.HTMLVideoElement) { throw new Error('Source "HTMLVideoElement": not yet supported'); // return createConfigForVideo(config, inputConfig, {video: source}); - } else if (source instanceof HTMLCanvasElement) { + } else if (source instanceof DOMHelper.HTMLCanvasElement) { return createConfigForCanvas(config, sourceConfig, {canvas: source}); - } else if (source instanceof FileList) { + } else if (source instanceof DOMHelper.FileList) { if (source.length > 0) { return createConfigForFile(config, sourceConfig, source[0]); } - } else if (source instanceof File) { + } else if (source instanceof DOMHelper.File) { return createConfigForFile(config, sourceConfig, source); } else if (typeof source === 'string') { return createConfigForString(config, sourceConfig, source); @@ -64,7 +64,7 @@ function createConfigForMimeType(config, inputConfig, {src, mime}) { } function createConfigForFile(config, inputConfig, file) { - const src = window.URL.createObjectURL(file); + const src = DOMHelper.URL.createObjectURL(file); return createConfigForMimeType(config, inputConfig, { src, mime: file.type