Patrick
57 lines
2.1 KiB
JavaScript
57 lines
2.1 KiB
JavaScript
// ═══════════════════════════════════════════════════════
|
|
// QR Code (using qrcode-generator library)
|
|
// ═══════════════════════════════════════════════════════
|
|
function generateQR() {
|
|
const data = document.getElementById('qrInput').value.trim();
|
|
const container = document.getElementById('qrCanvas');
|
|
const ph = document.getElementById('qrPlaceholder');
|
|
if (!data) { container.style.display = 'none'; ph.style.display = ''; return; }
|
|
if (typeof qrcode === 'undefined') { ph.textContent = 'Loading QR library...'; return; }
|
|
|
|
try {
|
|
const qr = qrcode(0, 'M');
|
|
qr.addData(data);
|
|
qr.make();
|
|
container.innerHTML = qr.createSvgTag({ cellSize: 4, margin: 8, scalable: true });
|
|
// Style the SVG
|
|
const svg = container.querySelector('svg');
|
|
if (svg) {
|
|
svg.style.width = '256px';
|
|
svg.style.height = '256px';
|
|
svg.style.background = '#fff';
|
|
svg.style.borderRadius = '12px';
|
|
}
|
|
container.style.display = '';
|
|
ph.style.display = 'none';
|
|
} catch (err) {
|
|
ph.textContent = err.message;
|
|
container.style.display = 'none';
|
|
ph.style.display = '';
|
|
}
|
|
}
|
|
|
|
function downloadQR() {
|
|
const container = document.getElementById('qrCanvas');
|
|
if (container.style.display === 'none') return;
|
|
const svg = container.querySelector('svg');
|
|
if (!svg) return;
|
|
|
|
// Convert SVG to PNG via canvas
|
|
const svgData = new XMLSerializer().serializeToString(svg);
|
|
const img = new Image();
|
|
img.onload = function () {
|
|
const canvas = document.createElement('canvas');
|
|
canvas.width = 512;
|
|
canvas.height = 512;
|
|
const ctx = canvas.getContext('2d');
|
|
ctx.fillStyle = '#ffffff';
|
|
ctx.fillRect(0, 0, 512, 512);
|
|
ctx.drawImage(img, 0, 0, 512, 512);
|
|
const a = document.createElement('a');
|
|
a.href = canvas.toDataURL('image/png');
|
|
a.download = 'qrcode.png';
|
|
a.click();
|
|
};
|
|
img.src = 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svgData)));
|
|
}
|