`;
document.getElementById('download-pdf-btn').addEventListener('click', generatePdf);
}
function saveFormData() {
const currentFields = assessmentData[currentTabIndex].fields;
if (!currentFields) return;
currentFields.forEach(field => {
const el = document.getElementById(field.id);
if (el) formData[field.id] = el.value;
});
}
function calculateScore() {
let score = 0;
let maxScore = 0;
assessmentData.forEach(tab => {
if (!tab.fields) return;
tab.fields.forEach(field => {
maxScore += 10; // Each question is based on a max of 10 points
const userValue = formData[field.id];
if (field.points[userValue]) {
score += field.points[userValue];
}
});
});
return { score, maxScore };
}
window.goToTab = function(index) {
saveFormData();
currentTabIndex = index;
renderFormContent();
updateUI();
};
function updateUI() {
document.querySelectorAll('.tab-btn').forEach((btn, index) => {
btn.classList.toggle('active', index === currentTabIndex);
});
prevBtn.classList.toggle('invisible', currentTabIndex === 0);
nextBtn.classList.toggle('invisible', currentTabIndex === assessmentData.length - 1);
nextBtn.textContent = (currentTabIndex === assessmentData.length - 2) ? 'See Your Analysis' : 'Next →';
}
function handleNav(direction) {
const newIndex = currentTabIndex + (direction === 'next' ? 1 : -1);
if (newIndex >= 0 && newIndex < assessmentData.length) {
window.goToTab(newIndex);
}
}
function generatePdf() {
prepareReportData();
const reportContainer = document.getElementById('pdf-report-container');
reportContainer.style.display = 'block';
html2canvas(reportContainer, { scale: 2, useCORS: true }).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('Hair-Health-Analysis.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 resultsContent = document.getElementById('results-content').cloneNode(true);
resultsContent.querySelector('#download-pdf-btn').remove();
let inputsHtml = `
Your Self-Reported Data
`;
Object.keys(formData).forEach(key => {
const fieldLabel = assessmentData.flatMap(t => t.fields || []).find(f => f.id === key)?.label || key;
inputsHtml += `
${fieldLabel}
${formData[key]}
`;
});
inputsHtml += `
`;
let resultsHtml = `
Analysis & Recommendation
${resultsContent.innerHTML}`;
reportBody.innerHTML = inputsHtml + resultsHtml;
}
// --- Event Listeners ---
nextBtn.addEventListener('click', () => handleNav('next'));
prevBtn.addEventListener('click', () => handleNav('prev'));
// --- Initial Setup ---
renderTabs();
renderFormContent();
updateUI();
});
