`;
showView('post');
};
const showView = (view) => {
boardView.classList.toggle('hidden', view !== 'board');
postView.classList.toggle('hidden', view !== 'post');
};
// --- EVENT LISTENERS ---
newPostBtn.addEventListener('click', () => newPostModal.classList.remove('hidden'));
cancelPostBtn.addEventListener('click', () => newPostModal.classList.add('hidden'));
submitPostBtn.addEventListener('click', () => {
const author = authorInput.value.trim() || 'Anonymous';
const subject = subjectInput.value.trim();
const title = titleInput.value.trim();
const body = bodyInput.value.trim();
if (!subject || !title || !body) {
alert('Please fill out all required fields.');
return;
}
discussions.push({
id: Date.now(),
author, subject, title, body,
timestamp: new Date().toLocaleString(),
replies: []
});
authorInput.value = '';
subjectInput.value = '';
titleInput.value = '';
bodyInput.value = '';
newPostModal.classList.add('hidden');
renderBoard();
});
threadList.addEventListener('click', (e) => {
const threadCard = e.target.closest('.thread-card');
if (threadCard) {
renderPost(parseInt(threadCard.dataset.id));
}
});
postView.addEventListener('click', (e) => {
if (e.target.id === 'back-to-board-btn') {
showView('board');
}
if (e.target.id === 'submit-reply-btn') {
const postId = parseInt(e.target.dataset.id);
const author = document.getElementById('reply-author').value.trim() || 'Anonymous';
const body = document.getElementById('reply-body').value.trim();
if (!body) return;
const thread = discussions.find(d => d.id === postId);
if (thread) {
thread.replies.push({ author, body, timestamp: new Date().toLocaleString() });
renderPost(postId);
}
}
if (e.target.classList.contains('download-pdf-btn')) {
downloadDiscussionAsPDF(parseInt(e.target.dataset.id));
}
});
// --- PDF DOWNLOAD ---
const downloadDiscussionAsPDF = (postId) => {
const thread = discussions.find(d => d.id === postId);
if (!thread) return;
const { jsPDF } = window.jspdf;
const doc = new jsPDF();
doc.setFontSize(18);
doc.text(thread.title, 105, 20, { align: 'center' });
doc.setFontSize(10);
doc.text(`Subject: ${thread.subject} | By: ${thread.author} | On: ${thread.timestamp}`, 105, 28, { align: 'center' });
doc.setFontSize(12);
const bodyLines = doc.splitTextToSize(thread.body, 180);
doc.text(bodyLines, 14, 45);
let finalY = 45 + (bodyLines.length * 5) + 10;
if (thread.replies.length > 0) {
doc.setFontSize(14);
doc.text('Replies', 14, finalY);
finalY += 5;
const replyData = thread.replies.map(reply => [
`${reply.author} (${reply.timestamp})`,
reply.body
]);
doc.autoTable({
head: [['Author & Time', 'Reply']],
body: replyData,
startY: finalY,
theme: 'grid'
});
}
doc.save(`discussion-${thread.id}.pdf`);
};
// --- INITIALIZATION ---
loadSampleData();
});