From 615081cc9542514af77feb1c2148131e442ba371 Mon Sep 17 00:00:00 2001
From: yugasun <yuga_sun@163.com>
Date: Sun, 29 May 2022 11:23:04 +0800
Subject: [PATCH] fix: support customize camera size

---
 demo/camera.html |  8 +++++++-
 src/index.ts     | 17 ++++++++++++++---
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/demo/camera.html b/demo/camera.html
index f7780e9..52af747 100644
--- a/demo/camera.html
+++ b/demo/camera.html
@@ -31,7 +31,13 @@
           throw new Error('Canvas and getUserMedia are required');
         }
 
-        let code = await qr.decodeFromCamera(video);
+        let code = await qr.decodeFromCamera(video,
+          // you can customize your camera size like below
+          // {
+          //   width: 400,
+          //   height: 400,
+          // }
+        );
         console.log('code', code);
         result.innerText = 'Result: ' + code.data;
       }
diff --git a/src/index.ts b/src/index.ts
index 8ee1f4a..5103962 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,6 +1,11 @@
 import { Options } from 'jsqr';
 import jsQR from 'jsqr';
 
+const videoSize = {
+  width: { min: 360, ideal: 720, max: 1080 },
+  height: { min: 360, ideal: 720, max: 1080 },
+};
+
 class QrcodeDecoder {
   timerCapture: null | NodeJS.Timeout;
   canvasElem: null | HTMLCanvasElement;
@@ -20,7 +25,7 @@ class QrcodeDecoder {
     this.getUserMediaHandler = null;
     this.videoConstraints = {
       // default use rear camera
-      video: { facingMode: { exact: 'environment' } },
+      video: { ...videoSize, facingMode: { exact: 'environment' } },
       audio: false,
     };
 
@@ -150,7 +155,7 @@ class QrcodeDecoder {
    *  inversionAttempts - (attemptBoth (default), dontInvert, onlyInvert, or invertFirst)
    *  refer to jsqr options: https://github.com/cozmo/jsQR
    */
-  async decodeFromCamera(videoElem: HTMLVideoElement, options = {}) {
+  async decodeFromCamera(videoElem: HTMLVideoElement, options: any = {}) {
     const opts = {
       ...this.defaultOption,
       ...options,
@@ -169,7 +174,13 @@ class QrcodeDecoder {
         console.log('[OverconstrainedError] Can not use rear camera.');
 
         stream = await navigator.mediaDevices.getUserMedia({
-          video: true,
+          video: {
+            ...videoSize,
+            ...{
+              width: opts.width,
+              height: opts.height,
+            },
+          },
           audio: false,
         });
       } else {