${escapeHTML(item.content)}

`; }).join(''); } // --- MODAL LOGIC --- function openModal(topic = null) { ui.modalForm.reset(); if (topic) { ui.modalTitle.textContent = "Edit Topic"; document.getElementById('flw-topic-id').value = topic.id; document.getElementById('flw-topic-title').value = topic.title; document.getElementById('flw-topic-category').value = topic.category; document.getElementById('flw-topic-content').value = topic.content; } else { ui.modalTitle.textContent = "Add New Topic"; document.getElementById('flw-topic-id').value = ''; } ui.modal.style.display = 'block'; } function closeModal() { ui.modal.style.display = 'none'; } // --- EVENT HANDLERS --- ui.topicSelector.addEventListener('change', e => { if (e.target.classList.contains('flw-topic-checkbox')) { renderPreview(); } }); ui.addNewBtn.addEventListener('click', () => openModal()); ui.closeModalBtn.addEventListener('click', closeModal); window.addEventListener('click', e => { if (e.target == ui.modal) closeModal(); }); ui.modalForm.addEventListener('submit', e => { e.preventDefault(); const id = parseInt(document.getElementById('flw-topic-id').value); const topic = { id: id || Date.now(), title: document.getElementById('flw-topic-title').value, category: document.getElementById('flw-topic-category').value, content: document.getElementById('flw-topic-content').value, }; if (id) { const index = contentLibrary.findIndex(item => item.id === id); contentLibrary[index] = topic; } else { contentLibrary.push(topic); } saveState(); renderAll(); closeModal(); }); ui.contentList.addEventListener('click', e => { const id = parseInt(e.target.dataset.id); if (e.target.classList.contains('flw-edit-btn')) { const topic = contentLibrary.find(item => item.id === id); openModal(topic); } if (e.target.classList.contains('flw-delete-btn')) { if (confirm('Are you sure you want to delete this topic?')) { contentLibrary = contentLibrary.filter(item => item.id !== id); saveState(); renderAll(); } } }); ui.downloadPdfBtn.addEventListener('click', () => { const { jsPDF } = window.jspdf; if (!jsPDF) { alert("PDF library not loaded!"); return; } const selectedIds = [...document.querySelectorAll('.flw-topic-checkbox:checked')].map(cb => parseInt(cb.dataset.id)); if (selectedIds.length === 0) { alert("Please select at least one topic to include in your handout."); return; } const doc = new jsPDF(); doc.setFontSize(18); doc.text("Financial Literacy Workshop Handout", 14, 22); let yPos = 35; selectedIds.forEach(id => { const item = contentLibrary.find(i => i.id === id); if (yPos > 260) { // Check for page break doc.addPage(); yPos = 20; } doc.setFontSize(14); doc.setFont(undefined, 'bold'); doc.text(item.title, 14, yPos); yPos += 8; doc.setFontSize(10); doc.setFont(undefined, 'normal'); const lines = doc.splitTextToSize(item.content, 180); // 180mm width doc.text(lines, 14, yPos); yPos += (lines.length * 4) + 10; // 4mm per line + 10mm padding }); doc.save("Financial_Literacy_Handout.pdf"); }); // --- TABBING LOGIC --- function switchTab(targetTabId) { ui.tabContents.forEach(c => c.classList.remove('active')); ui.tabButtons.forEach(b => b.classList.remove('active')); document.getElementById(`flw-tab-${targetTabId}`).classList.add('active'); document.querySelector(`.flw-tab-button[data-tab="${targetTabId}"]`).classList.add('active'); } function navigateTabs(dir) { const tabs = Array.from(ui.tabButtons); const active = tabs.find(t => t.classList.contains('active')); let index = tabs.indexOf(active) + dir; if (index < 0) index = 0; if (index >= tabs.length) index = tabs.length - 1; switchTab(tabs[index].dataset.tab); } ui.tabButtons.forEach(button => button.addEventListener('click', () => switchTab(button.dataset.tab))); ui.nextTabBtn.addEventListener('click', () => navigateTabs(1)); ui.prevTabBtn.addEventListener('click', () => navigateTabs(-1)); // --- UTILITY --- function escapeHTML(str) { const p = document.createElement('p'); p.textContent = str; return p.innerHTML; } // --- INITIALIZATION --- loadState(); renderAll(); });