alex/qrdamage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add reset of advanced

Browse Source 
And fix resolution indicator update bug.
This commit is contained in:
Alexander Wainwright
2025-12-18 19:21:26 +10:00
parent 140287db51
commit 30d86b1fce
1 changed files with 45 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
script.js
View File

@@ -136,33 +136,40 @@ document.addEventListener('DOMContentLoaded', () => {
// --- 4. CORE RENDERER ---
function renderQR() {
// 1. Gather State
const textData = getDataString();
const format = getFormat();
const ecc = QRCode.CorrectLevel[optEcc.value];
const colorDark = optFg.value;
const colorLight = optBg.value;
hexFg.textContent = colorDark;
hexBg.textContent = colorLight;
qrContainer.innerHTML = '';
stickyWrapper.classList.remove('has-error');
if (!textData || textData.trim() === '') {
downloadBtn.disabled = true;
downloadBtn.textContent = `DOWNLOAD ${format.toUpperCase()}`;
return;
}
downloadBtn.textContent = `DOWNLOAD ${format.toUpperCase()}`;
// 2. Validate Size (Do this EARLY so we can update the label)
let size = parseInt(optSize.value) || 256;
if (size < 64) size = 64;
if (size > 4000) size = 4000;
// 3. Update UI Labels (Stateless: Input -> Label)
hexFg.textContent = colorDark;
hexBg.textContent = colorLight;
// Update Resolution Label immediately
const resDisplay = document.getElementById('resolution-display');
if (resDisplay) resDisplay.textContent = `${size} x ${size} px`;
// 4. Reset DOM
qrContainer.innerHTML = '';
stickyWrapper.classList.remove('has-error');
// 5. Handle Empty State (The Early Return)
if (!textData || textData.trim() === '') {
downloadBtn.disabled = true;
downloadBtn.textContent = `DOWNLOAD ${format.toUpperCase()}`;
return; // Stop here. Container is clean, labels are updated.
}
downloadBtn.textContent = `DOWNLOAD ${format.toUpperCase()}`;
// 6. Generate
try {
const instance = new QRCode(qrContainer, {
text: textData,
@@ -173,6 +180,7 @@ document.addEventListener('DOMContentLoaded', () => {
correctLevel : ecc
});
// 7. Post-Process
if (format === 'svg') {
const modules = instance._oQRCode.modules;
const nodes = qrContainer.childNodes;
@@ -186,9 +194,11 @@ document.addEventListener('DOMContentLoaded', () => {
const img = qrContainer.querySelector('img');
if(img) img.style.display = 'block';
}
downloadBtn.disabled = false;
} catch (e) {
// 8. Error Handling
const blob = new Blob([textData]);
const bytes = blob.size;
const maxCapacityMap = { 'L': 2950, 'M': 2328, 'Q': 1660, 'H': 1270 };
@@ -216,22 +226,37 @@ document.addEventListener('DOMContentLoaded', () => {
// --- 5. RESET LOGIC (Button Only) ---
function resetApp() {
// Clear Inputs
// 1. Clear Content Inputs
const inputs = document.querySelectorAll('.input-form input, .input-form textarea');
inputs.forEach(el => el.value = '');
// Reset Mode to Text
// 2. Reset Mode to Text
modeSelector.value = 'text';
// Update UI Classes
// 3. Reset Advanced Configuration to Defaults
optEcc.value = 'H';
optSize.value = '256';
optFg.value = '#000000';
hexFg.textContent = '#000000';
optBg.value = '#ffffff';
hexBg.textContent = '#FFFFFF';
// Reset Format Radio to PNG
for (const r of fmtRadios) {
if (r.value === 'png') r.checked = true;
}
// 4. Update UI Classes (Show Text Form)
document.querySelectorAll('.input-form').forEach(f => f.classList.remove('active'));
document.getElementById('form-text').classList.add('active');
// Update Output
// 5. Update Output (This will clear the QR code since inputs are empty)
handleUpdate(true);
// Focus
const firstField = document.querySelector('#form-text input');
// 6. Focus the first box
const firstField = document.querySelector('#form-text textarea'); // Textarea for text mode
if (firstField) firstField.focus();
}