From 0ebeb08ee47f3a9bfe14a457f2b3cc3ee18caf09 Mon Sep 17 00:00:00 2001
From: Justin Hayes <justinh@rahb.ca>
Date: Thu, 19 Oct 2023 20:12:58 -0400
Subject: [PATCH] download QR

---
 index.html          |  2 +-
 static/generator.js | 19 +++++++++++++++++--
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index d0157ba..44c7c77 100644
--- a/index.html
+++ b/index.html
@@ -163,6 +163,6 @@ <h1><i class="fas fa-qrcode"></i><i class="fas fa-cog"></i></h1>
       </form>
       <div id="qrcode" class="my-5 d-flex justify-content-center"></div>
     </div>
-    <script src="static/generator.js?v=202310192002"></script>
+    <script src="static/generator.js?v=202310192012"></script>
   </body>
 </html>
diff --git a/static/generator.js b/static/generator.js
index 1dfcb81..86c7e43 100644
--- a/static/generator.js
+++ b/static/generator.js
@@ -83,9 +83,24 @@ function generateQRCode() {
     }
 
     $('#qrcode').empty();
-    $('#qrcode').qrcode({
+    const qrCodeCanvas = $('#qrcode').qrcode({
         text: data
-    });
+    })[0].firstChild;
+
+    // Convert the canvas to a PNG data URL
+    const imageData = qrCodeCanvas.toDataURL("image/png");
+
+    // Create a unique filename based on the timestamp
+    const filename = `QRCode_${new Date().toISOString().replace(/[-:.]/g, "")}.png`;
+
+    // Create an anchor element and set its attributes
+    const anchor = document.createElement("a");
+    anchor.href = imageData;
+    anchor.download = filename;
+    anchor.innerHTML = "<img src='" + imageData + "' alt='QR Code'/>";
+    
+    // Clear the QR code container and append the clickable anchor
+    $('#qrcode').empty().append(anchor);
 }
 
 document.addEventListener("DOMContentLoaded", function() {