${date} | ${time}
Attendees:
${attendees.join(', ') || 'N/A'}
Agenda:
| Topic |
Presenter |
Duration (min) |
${agendaItems.map(item => `
| ${item.topic} |
${item.presenter} |
${item.time} |
`).join('')}
| Total Time: |
${totalTime} min |
`;
agendaPreviewOutput.innerHTML = html;
agendaPreviewContainer.style.display = 'block';
downloadPdfBtn.disabled = false;
downloadPdfBtn.classList.replace('bg-gray-600', 'bg-green-600');
downloadPdfBtn.classList.replace('hover:bg-gray-700', 'hover:bg-green-700');
agendaPreviewContainer.scrollIntoView({ behavior: 'smooth' });
};
const generatePDF = () => {
if (downloadPdfBtn.disabled) return;
const { jsPDF } = jspdf;
const doc = new jsPDF();
const title = meetingTitleInput.value;
const date = new Date(meetingDateInput.value).toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric', timeZone: 'UTC' });
const time = `${startTimeInput.value || 'N/A'} - ${endTimeInput.value || 'N/A'}`;
const attendees = attendeesInput.value.split('\n').filter(name => name.trim() !== '').join(', ');
const totalTime = agendaItems.reduce((sum, item) => sum + item.time, 0);
const tableBody = agendaItems.map(item => [item.topic, item.presenter, item.time.toString()]);
tableBody.push([{ content: 'Total Time', colSpan: 2, styles: { halign: 'right', fontStyle: 'bold' } }, { content: `${totalTime} min`, styles: { fontStyle: 'bold' } }]);
doc.setFontSize(20);
doc.text(title, 105, 20, { align: 'center' });
doc.setFontSize(12);
doc.setTextColor(100);
doc.text(`${date} | ${time}`, 105, 28, { align: 'center' });
doc.setFontSize(11);
doc.setFont(undefined, 'bold');
doc.text('Attendees:', 14, 45);
doc.setFont(undefined, 'normal');
const attendeeLines = doc.splitTextToSize(attendees, 180);
doc.text(attendeeLines, 14, 52);
let lastY = 52 + (attendeeLines.length * 5);
doc.autoTable({
startY: lastY + 5,
head: [['Topic', 'Presenter', 'Duration (min)']],
body: tableBody,
theme: 'grid',
headStyles: { fillColor: '#4f46e5' }
});
doc.save(`Meeting-Agenda-${title.replace(/\s+/g, '-')}.pdf`);
};
// --- Event Listeners ---
addItemBtn.addEventListener('click', addAgendaItem);
agendaItemsList.addEventListener('click', (e) => {
if (e.target.classList.contains('remove-item-btn')) {
const id = parseInt(e.target.dataset.id, 10);
removeAgendaItem(id);
}
});
generateAgendaBtn.addEventListener('click', generatePreview);
downloadPdfBtn.addEventListener('click', generatePDF);
// --- Initial Setup ---
const setupInitialData = () => {
meetingDateInput.value = new Date().toISOString().split('T')[0];
startTimeInput.value = '10:00';
endTimeInput.value = '11:30';
meetingTitleInput.value = 'Q4 Product Strategy Meeting';
attendeesInput.value = 'Alice Johnson\nBob Williams\nCharlie Brown';
agendaItems = [
{ id: 1, topic: 'Welcome & Q3 Recap', presenter: 'Alice J.', time: 10 },
{ id: 2, topic: 'Roadmap Presentation', presenter: 'Bob W.', time: 45 },
{ id: 3, topic: 'Open Discussion & Next Steps', presenter: 'All', time: 35 }
];
renderAgendaItems();
};
setupInitialData();
});
