v0.0.3 use jsqr

v0.0.2
bugfix
2026-08-13 04:51:41 +08:00 · 2018-07-30 21:11:42 +08:00 · 2018-07-24 17:32:09 +08:00 · 2018-07-24 17:28:43 +08:00
19 changed files with 216 additions and 6429 deletions
@@ -3,8 +3,9 @@ var qrDecode = require('./src/QRDecode');
 var decodeByDom = function (dom) {
 	var canvas = document.createElement("canvas")
 	var ctx = canvas.getContext('2d')
-	canvas.width = dom.width;
-	canvas.height = dom.height;
+	var isVideo = dom.tagName == 'VIDEO'
+	canvas.width = isVideo ? dom.videoWidth : dom.width;
+	canvas.height = isVideo ? dom.videoHeight : dom.height;
 	ctx.drawImage(dom, 0, 0, canvas.width, canvas.height);
 	var data = ctx.getImageData(0, 0, canvas.width, canvas.height);
 	return qrDecode(data)
@@ -1,14 +1,97 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<meta http-equiv="X-UA-Compatible" content="ie=edge">
 	<title>qrcode-decode</title>
 </head>
+
 <body>
-	<input type="file" name="file" id="file"><br>
+	<input type="file" name="file" id="file">
+	<br>
+	<button id="videoBut" onclick="buttonClick()">启用摄像头</button><br>
+	<video id="video" width="300"></video>
 	<div></div>
+
 </body>
-<script type="text/javascript" src="test.js"></script>
+<script type="text/javascript" src="../dist/qr-decode.js"></script>
+<script>
+	document.getElementById('file').onchange = function (event) {
+		var el = event.target;
+		if (!el.files.length) return;
+		var file = el.files[0];
+		new Promise(function (ok, no) {
+			if (window.URL && window.URL.createObjectURL) {
+				ok(window.URL.createObjectURL(file));
+			} else if (typeof FileReader) {
+				var reader = new FileReader();
+				reader.onload = evt => {
+					ok(evt.target.result);
+				};
+				reader.readAsDataURL(file);
+			} else {
+				no('浏览器不支持');
+			}
+		}).then((src) => {
+			qrDecode.decodeByUrl(src, function (err, txt) {
+				var msg = document.createElement("div")
+				if (err) {
+					console.log(err);
+					msg.innerHTML = "err: <br>" + err;
+				} else {
+					msg.innerHTML = txt;
+				}
+				document.body.appendChild(msg);
+			})
+
+		});
+	}
+	
+	var video =document.getElementById('video');
+	var videoBut =document.getElementById('videoBut');
+	var xc;
+	videoBut.onclick = videoEnable;
+
+	function videoEnable() {
+		var URL = window.URL || window.webkitURL;
+		navigator.getUserMedia({
+			video: true
+		}, function (stream) {
+			video.src = URL.createObjectURL(stream);// 将获取到的视频流对象转换为地址  
+			video.oncanplay = function(){
+				videoPlay();
+				video.width = video.videoWidth;
+				video.height = video.videoHeight;
+			}
+		}, function (error) {
+			alert(error.name || error);
+		});
+	}
+
+	function videoStop(){
+		clearInterval(xc);
+		video.pause();
+		videoBut.innerText = '启动';
+		videoBut.onclick = videoPlay;
+	}
+	function videoPlay(){
+		video.play();
+		videoBut.innerText = '停止';
+		xc = setInterval(function(){
+			try{
+				var txt = qrDecode.decodeByDom(video);
+				var msg = document.createElement("div")
+				msg.innerHTML = "识别到二维码: " + txt;
+				document.body.appendChild(msg);
+				videoStop();
+			}catch(err){
+				console.log(err);
+			}
+		},300)
+		videoBut.onclick = videoStop;
+	}
+</script>
+
 </html>
@@ -1,32 +0,0 @@
-var qrcodeDecode = require('../browser')
-
-document.getElementById('file').onchange = function (event) {
-	var el = event.target;
-	if (!el.files.length) return;
-	var file = el.files[0];
-	new Promise(function (ok, no) {
-		if (window.URL && window.URL.createObjectURL) {
-			ok(window.URL.createObjectURL(file));
-		} else if (typeof FileReader) {
-			var reader = new FileReader();
-			reader.onload = evt => {
-				ok(evt.target.result);
-			};
-			reader.readAsDataURL(file);
-		} else {
-			no('浏览器不支持');
-		}
-	}).then((src) => {
-		qrcodeDecode.decodeByUrl(src, function (err, txt) {
-			var msg = document.createElement("div")
-			if (err) {
-				console.log(err);
-				msg.innerHTML = "err: <br>" + err;
-			} else {
-				msg.innerHTML = txt;
-			}
-			document.body.appendChild(msg);
-		})
-
-	});
-}
@@ -1,14 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<meta http-equiv="X-UA-Compatible" content="ie=edge">
-	<title>qrcode-decode</title>
-</head>
-<body>
-	<input type="file" name="file" id="file"><br>
-	<div></div>
-</body>
-<script type="text/javascript" src="/test.b0eca09c.js"></script>
-</html>
@@ -1,13 +1,13 @@
 /*!
- * qr-decode v0.0.1
+ * qr-decode v0.0.3
 * (c) 2018-present cnwhy <w.why@163.com>
 * Released under the ISC License.
 */
 (function (global, factory) {
-	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-	typeof define === 'function' && define.amd ? define(['exports'], factory) :
-	(factory((global.qrDecode = {})));
-}(this, (function (exports) { 'use strict';
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.qrDecode = factory());
+}(this, (function () { 'use strict';

 	function AlignmentPattern(posX, posY, estimatedModuleSize) {
 	  this.x = posX;
@@ -847,8 +847,87 @@
 	  if (number >= 0) return number >> bits;else return (number >> bits) + (2 << ~bits);
 	};

+	var ObjDP = Object.defineProperty;
+
+	function addAttr(obj, prop, value) {
+	  ObjDP(obj, prop, {
+	    configurable: true,
+	    value: value
+	  });
+	}
+
+	var Matrix = {
+	  getPoint: function getPoint(x, y) {
+	    return this[this.width * y + x];
+	  },
+	  setPoint: function setPoint(x, y, v) {
+	    return this[this.width * y + x] = v;
+	  },
+	  getRow: function getRow(y) {
+	    var start = this.width * y;
+	    return this.slice(start, start + this.width);
+	  },
+	  getColumn: function getColumn(x) {
+	    var col = [];
+	    var y = 0;
+
+	    while (y + x < this.length) {
+	      col.push(this[y + x]);
+	      y += this.width;
+	    }
+
+	    return col;
+	  },
+	  getHeight: function getHeight() {
+	    return Math.ceil(this.length / width);
+	  }
+	};
+
+	var extendArray2Matrix_1 = function (arr, width) {
+	  addAttr(arr, 'width', width);
+	  ObjDP(arr, 'height', {
+	    get: Matrix.getHeight
+	  });
+	  addAttr(arr, 'get', Matrix.getPoint);
+	  addAttr(arr, 'set', Matrix.setPoint);
+	  addAttr(arr, 'getRow', Matrix.getRow);
+	  addAttr(arr, 'getColumn', Matrix.getColumn);
+	  return arr;
+	};
+	/**
+	 * imageData对像转灰度矩阵
+	 * @param {object} imageData 
+	 */
+
+
+	var imageData2greyMatrix = function (imageData) {
+	  var data = imageData.data,
+	      width = imageData.width,
+	      height = imageData.height;
+	  var greyscalePixels = [];
+
+	  for (var x = 0; x < width; x++) {
+	    for (var y = 0; y < height; y++) {
+	      var p = (y * width + x) * 4;
+	      var r = data[p + 0];
+	      var g = data[p + 1];
+	      var b = data[p + 2];
+	      var a = data[p + 3];
+	      greyscalePixels.push((r * 0.2126 + g * 0.7152 + b * 0.0722) * a / 255);
+	    }
+
+	    extendArray2Matrix(greyscalePixels);
+	    return greyscalePixels;
+	  }
+	};
+
+	var Matrix2bitMatrix = function (Matrix) {}; //exports.getPointAtMatrix
+
 	var utils = {
-		URShift: URShift
+		URShift: URShift,
+		extendArray2Matrix: extendArray2Matrix_1,
+		imageData2greyMatrix: imageData2greyMatrix,
+		Matrix2bitMatrix: Matrix2bitMatrix
 	};

 	function ErrorCorrectionLevel(ordinal, bits, name) {
@@ -965,7 +1044,7 @@

 	var URShift$2 = utils.URShift;

-	function BitMatrix(width, height) {
+	function BitMatrix$1(width, height) {
 	  if (!height) height = width;

 	  if (width < 1 || height < 1) {
@@ -1052,7 +1131,7 @@
 	  };
 	}

-	var BitMatix = BitMatrix;
+	var BitMatix = BitMatrix$1;

 	function ECB(count, dataCodewords) {
 	  this.count = count;
@@ -2891,8 +2970,10 @@

 	Decoder.decode = function (bits) {
 	  var parser = new BitMatrixParser(bits);
-	  var version = parser.readVersion();
-	  var ecLevel = parser.readFormatInformation().ErrorCorrectionLevel; // Read codewords
+	  var version = parser.readVersion(); //版本信息
+
+	  var ecLevel = parser.readFormatInformation().ErrorCorrectionLevel; //格式信息
+	  // Read codewords

 	  var codewords = parser.readCodewords(); // Separate into data blocks

@@ -2925,7 +3006,12 @@

 	var Decoder_1 = Decoder;

-	var debug = false; // 获取指定位置的灰度
+	var debug = false;
+	/**
+	 * 返回获取指定位置的灰度的函数
+	 * @param {ImageData} data 
+	 * @param {Object} base 一个有width,height信息
+	 */

 	var Pixel = function Pixel(data, base) {
 	  return function (x, y) {
@@ -2940,7 +3026,7 @@

 	var binarize = function binarize(data, base, th) {
 	  var ret = new Array(base.width * base.height);
-	  var getPixel = Pixel(data, base);
+	  var getPixel = Pixel(data, base); //

 	  for (var y = 0; y < base.height; y++) {
 	    for (var x = 0; x < base.width; x++) {
@@ -3007,8 +3093,9 @@
 	var decodeByDom = function decodeByDom(dom) {
 	  var canvas = document.createElement("canvas");
 	  var ctx = canvas.getContext('2d');
-	  canvas.width = dom.width;
-	  canvas.height = dom.height;
+	  var isVideo = dom.tagName == 'VIDEO';
+	  canvas.width = isVideo ? dom.videoWidth : dom.width;
+	  canvas.height = isVideo ? dom.videoHeight : dom.height;
 	  ctx.drawImage(dom, 0, 0, canvas.width, canvas.height);
 	  var data = ctx.getImageData(0, 0, canvas.width, canvas.height);
 	  return QRDecode(data);
@@ -3034,8 +3121,6 @@
 	QRDecode.decodeByUrl = decodeByUrl;
 	var browser = QRDecode;

-	exports.default = browser;
-
-	Object.defineProperty(exports, '__esModule', { value: true });
+	return browser;

 })));
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="refresh" content="0;url=./demo/" />
+  </head>
+</html>
@@ -1,6 +1,6 @@
 {
  "name": "qr-decode",
-  "version": "0.0.1",
+  "version": "0.0.3",
  "description": "QRCode parser/decode",
  "main": "src/QRCodeDecode.js",
  "files": [
@@ -13,7 +13,7 @@
  "scripts": {
    "test": "node test/node.js",
    "demo": "parcel ./demo/index.html",
-    "build": "bili browser.js --format umd,umd-min --banner --exports named"
+    "build": "bili browser.js --format umd,umd-min --banner"
  },
  "repository": {
    "type": "git",
@@ -40,6 +40,7 @@
  "dependencies": {
    "bmp-js": "^0.1.0",
    "image-type": "^3.0.0",
+    "jsqr": "^1.1.1",
    "pako": "^1.0.6"
  }
-}
+}
@@ -1,7 +1,7 @@
 var fs = require('fs')
 var imgType = require('image-type')
 var imgDecode = require('./src/imageDecode')
-var qrDecode = require('./src/QRDecode')
+var qrDecode = require('./src/')

 /**
 * 通过Buffer识别二维码
@@ -3,7 +3,11 @@ var Decoder = require('./lib/Decoder');
 var debug = false;


-// 获取指定位置的灰度
+/**
+ * 返回获取指定位置的灰度的函数
+ * @param {ImageData} data 
+ * @param {Object} base 一个有width,height信息
+ */
 var Pixel = function (data,base) {
 	return function(x,y){
 		if (base.width < x || base.height < y) {
@@ -16,7 +20,7 @@ var Pixel = function (data,base) {

 var binarize = function(data,base,th){
 	var ret = new Array(base.width * base.height);
-	var getPixel = Pixel(data,base);
+	var getPixel = Pixel(data,base); //
    for (var y = 0; y < base.height; y++) {
        for (var x = 0; x < base.width; x++) {
            var gray = getPixel(x, y);
@@ -0,0 +1,4 @@
+var jsqr = require('jsqr');
+module.exports = function(imageData){
+	return jsqr(imageData.data,imageData.width,imageData.height).data;
+}
@@ -32,8 +32,8 @@ Decoder.correctErrors = function (codewordBytes, numDataCodewords) {

 Decoder.decode = function (bits) {
 	var parser = new BitMatrixParser(bits);
-	var version = parser.readVersion();
-	var ecLevel = parser.readFormatInformation().ErrorCorrectionLevel;
+	var version = parser.readVersion(); //版本信息
+	var ecLevel = parser.readFormatInformation().ErrorCorrectionLevel; //格式信息

 	// Read codewords
 	var codewords = parser.readCodewords();
Author	SHA1	Message	Date
cnwhy	14edfc7fbb	v0.0.3 use jsqr	2018-07-30 21:11:42 +08:00
cnwhy	2e142c20e8	v0.0.2	2018-07-24 17:32:09 +08:00
cnwhy	a98b9e1129	bugfix	2018-07-24 17:28:43 +08:00