Add events to create your chronological timeline.

'; return; } // Sort events chronologically (ascending) events.sort((a, b) => parseDateForSort(a.date) - parseDateForSort(b.date)); events.forEach((event) => { const li = document.createElement('li'); li.className = 'stg-list-item'; li.innerHTML = ` ${event.name} (${event.notes.substring(0, 50)}...) ${event.date} × `; li.querySelector('button').addEventListener('click', () => removeEvent(event.id)); eventList.appendChild(li); }); } function addEvent() { const date = eventDateInput.value.trim(); const name = eventNameInput.value.trim(); const notes = eventNotesTextarea.value.trim(); if (!date || !name) { alert("Please enter both a Date/Year and an Event Name."); return; } events.push({ id: generateId(), date, name, notes: notes || 'N/A' }); renderEvents(); // Clear form eventDateInput.value = ''; eventNameInput.value = ''; eventNotesTextarea.value = ''; } function removeEvent(id) { events = events.filter(event => event.id !== id); renderEvents(); } // --- PDF Generation (Ensured functionality) --- function downloadPDF() { if (typeof window.jspdf === 'undefined' || typeof window.jspdf.jsPDF === 'undefined') { alert('Error: jsPDF library not loaded.'); return; } if (typeof window.jspdf.jsPDF.autoTable === 'undefined') { alert('Error: jsPDF-AutoTable library not loaded.'); return; } const { jsPDF } = window.jspdf; const doc = new jsPDF('landscape', 'pt', 'a4'); const margin = 40; const pageWidth = doc.internal.pageSize.getWidth(); let currentY = margin; const timelineTitle = timelineTitleInput.value || 'Untitled Science Timeline'; const preparedBy = preparedByInput.value || 'N/A'; const description = descriptionTextarea.value || 'N/A'; // --- Header --- doc.setFontSize(22); doc.setFont('helvetica', 'bold'); doc.setTextColor(59, 130, 246); // blue-500 doc.text(timelineTitle, pageWidth / 2, currentY, { align: 'center' }); currentY += 15; doc.setFontSize(10); doc.setFont('helvetica', 'normal'); doc.text(`Prepared By: ${preparedBy}`, pageWidth / 2, currentY, { align: 'center' }); currentY += 20; // --- Description --- doc.setFontSize(10); doc.setFont('helvetica', 'italic'); const descLines = doc.splitTextToSize(description, pageWidth - margin * 2); doc.text(descLines, margin, currentY); currentY += descLines.length * 10 + 20; // --- Timeline Table --- doc.setFontSize(14); doc.setFont('helvetica', 'bold'); doc.setTextColor(59, 130, 246); doc.text("Chronological Event Register", margin, currentY); currentY += 5; if (events.length > 0) { const tableHead = [['Date/Year', 'Event/Discovery', 'Key People/Significance']]; const tableBody = [...events].sort((a, b) => parseDateForSort(a.date) - parseDateForSort(b.date)) .map(event => [ event.date, event.name, event.notes ]); doc.autoTable({ startY: currentY, head: tableHead, body: tableBody, theme: 'grid', headStyles: { fillColor: [59, 130, 246], textColor: [255, 255, 255] }, // blue-500 styles: { fontSize: 9, minCellHeight: 15, overflow: 'linebreak' }, columnStyles: { 0: { fontStyle: 'bold', cellWidth: 70 }, 1: { cellWidth: 150 } }, margin: { left: margin, right: margin } }); currentY = doc.autoTable.previous.finalY + 10; } else { doc.setFontSize(10); doc.text("No events defined in the timeline.", margin, currentY); currentY += 15; } doc.save('science-timeline-report.pdf'); } // --- Event Listeners and Initial Load --- addEventBtn.addEventListener('click', addEvent); eventDateInput.addEventListener('keypress', (e) => { if (e.key === 'Enter') { e.preventDefault(); addEvent(); } }); eventList.addEventListener('click', (e) => { if (e.target.classList.contains('stg-btn-red')) { removeEvent(e.target.dataset.id); } }); pdfBtn.addEventListener('click', downloadPDF); // Sample Data (USA/Universal Science History) events.push({ id: generateId(), date: '1865', name: 'Mendel publishes laws of inheritance', notes: 'Austrian monk Gregor Mendel establishes the concepts of dominant and recessive traits.' }); events.push({ id: generateId(), date: '1953', name: 'Discovery of the structure of DNA', notes: 'James Watson, Francis Crick, and Rosalind Franklin describe the double helix structure.' }); events.push({ id: generateId(), date: '1665', name: 'Cells discovered', notes: 'Robert Hooke observes cork cells under a microscope, coining the term "cell".' }); events.push({ id: generateId(), date: '1928', name: 'Penicillin discovered', notes: 'Alexander Fleming accidentally discovers the world\'s first antibiotic.' }); renderEvents(); });