fix: qr

index.html

@@ -13,8 +13,12 @@
         <input type="text" id="text-input" class="w-full p-2 mb-4 border rounded" placeholder="Enter text to generate QR code">
         <button id="generate-btn" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Generate QR Code</button>
         <canvas id="qr-code" class="mt-4"></canvas>
+        <div id="download-buttons" class="mt-4 hidden">
+            <button id="download-svg" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">Download SVG</button>
+            <button id="download-png" class="bg-yellow-500 hover:bg-yellow-700 text-white font-bold py-2 px-4 rounded">Download PNG</button>
         </div>
-    <script src="https://cdn.jsdelivr.net/npm/qrcode@1.5.1/build/qrcode.min.js"></script>
+    </div>
+    <script src="qrcode.min.js"></script>
     <script src="script.js"></script>
 </body>
 </html>

script.js

@@ -1,24 +1,63 @@
 document.getElementById('generate-btn').addEventListener('click', () => {
     const text = document.getElementById('text-input').value;
     const canvas = document.getElementById('qr-code');
+    const downloadButtons = document.getElementById('download-buttons');
+
     if (text) {
         QRCode.toCanvas(canvas, text, function (error) {
-            if (error) console.error(error);
+            if (error) {
+                console.error(error);
+                return;
+            }
             console.log('QR code generated!');
+            downloadButtons.classList.remove('hidden'); // Show download buttons
         });
     }
 });
 
-// Add QRCode library
-const script = document.createElement('script');
-script.src = 'https://cdnjs.cloudflare.com/ajax/libs/qrcode-generator/1.4.4/qrcode.min.js';
-document.body.appendChild(script);
-
-// Register the Service Worker
-if ('serviceWorker' in navigator) {
-    window.addEventListener('load', () => {
-        navigator.serviceWorker.register('/sw.js')
-            .then(registration => console.log('Service Worker registered:', registration))
-            .catch(error => console.log('Service Worker registration failed:', error));
+// Download QR Code as SVG
+document.getElementById('download-svg').addEventListener('click', () => {
+    const text = document.getElementById('text-input').value;
+    if (text) {
+        QRCode.toString(text, { type: 'svg' }, function (error, svg) {
+            if (error) {
+                console.error(error);
+                return;
+            }
+            const blob = new Blob([svg], { type: 'image/svg+xml' });
+            const url = URL.createObjectURL(blob);
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = 'qrcode.svg';
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            URL.revokeObjectURL(url);
         });
     }
+});
+
+// Download QR Code as PNG
+document.getElementById('download-png').addEventListener('click', () => {
+    const text = document.getElementById('text-input').value;
+    const canvas = document.getElementById('qr-code');
+
+    if (text) {
+        QRCode.toCanvas(canvas, text, function (error) {
+            if (error) {
+                console.error(error);
+                return;
+            }
+            canvas.toBlob(function (blob) {
+                const url = URL.createObjectURL(blob);
+                const link = document.createElement('a');
+                link.href = url;
+                link.download = 'qrcode.png';
+                document.body.appendChild(link);
+                link.click();
+                document.body.removeChild(link);
+                URL.revokeObjectURL(url);
+            }, 'image/png');
+        });
+    }
+});

site.webmanifest

@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}