`;
return;
}
filteredProducts.forEach(p => {
resultsGrid.innerHTML += `
`;
});
};
// --- EVENT HANDLERS ---
const handleCategorySelect = (e) => {
const card = e.target.closest('.category-card');
if (!card) return;
document.querySelectorAll('.category-card').forEach(c => c.classList.remove('selected'));
card.classList.add('selected');
state.category = card.dataset.category;
updateUI();
};
const handleNav = (direction) => {
if (direction === 'next' && state.currentStep < 3) {
if (state.currentStep === 1) buildPreferencesForm();
if (state.currentStep === 2) {
// Gather preferences
state.preferences.price = document.getElementById('pref-price')?.value;
state.preferences.type = document.getElementById('pref-type')?.value;
state.preferences.room = document.getElementById('pref-room')?.value;
state.preferences.style = document.getElementById('pref-style')?.value;
const genderRadio = document.querySelector('input[name="pref-gender"]:checked');
if (genderRadio) state.preferences.gender = genderRadio.value;
displayResults();
}
state.currentStep++;
} else if (direction === 'prev' && state.currentStep > 1) {
state.currentStep--;
}
updateUI();
};
const generatePDF = () => {
const { jsPDF } = window.jspdf;
const pdfContent = document.getElementById('pdf-content');
const pdfBtnContainer = document.getElementById('pdf-button-container');
if (!pdfContent || !pdfBtnContainer) return;
pdfBtnContainer.style.display = 'none';
html2canvas(pdfContent, { scale: 2, useCORS: true }).then(canvas => {
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const imgWidth = pdfWidth - 20;
const imgHeight = (canvas.height * imgWidth) / canvas.width;
pdf.addImage(imgData, 'PNG', 10, 10, imgWidth, imgHeight);
pdf.save('product-recommendations.pdf');
pdfBtnContainer.style.display = 'block';
}).catch(err => {
console.error("Error generating PDF:", err);
pdfBtnContainer.style.display = 'block';
});
};
// --- ATTACH LISTENERS ---
steps[1].addEventListener('click', handleCategorySelect);
nextBtn.addEventListener('click', () => handleNav('next'));
prevBtn.addEventListener('click', () => handleNav('prev'));
document.getElementById('download-pdf-btn').addEventListener('click', generatePDF);
// --- INITIAL SETUP ---
updateUI();
});
${p.name}
$${p.price.toFixed(2)}
${p.desc}
