Error: Please fill in the Persona Name and Year fields.

`; return; } let reportHtml = `

${data.name}

A Persona Backstory Report

Upbringing and Education

${formatText(data.upbringing)}

Defining Event

The major event that shaped this persona's path was: ${formatText(data.majorEvent)}

Persona's Motivation (Why they are in the SCA)

${formatText(data.motivation)}

Unique Trait / Quirk

${formatText(data.quirk)}

`; personaContentDiv.innerHTML = reportHtml; }; generateBtn.addEventListener("click", () => { generatePersona(); showTab(1); // Switch to Dashboard }); // --- PDF Download --- pdfBtn.addEventListener("click", () => { const { jsPDF } = window.jspdf; const personaSlug = personaNameInput.value.replace(/[^a-zA-Z0-9\s]/g, '').replace(/\s/g, '_') || 'Persona'; const fileName = `${personaSlug}_Backstory.pdf`; html2canvas(exportArea, { scale: 2, useCORS: true, backgroundColor: '#ffffff' }).then(canvas => { const imgData = canvas.toDataURL('image/png'); const doc = new jsPDF({ orientation: 'p', unit: 'pt', format: 'letter' }); const pdfWidth = doc.internal.pageSize.getWidth(); const pdfHeight = doc.internal.pageSize.getHeight(); const imgProps = doc.getImageProperties(imgData); const imgWidth = imgProps.width; const imgHeight = imgProps.height; const margin = 40; const usableWidth = pdfWidth - (2 * margin); const ratio = usableWidth / imgWidth; let scaledHeight = imgHeight * ratio; // Handle multi-page if content exceeds page height if (scaledHeight > pdfHeight - (2 * margin)) { const pageHeight = pdfHeight - (2 * margin); let heightLeft = scaledHeight; let position = 0; while (heightLeft > 0) { doc.addImage(imgData, 'PNG', margin, position + margin, usableWidth, scaledHeight); heightLeft -= pageHeight; position -= pageHeight; if (heightLeft > 0) { doc.addPage(); } } } else { // Single page doc.addImage(imgData, 'PNG', margin, margin, usableWidth, scaledHeight); } doc.save(fileName); }).catch(err => { console.error("SCA PDF Error:", err); // alert("An error occurred while generating the PDF."); // Per spec }); }); // --- Initial Load --- // Render the initial sample structure on load generatePersona(); showTab(0); // Start on Config tab });