`).join('');
// Add event listeners to new cards
document.querySelectorAll('.pose-card').forEach(card => {
card.addEventListener('click', () => openModal(card.dataset.poseId));
});
};
filterContainer.addEventListener('click', (e) => {
if (e.target.tagName === 'BUTTON') {
document.querySelector('.filter-button.active').classList.remove('active');
e.target.classList.add('active');
activeFilter = e.target.dataset.difficulty;
renderPoses();
}
});
// --- 4. MODAL LOGIC ---
const openModal = (poseId) => {
const pose = yogaPoses.find(p => p.id === poseId);
if (!pose) return;
modalContent.innerHTML = `
${pose.name}
${pose.sanskrit}
Instructions:
${pose.instructions.map(step => `- ${step}
`).join('')}
Benefits:
${pose.benefits}
`;
poseModal.classList.add('visible');
document.getElementById('close-modal-btn').addEventListener('click', closeModal);
};
const closeModal = () => {
poseModal.classList.remove('visible');
};
poseModal.addEventListener('click', (e) => {
if (e.target === poseModal) closeModal();
});
// --- 5. PDF GENERATION ---
downloadBtn.addEventListener('click', () => {
const { jsPDF } = window.jspdf;
const contentToPrint = document.getElementById('printable-content');
pdfTitle.textContent = `${activeFilter} Yoga Poses`;
pdfTitle.classList.remove('hidden');
html2canvas(contentToPrint, { scale: 2, useCORS: true }).then(canvas => {
pdfTitle.classList.add('hidden');
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'portrait', unit: 'pt', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const canvasWidth = canvas.width;
const canvasHeight = canvas.height;
const ratio = canvasWidth / pdfWidth;
const calculatedHeight = canvasHeight / ratio;
const pdfHeight = pdf.internal.pageSize.getHeight();
let heightLeft = calculatedHeight;
let position = 0;
pdf.addImage(imgData, 'PNG', 0, position, pdfWidth, calculatedHeight);
heightLeft -= pdfHeight;
while (heightLeft > 0) {
position -= pdfHeight;
pdf.addPage();
pdf.addImage(imgData, 'PNG', 0, position, pdfWidth, calculatedHeight);
heightLeft -= pdfHeight;
}
pdf.save(`${activeFilter}_Yoga_Guide.pdf`);
}).catch(err => {
pdfTitle.classList.add('hidden');
console.error('PDF generation failed:', err);
});
});
// --- INITIALIZE ---
renderPoses();
});
