Added qrstest.html

joembedded · Sep 3, 2024 · 0dfdae4 · 0dfdae4
1 parent 1dab083
commit 0dfdae4
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 3 deletions.
diff --git a/app/js/qrscanner.js b/app/js/qrscanner.js
@@ -2,14 +2,12 @@
 
 /*
     qrscanner verwendet die BarcodeDetector API, ist aber Stand Anf. 2024 nur auf Android vorhanden
-    Ansonsten  Barcode Polyfill: - https://github.com/cozmo/jsQR  V1.4.0
+    Ansonsten  Barcode Polyfill: - https://github.com/cozmo/jsQR  V1.4.0 (und wenn windows.debug > 1)
     Cozmo QR: works so lala, but only for Text
     Distribute: uglifyjs --warn ./js_dev/jsQR.js -m -c -o ./js_dev/jsQR.min.js
     (Version: uglify-es 3.3.9 )
     src="./js_dev/jsQR.js" : 250kB
     src="./js_dev/jsQR.min.js" 130kB
-
-    <script src="./js_dev/jsQR.min.js"></script>
 */
 // Only for Development: (see index.html)
 if (window.jdDebug > 1) {
@@ -299,6 +297,7 @@ async function camWorker() {
                 barcode.every(async (b) => {
                     const rawstring = b.rawValue.replace(/(\r\n|\n|\r)/gm, " ");
                     if (rawstring !== '') { // only for readable codes!
+                        //console.log(`Raw: '${rawstring}'`)
                         scaledVideoCanvas.style.borderColor = 'darkgreen' // Found something
                         const fn = scannedResults.find((e) => { return e.qrValue === rawstring })
                         let qcol = 'red' // Assume Ignored

diff --git a/app/js/qrstest.js b/app/js/qrstest.js
@@ -0,0 +1,26 @@
+// qrtest.js Tests qrscanner.js
+
+import * as QRS from './qrscanner.js' // *todo* './qrscanner.min.js'
+
+function terminal(txt){
+    document.getElementById("vout").innerText += `\nQR: ${txt}`
+}
+
+// Returns (siehe qrscanner.js): -1:Ignored, 0:AcceptedUndEnde, 1:AcceptedAberNochMehrErlaubt undefined:diesenScanignorieren
+function scanFoundAddDevice(scanresult) {
+    terminal(`SCAN: '${scanresult}'`)
+    return 1 // MORE
+}
+
+document.getElementById("scanButton").addEventListener('click', async () => {
+    QRS.setQrLogPrint(terminal)     // Scanner-printf via Terminal-printf
+    QRS.setScanCallback(scanFoundAddDevice)
+    QRS.clearScannedResults()
+    const sres = await QRS.openSelectedCamera() // Implizit initCameras falls noetig, nicht aber beide!
+    if (typeof sres == 'string') {
+        alert(sres)
+        return
+    }
+    await QRS.scannerBusy()
+})
+
diff --git a/app/qrstest.html b/app/qrstest.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- 
+    Tests: 
+    http://localhost/wrk/joemdash/app/qrstest.html 
+    https://joembedded.github.io/JoEm-Dashboard/app/qrstest.html
+
+    Mobile: 7*Tap auf "Buildnummer" im Setup-SW->Softwareinformationen, 
+    dann Entwickleroptionen: USB-Debugging ON 
+    
+    Dann load auf Mobile via localhost
+    dann chrome://inspect/#devices
+    Evtl. auf Mobile "Debugging Zulassen" aktivieren, damit erkannt wird
+    Debuggen startet via "inspect"
+
+    (Gute Anleitung: https://www.till.net/technologie/html-javascript/remote-web-debugging-unter-android-und-chrome )
+-->
+
+<html lang="en">
+
+<head>
+
+    <script>
+    window.jdDebug = 2 //  <=1:NoQRScannerPolyfill, >1:Debug,ScannerPolyfill
+    console.log(`Debuglevel ${window.jdDebug}`)
+    </script>
+
+    <link rel="stylesheet" href="./css/qrscanner.css">
+
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>QR Scanner Test</title>
+
+</head>
+
+<body>
+    <button id="scanButton"> SCAN </button>
+    <hr><div id="vout">--- Info: ---</div><hr>
+</body>
+
+<script src="./js/qrstest.js" type="module"></script>
+
+
+</html>