Update index.html

public/index.html

@@ -37,6 +37,8 @@
     <meta name="twitter:image" content="images/logo_transparent_512x512.png">
     <meta property="og:image" content="images/logo_transparent_512x512.png">
     <!-- Resources -->
+    <script src="https://unpkg.com/html5-qrcode/minified/html5-qrcode.min.js"></script>
+    
     <link rel="preload" href="lang/en.json" as="fetch">
     <link rel="preload" href="fonts/OpenSans/static/OpenSans-Medium.ttf" as="font" type="font/ttf" crossorigin>
     <link rel="stylesheet" type="text/css" href="styles/styles-main.css">
@@ -191,6 +193,9 @@
             </svg>
         </div>
     </header>
+
+    <div id="qr-reader" style="display: none;"></div>
+	
     <!-- Center -->
     <div id="center" class="opacity-0">
         <!-- Peers -->
@@ -956,19 +961,15 @@
     </svg>
     <!-- Scripts -->
 
+    <script src="https://unpkg.com/html5-qrcode/minified/html5-qrcode.min.js"></script>
     <script>
         document.addEventListener("DOMContentLoaded", function() {
             const qrBtn = document.getElementById("openQRScanner");
             const qrReader = document.getElementById("qr-reader");
 
-    // Verifique se o botão foi encontrado
-    console.log(qrBtn); // Verificar se o botão foi encontrado corretamente.
-
             if (qrBtn) {
                 qrBtn.addEventListener("click", async () => {
-        console.log("Botão clicado");
+                    qrReader.style.display = "block"; // Mostrar o reador
-        qrReader.style.display = "block";  // Tornar o leitor visível ao clicar
-
                     const html5QrCode = new Html5Qrcode("qr-reader");
 
                     try {
@@ -981,22 +982,21 @@
                                 backCamera.id,
                                 { fps: 10, qrbox: 250 },
                                 qrCodeMessage => {
-                console.log("QR:", qrCodeMessage);
+                                    console.log("QR Detected:", qrCodeMessage);
-                html5QrCode.stop().then(() => {
+                                    html5QrCode.stop(); // Para leitura
-                  qrReader.style.display = "none";
+                                    qrReader.style.display = "none"; // Oculta o leitor
-                  window.location.href = qrCodeMessage;
+                                    window.location.href = qrCodeMessage; // Redireciona
-                });
                                 },
                                 error => {
-                console.error("Erro na leitura do QR Code", error);
+                                    console.warn("QR Code no detected: ", error);
                                 }
                             );
                         } else {
                             alert("📷｜Nenhuma câmera encontrada.");
                         }
-        } catch (err) {
+                    } catch (error) {
-          console.error("Erro ao acessar a câmera: ", err);
+                        console.error("Erro ao acessar a câmera: ", error);
-          alert("🪲｜Erro ao acessar a câmera: " + err);
+                        alert("🪲｜Erro ao acessar a câmera: " + error);
                     }
                 });
             }
@@ -1087,5 +1087,6 @@
             <h3>ErikrafT Drop works only with JavaScript</h3>
         </x-noscript>
     </noscript>
+	
 </body>
 </html>