${entry.date.toLocaleDateString('en-US', { month: 'numeric', day: 'numeric' })}

`; chartContainer.appendChild(bar); }); } function renderGallery() { const container = document.getElementById('photo-gallery-container'); const photos = logData.filter(entry => entry.photo); if (photos.length === 0) { container.innerHTML = `

No photos uploaded yet. Add a photo in the "Daily Log" tab.

`; return; } container.innerHTML = photos.map(entry => ` `).join(''); } function generatePdf() { prepareReportData(); const reportContainer = document.getElementById('pdf-report-container'); reportContainer.style.display = 'block'; html2canvas(reportContainer, { scale: 2, useCORS: true, windowWidth: 800 }).then(canvas => { const { jsPDF } = window.jspdf; const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'portrait', unit: 'px', format: 'a4' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const ratio = canvas.width / canvas.height; const imgHeight = pdfWidth / ratio; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, imgHeight); pdf.save('Orthodontic-Progress-Report.pdf'); reportContainer.style.display = 'none'; }); } function prepareReportData() { document.getElementById('report-date').textContent = new Date().toLocaleDateString('en-US'); const reportBody = document.getElementById('pdf-report-body'); const summaryHtml = document.getElementById('summary-stats').innerHTML; const chartHtml = document.getElementById('wear-chart-container').innerHTML; const recentNotes = logData.filter(e => e.notes).slice(-5); const recentPhotos = logData.filter(e => e.photo).slice(-2); reportBody.innerHTML = ` `; } // --- Event Listeners --- logForm.addEventListener('submit', handleFormSubmit); wearTimeSlider.addEventListener('input', (e) => wearTimeValue.textContent = e.target.value); painLevelSlider.addEventListener('input', (e) => painLevelValue.textContent = e.target.value); document.getElementById('download-pdf-btn').addEventListener('click', generatePdf); // --- Initial Setup --- updateUI(); });