From 0b59329f3f2ad152be6dfbb584ed32b017c49a05 Mon Sep 17 00:00:00 2001 From: Paul Zietsman Date: Sat, 18 Feb 2017 11:13:50 +0200 Subject: [PATCH 1/2] Canvas dimensions fix Changed canvas dimensions to be minimum of 500x500. This fixes the issue where the video display size is too small to successfully identify the QR code. --- qr-scanner.js | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/qr-scanner.js b/qr-scanner.js index 6f3a309..95cb2d2 100644 --- a/qr-scanner.js +++ b/qr-scanner.js @@ -15,28 +15,31 @@ angular.module('qrScanner', ["ng"]).directive('qrScanner', ['$interval', '$windo ngVideoError: '&ngVideoError' }, link: function(scope, element, attrs) { - + window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL; navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; - + var height = attrs.height || 300; var width = attrs.width || 250; - + + var cheight = height < 500 ? 500 : height; + var cwidth = width < 500 ? 500 : width; + var video = $window.document.createElement('video'); video.setAttribute('width', width); video.setAttribute('height', height); video.setAttribute('style', '-moz-transform:rotateY(-180deg);-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg);'); var canvas = $window.document.createElement('canvas'); canvas.setAttribute('id', 'qr-canvas'); - canvas.setAttribute('width', width); - canvas.setAttribute('height', height); - canvas.setAttribute('style', 'display:none;'); - + canvas.setAttribute('width', cwidth); + canvas.setAttribute('height', cheight); + canvas.setAttribute('style', 'display:none;'); + angular.element(element).append(video); angular.element(element).append(canvas); - var context = canvas.getContext('2d'); + var context = canvas.getContext('2d'); var stopScan; - + var scan = function() { if ($window.localMediaStream) { context.drawImage(video, 0, 0, 307,250); From 04872b08e67626122d2077734195c3c59b709b65 Mon Sep 17 00:00:00 2001 From: Paul Zietsman Date: Sat, 18 Feb 2017 11:15:55 +0200 Subject: [PATCH 2/2] Fixed spaces --- qr-scanner.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/qr-scanner.js b/qr-scanner.js index 95cb2d2..0f05af3 100644 --- a/qr-scanner.js +++ b/qr-scanner.js @@ -22,8 +22,8 @@ angular.module('qrScanner', ["ng"]).directive('qrScanner', ['$interval', '$windo var height = attrs.height || 300; var width = attrs.width || 250; - var cheight = height < 500 ? 500 : height; - var cwidth = width < 500 ? 500 : width; + var cheight = height < 500 ? 500 : height; + var cwidth = width < 500 ? 500 : width; var video = $window.document.createElement('video'); video.setAttribute('width', width);