`;
// 4. Display card and switch tab
elements.cardOutput.innerHTML = cardHTML;
elements.placeholder.style.display = 'none';
elements.cardOutput.style.display = 'block';
elements.pdfArea.style.display = 'block';
showTab(0);
};
elements.generateBtn.addEventListener('click', generateCard);
// --- PDF DOWNLOAD ---
elements.pdfBtn.addEventListener('click', async () => {
if (typeof window.jspdf === 'undefined' || typeof window.html2canvas === 'undefined') {
return alert('PDF libraries not loaded.');
}
elements.pdfBtn.innerHTML = '
Generating...';
elements.pdfBtn.disabled = true;
const { jsPDF } = window.jspdf;
const cardContent = document.getElementById('pgr-card-render-content');
const editables = cardContent.querySelectorAll('[contenteditable="true"]');
editables.forEach(el => el.setAttribute('contenteditable', 'false'));
try {
const canvas = await html2canvas(cardContent, { scale: 2 });
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF('p', 'mm', 'a4');
const pdfWidth = pdf.internal.pageSize.getWidth();
const imgProps = pdf.getImageProperties(imgData);
const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
pdf.save(`${elements.recipeName.value.replace(/\s/g, '_')}_Recipe.pdf`);
} catch (error) {
console.error(error);
alert('Failed to generate PDF.');
} finally {
editables.forEach(el => el.setAttribute('contenteditable', 'true'));
elements.pdfBtn.innerHTML = '
Download as PDF';
elements.pdfBtn.disabled = false;
}
});
// --- INITIALIZATION ---
populateForm();
generateCard();
showTab(0);
});