`).join('');
}
// --- Modals and Forms ---
const eventModal = document.getElementById('event-modal');
const eventForm = document.getElementById('event-form');
const deleteBtn = document.getElementById('delete-event-btn');
document.getElementById('add-event-btn').addEventListener('click', () => openEventModal());
document.getElementById('cancel-btn').addEventListener('click', () => eventModal.classList.add('hidden'));
window.openEventModal = function(id = null) {
eventForm.reset();
if (id) {
const event = events.find(e => e.id === id);
document.getElementById('modal-title').textContent = 'Edit Event';
document.getElementById('event-id').value = event.id;
document.getElementById('event-title').value = event.title;
document.getElementById('event-date').value = event.date;
document.getElementById('event-time').value = event.time;
document.getElementById('event-category').value = event.category;
deleteBtn.classList.remove('hidden');
deleteBtn.onclick = () => handleDeleteEvent(id);
} else {
document.getElementById('modal-title').textContent = 'Add Event';
document.getElementById('event-id').value = '';
if (selectedDate) document.getElementById('event-date').value = selectedDate;
deleteBtn.classList.add('hidden');
}
eventModal.classList.remove('hidden');
}
eventForm.addEventListener('submit', (e) => {
e.preventDefault();
const id = document.getElementById('event-id').value;
const eventData = {
title: document.getElementById('event-title').value,
date: document.getElementById('event-date').value,
time: document.getElementById('event-time').value,
category: document.getElementById('event-category').value,
};
if (id) {
const index = events.findIndex(event => event.id === parseInt(id));
events[index] = { ...events[index], ...eventData };
} else {
eventData.id = Date.now();
events.push(eventData);
}
eventModal.classList.add('hidden');
renderCalendar();
renderAgenda();
});
function handleDeleteEvent(id) {
if (confirm('Are you sure you want to delete this event?')) {
events = events.filter(e => e.id !== id);
eventModal.classList.add('hidden');
renderCalendar();
renderAgenda();
}
}
// --- Navigation and PDF ---
document.getElementById('prev-month-btn').addEventListener('click', () => {
currentDate.setMonth(currentDate.getMonth() - 1);
renderCalendar();
});
document.getElementById('next-month-btn').addEventListener('click', () => {
currentDate.setMonth(currentDate.getMonth() + 1);
renderCalendar();
});
document.getElementById('today-btn').addEventListener('click', () => {
currentDate = new Date();
selectDay(currentDate.toISOString().split('T')[0]);
});
document.getElementById('download-pdf-btn').addEventListener('click', () => {
const { jsPDF } = window.jspdf;
const pdf = new jsPDF();
const monthName = currentDate.toLocaleString('default', { month: 'long', year: 'numeric' });
pdf.setFont('helvetica', 'bold');
pdf.setFontSize(20);
pdf.text(`Event Schedule for ${monthName}`, 105, 15, { align: 'center' });
const monthEvents = events.filter(e => {
const eventDate = new Date(e.date);
return eventDate.getMonth() === currentDate.getMonth() && eventDate.getFullYear() === currentDate.getFullYear();
}).sort((a,b) => a.date.localeCompare(b.date) || a.time.localeCompare(b.time));
if (monthEvents.length === 0) {
pdf.setFont('helvetica', 'normal');
pdf.setFontSize(12);
pdf.text('No events scheduled for this month.', 105, 30, { align: 'center' });
} else {
const body = monthEvents.map(e => [
new Date(`${e.date}T00:00:00`).toLocaleDateString(),
e.time ? new Date(`1970-01-01T${e.time}`).toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'}) : 'All Day',
e.title,
e.category.charAt(0).toUpperCase() + e.category.slice(1)
]);
pdf.autoTable({
startY: 25,
head: [['Date', 'Time', 'Title', 'Category']],
body: body,
theme: 'grid',
headStyles: { fillColor: '#0d9488' }
});
}
pdf.save(`Schedule_${monthName.replace(' ', '_')}.pdf`);
});
// --- Initial Load ---
function loadInitialData() {
const today = new Date();
const tomorrow = new Date(); tomorrow.setDate(today.getDate() + 1);
const nextWeek = new Date(); nextWeek.setDate(today.getDate() + 7);
events = [
{ id: 1, title: 'Team Standup', date: today.toISOString().split('T')[0], time: '09:00', category: 'work' },
{ id: 2, title: 'Dentist Appointment', date: today.toISOString().split('T')[0], time: '14:30', category: 'personal' },
{ id: 3, title: 'Project Phoenix Kick-off', date: tomorrow.toISOString().split('T')[0], time: '11:00', category: 'meeting' },
{ id: 4, title: 'Submit Q3 Report', date: nextWeek.toISOString().split('T')[0], time: '', category: 'work' },
];
selectDay(today.toISOString().split('T')[0]);
}
loadInitialData();
});
