`; mimeType = 'text/html'; break; case 'md': content = `# Justified Text\n\n\`\`\`\n${text}\n\`\`\``; mimeType = 'text/markdown'; break; }const blob = new Blob([content], { type: mimeType }); const url = URL.createObjectURL(blob); const link = document.createElement('a'); link.href = url; link.download = filename; document.body.appendChild(link); link.click(); document.body.removeChild(link); URL.revokeObjectURL(url); showToast(`Exported as ${format.toUpperCase()} successfully`); }// UI Event Handlers document.addEventListener('DOMContentLoaded', () => { const inputText = document.getElementById('input-text'); const widthType = document.getElementById('width-type'); const charCount = document.getElementById('char-count'); const customWidth = document.getElementById('custom-width'); const breakWords = document.getElementById('break-words'); const justifyLast = document.getElementById('justify-last'); const preserveIndent = document.getElementById('preserve-indent'); const spacing = document.getElementById('spacing'); const spacingValue = document.getElementById('spacing-value'); const justifyBtn = document.getElementById('justify-btn'); const copyBtn = document.getElementById('copy-btn'); const resetBtn = document.getElementById('reset-btn'); const exportBtn = document.getElementById('export-btn'); const preview = document.getElementById('preview'); // Width type change handler widthType.addEventListener('change', () => { document.getElementById('char-count-group').style.display = widthType.value === 'chars' ? 'block' : 'none'; document.getElementById('custom-width-group').style.display = widthType.value === 'custom' ? 'block' : 'none'; }); // Spacing range handler spacing.addEventListener('input', () => { spacingValue.textContent = `${spacing.value}x`; }); // Export button handler exportBtn.addEventListener('click', () => { const dropdown = document.querySelector('.export-dropdown'); dropdown.classList.toggle('show'); });// Export format options handler document.querySelectorAll('.export-option').forEach(button => { button.addEventListener('click', () => { const format = button.getAttribute('data-format'); const preElement = preview.querySelector('pre'); if (preElement?.textContent) { exportText(preElement.textContent, format); } document.querySelector('.export-dropdown').classList.remove('show'); }); });// Close dropdown when clicking outside document.addEventListener('click', (e) => { if (!e.target.matches('#export-btn') && !e.target.matches('.export-option')) { document.querySelector('.export-dropdown').classList.remove('show'); } }); // Justify button handler justifyBtn.addEventListener('click', () => { const text = inputText.value; if (!text.trim()) { showToast('Please enter some text', 'error'); return; } let maxWidth; if (widthType.value === 'chars') { maxWidth = parseInt(charCount.value); } else if (widthType.value === 'longest') { maxWidth = Math.max(...text.split('\n').map(line => line.length)); } else { maxWidth = Math.floor(parseInt(customWidth.value) / 8); // Approximate chars from pixels } const options = { breakWords: breakWords.checked, justifyLast: justifyLast.checked, preserveIndent: preserveIndent.checked, spacing: parseFloat(spacing.value) }; try { const justified = justifyText(text, maxWidth, options); preview.innerHTML = `

${justified}

`; showToast('Text justified successfully'); } catch (error) { showToast('Error justifying text', 'error'); console.error(error); } }); // Copy button handler copyBtn.addEventListener('click', () => { const preElement = preview.querySelector('pre'); if (!preElement?.textContent) { showToast('No text to copy', 'error'); return; } navigator.clipboard.writeText(preElement.textContent) .then(() => showToast('Text copied to clipboard')) .catch(() => showToast('Failed to copy text', 'error')); }); // Reset button handler resetBtn.addEventListener('click', () => { inputText.value = ''; widthType.value = 'chars'; charCount.value = '40'; customWidth.value = '400'; breakWords.checked = false; justifyLast.checked = false; preserveIndent.checked = false; spacing.value = '1'; spacingValue.textContent = '1x'; preview.innerHTML = ''; document.getElementById('char-count-group').style.display = 'block'; document.getElementById('custom-width-group').style.display = 'none'; showToast('Settings reset'); }); });