`; } finally { setLoadingState(false); } } function parseMarkdownToHtml(markdown) { return markdown .replace(/### Core Concept/g, '

Core Concept

') .replace(/### Key Points/g, '

Key Points

') .replace(/### Simple Analogy/g, '

Simple Analogy

') .replace(/### Quiz Yourself/g, '

Quiz Yourself

') .replace(/### Answer Key/g, '

Answer Key

') .replace(/^\* (.*$)/gm, '

• $1

') // Basic bullet points .replace(/<\/ul>\s?

/g, '') // Merge adjacent lists .replace(/\n/g, '
'); } function wrapSections(htmlContent) { // This function wraps content between H2 tags into styled divs for better layout const sections = htmlContent.split('

'); let processedHtml = ''; for (let i = 1; i < sections.length; i++) { const sectionContent = sections[i].split('

'); const title = `

${sectionContent[0]}

`; let content = sectionContent[1]; if (sectionContent[0].includes('Simple Analogy')) { content = `
${content}
`; } else if (sectionContent[0].includes('Answer Key')) { content = `
${content}
`; } else if (sectionContent[0].includes('Quiz Yourself')) { content = `
${content.replace(/
/g, '').replace(/(\d\..*)/g, '
1. $1
')}
`; } processedHtml += `
${title}${content}
`; } return processedHtml; } function renderOutput(htmlContent, topic) { const fullReportHtml = `

${topic}

Your personalized study guide, generated by the Smart Learning Assistant.

${wrapSections(htmlContent)}
`; // Render for on-screen view outputContainer.innerHTML = `
${fullReportHtml}
Download as PDF
`; // Prepare content for PDF generation pdfTemplate.innerHTML = fullReportHtml; // Add event listener to the new download button document.getElementById('download-pdf-btn').addEventListener('click', () => { generatePdf(pdfTemplate, `Study-Guide-${topic.replace(/ /g, '_')}.pdf`); }); } async function generatePdf(element, fileName) { const downloadBtn = document.getElementById('download-pdf-btn'); if (!downloadBtn) return; const originalButtonText = downloadBtn.innerHTML; downloadBtn.innerHTML = 'Downloading...'; downloadBtn.disabled = true; // Temporarily make the hidden element visible for rendering, but off-screen element.classList.remove('invisible', 'absolute', '-left-full'); element.style.position = 'absolute'; element.style.left = '-9999px'; element.style.display = 'block'; try { const { jsPDF } = window.jspdf; const canvas = await html2canvas(element, { scale: 3, // Increased scale for higher quality and larger file size backgroundColor: '#ffffff', // Explicitly set background useCORS: true }); const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'p', unit: 'pt', format: 'a4' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (canvas.height * pdfWidth) / canvas.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save(fileName); } catch(err) { console.error("PDF generation error:", err); showNotification("Sorry, there was an issue creating the PDF.", true); } finally { // Restore original styles to hide the element again element.classList.add('invisible', 'absolute', '-left-full'); element.style.position = ''; element.style.left = ''; element.style.display = ''; downloadBtn.innerHTML = originalButtonText; downloadBtn.disabled = false; } } function setLoadingState(isLoading) { if (isLoading) { generateBtn.disabled = true; generateBtn.innerHTML = `
Generating...`; } else { generateBtn.disabled = false; generateBtn.innerHTML = `Generate Study Guide`; } } });