packages/auth/package.json

@@ -33,7 +33,7 @@
     "@open-wc/scoped-elements": "^1.1.1",
     "dbp-common": "^1.0.0",
     "event-target-shim": "^5.0.1",
-    "keycloak-js": "^11.0.2",
+    "keycloak-js": "^10.0",
     "lit-element": "^2.3.1"
   },
   "scripts": {

packages/location-select/package.json

@@ -30,7 +30,7 @@
     "dbp-auth": "^1.0.0",
     "dbp-common": "^1.0.0",
     "jquery": "^3.4.1",
-    "keycloak-js": "^11.0.2",
+    "keycloak-js": "^10.0",
     "lit-element": "^2.3.1",
     "select2": "^4.0.10"
   },

packages/person-select/package.json

@@ -30,7 +30,7 @@
     "dbp-auth": "^1.0.0",
     "dbp-common": "^1.0.0",
     "jquery": "^3.4.1",
-    "keycloak-js": "^11.0.2",
+    "keycloak-js": "^10.0",
     "lit-element": "^2.3.1",
     "select2": "^4.0.10"
   },

packages/qr-code-scanner/src/i18n/de/translation.json

@@ -3,7 +3,7 @@
   "finished-scan": "Scannen erfolgreich abgeschlossen.",
   "loading-video": "Video laden ...",
   "no-qr-detected": "Kein QR-Code erkannt.",
-  "no-support": "Ihr Gerät unterstützt keine Videoaufnahmen,",
+  "no-support": "Ihr Browser unterstützt keine Videoaufnahmen.",
   "data": "Inhalt",
   "camera": "Kamera ",
   "front-camera": "Vordere Kamera",

packages/qr-code-scanner/src/i18n/en/translation.json

@@ -3,7 +3,7 @@
   "finished-scan": "Finished scanning successfully.",
   "loading-video": "⌛ Loading video...",
   "no-qr-detected": "No QR code detected.",
-  "no-support": "Your device does not support video recording.",
+  "no-support": "Your browser does not support video recording.",
   "data": "Data",
   "camera": "Camera ",
   "front-camera": "Frontcamera",

packages/qr-code-scanner/src/qr-code-scanner.js

@@ -73,12 +73,22 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
         });
     }
 
+    disconnectedCallback() {
+        this.stopScanning();
+        super.disconnectedCallback();
+    }
+
     updated(changedProperties) {
         if (changedProperties.get('stopScan') && !this.stopScan) {
             this.qrCodeScannerInit();
         }
     };
 
+    /**
+     * Ckecks if browser support video recording
+     * Gets video devices of device
+     *
+     */
     checkSupport() {
         const that = this;
         let devices_map = new Map();
@@ -88,8 +98,6 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
             navigator.mediaDevices.enumerateDevices()
                 .then(function (devices) {
                     devices.forEach(function (device) {
-                        //console.log(device.kind + ": " + device.label +  " id = " + device.deviceId);
-                        // that._("#error").innerText += " | device.kind: " + device.kind + " id: " + device.deviceId + " label: " + device.label + " | ";
                         if (device.kind === 'videoinput') {
                             let id = device.deviceId;
                             if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
@@ -112,10 +120,8 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
                     if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
                         that.activeCamera = 'environment';
                     } else {
-                        that.activeCamera = Array.from(devices_map)[0][0];
+                        that.activeCamera = devices_map.size ? Array.from(devices_map)[0][0] : '';
                     }
-
-
                 })
                 .catch(function (err) {
                     console.log(err.name + ": " + err.message);
@@ -127,7 +133,6 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
                 const results = [];
                 for (let i = 0; i !== sourceInfos.length; ++i) {
                     const sourceInfo = sourceInfos[i];
-                    // that._("#error").innerText += " * kind: " + sourceInfo.kind + " id: " + sourceInfo.id + " label: " + sourceInfo.label + " * ";
                     if (sourceInfo.kind === 'video') {
                         devices_map.set(sourceInfo.id ? sourceInfo.id : true, sourceInfo.label || i18n.t('camera') + (devices_map.size + 1))
                         results.push({
@@ -141,7 +146,7 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
                 if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
                     that.activeCamera = 'environment';
                 } else {
-                    that.activeCamera = Array.from(devices_map)[0][0];
+                    that.activeCamera = devices_map.size ? Array.from(devices_map)[0][0] : '';
                 }
                 resolve(results);
             }
@@ -153,17 +158,25 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
 
     }
 
+    /**
+     * Get a loading message
+     *
+     * @param string
+     */
     getLoadingMsg(string) {
         let loadingMsg = html `<dbp-mini-spinner class="spinner"></dbp-mini-spinner> ${i18n.t(string)}`;
         return loadingMsg;
     }
 
+    /**
+     * Init and start the video and QR code scan
+     *
+     */
     qrCodeScannerInit() {
 
         this.stopScan = false;
         this.askPermission = true;
 
-
         let video = document.createElement("video");
         let canvasElement = this._("#canvas");
         let canvas = canvasElement.getContext("2d");
@@ -189,7 +202,6 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
 
         let videoId = this.activeCamera;
         let constraint = { video:  { deviceId: videoId } };
-
         if ( (videoId === 'environment' || videoId === '') ) {
             console.log("vid:", videoId);
             constraint =  { video: { facingMode: "environment" } };
@@ -304,10 +316,6 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
                     drawLine(bottomRightCorner, bottomLeftCorner, color);
                     drawLine(bottomLeftCorner, topLeftCorner, color);
 
-                    /*drawLine(code.location.topLeftCorner, code.location.topRightCorner, color);
-                    drawLine(code.location.topRightCorner, code.location.bottomRightCorner, color);
-                    drawLine(code.location.bottomRightCorner, code.location.bottomLeftCorner, color);
-                    drawLine(code.location.bottomLeftCorner, code.location.topLeftCorner, color);*/
                     outputMessage.hidden = true;
                     outputData.parentElement.hidden = false;
                     outputData.innerText = code.data;
@@ -317,20 +325,35 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
                     outputData.parentElement.hidden = true;
                 }
             }
+            qrContainer.scrollIntoView({ behavior: 'smooth', block: 'start' });
             requestAnimationFrame(tick);
         }
     }
 
+    /**
+     * Update if video source is changed
+     *
+     * @param e
+     */
     updateSource(e) {
         this.activeCamera = e.srcElement.value;
         this.sourceChanged = true;
     }
 
+    /**
+     * Stops the active video and scan process
+     *
+     */
     stopScanning() {
         this.askPermission = false;
         this.videoRunning = false;
     }
 
+    /**
+     * Sends an event with the data which is detected from QR code reader
+     *
+     * @param data
+     */
     sendUrl(data) {
        const event = new CustomEvent("dbp-qr-code-scanner-data",
             {  bubbles: true, composed: true , detail: data});

yarn.lock

@@ -5117,10 +5117,10 @@ karma@^5.0.1, karma@^5.1.0:
     ua-parser-js "0.7.22"
     yargs "^15.3.1"
 
-keycloak-js@^11.0.2:
-  version "11.0.2"
-  resolved "https://registry.yarnpkg.com/keycloak-js/-/keycloak-js-11.0.2.tgz#e981c5270e72066e38b2a1bd98f1138d6cd560c1"
-  integrity sha512-dnvzgTetovu3eTjJtvBQQhxRN4jqvd/DaA2wFaE4aWIFXhwRcoPpZT8ZJ7MwlICDPdCgzbCsOsBjpL8CbYOZsg==
+keycloak-js@^10.0:
+  version "10.0.2"
+  resolved "https://registry.yarnpkg.com/keycloak-js/-/keycloak-js-10.0.2.tgz#f0cf5b942627c5221f1466552c40e4624503b77b"
+  integrity sha512-7nkg4Ob1khHGcNbuK36AMndKUEuIQFpNlWU9ygWs7nSBPCI9VZ8dJjjXfKJHm0ewgcqLFGPIJ6bxxRlfcQ6sLg==
   dependencies:
     base64-js "1.3.1"
     js-sha256 "0.9.0"