qrcode reader wip

bokkypoobah · May 10, 2024 · afa4bf7 · afa4bf7
1 parent 35b9655
commit afa4bf7
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 0 deletions.
diff --git a/docs/js/html5-qrcode.min.js b/docs/js/html5-qrcode.min.js
diff --git a/docs/offline.html b/docs/offline.html
@@ -19,6 +19,7 @@
     <script src="js/bootstrap-vue-icons.min.js"></script>
     <script src="js/ethers-5.7.umd.min.js" type="application/javascript"></script>
     <script src="js/moment.min.js"></script>
+    <script src="js/html5-qrcode.min.js"></script>
     <script src="globals.js"></script>
     <script src="chains.js"></script>
     <script src="deploymentData.js"></script>
@@ -288,6 +289,17 @@
             </b-table>
           </b-card>
 
+          <b-card sub-title="QRCode" class="m-0 p-0 border-0" body-class="m-1 p-0">
+            <div id="reader" style="max-width: 600px;"></div>
+            <!-- <div class="d-flex flex-wrap m-0 p-0">
+              <div class="mt-0 pr-1">
+                <div id="reader" width="600px"></div>
+              </div>
+              <div class="mt-0 pr-1">
+              </div>
+            </div> -->
+          </b-card>
+
           <!-- :ETH -->
           <b-card v-if="settings.tabIndex == 1" class="m-0 p-0 border-0" body-class="m-1 p-0">
             <!-- :SIGNETHTX -->
@@ -1345,6 +1357,25 @@
               Vue.set(this.chains, chainId, name);
             }
           }
+
+          function onScanSuccess(decodedText, decodedResult) {
+            // handle the scanned code as you like, for example:
+            console.log(`Code matched = ${decodedText}`, decodedResult);
+          }
+
+          function onScanFailure(error) {
+            // handle scan failure, usually better to ignore and keep scanning.
+            // for example:
+            console.warn(`Code scan error = ${error}`);
+          }
+
+          let html5QrcodeScanner = new Html5QrcodeScanner(
+            "reader",
+            { fps: 10, qrbox: {width: 250, height: 250} },
+            /* verbose= */ false);
+          html5QrcodeScanner.render(onScanSuccess, onScanFailure);
+
+
           // console.log("this.chains: " + JSON.stringify(this.chains, null, 2));
           if ('topSecretsOfflineAddresses' in localStorage) {
             this.addresses = JSON.parse(localStorage.topSecretsOfflineAddresses);

diff --git a/docs/online.html b/docs/online.html
@@ -19,6 +19,7 @@
     <script src="js/bootstrap-vue-icons.min.js"></script>
     <script src="js/ethers-5.7.umd.min.js" type="application/javascript"></script>
     <script src="js/moment.min.js"></script>
+    <script src="js/html5-qrcode.min.js"></script>
     <script src="globals.js"></script>
     <script src="chains.js"></script>
     <script src="deploymentData.js"></script>