${issue.explanation}

`; tooltip.style.display = 'block'; const suggestionEl = tooltipContent.querySelector('.tooltip-suggestion'); suggestionEl.onclick = () => { applySuggestion(targetElement, issue.suggestion); tooltip.style.display = 'none'; }; const targetRect = targetElement.getBoundingClientRect(); const tooltipRect = tooltip.getBoundingClientRect(); let top = targetRect.top - tooltipRect.height - 10; let left = targetRect.left + (targetRect.width / 2) - (tooltipRect.width / 2); if (top < 0) { // If not enough space on top, show below top = targetRect.bottom + 10; // Update arrow - not implemented for simplicity, but would be done here } if (left < 0) left = 5; if (left + tooltipRect.width > window.innerWidth) left = window.innerWidth - tooltipRect.width - 5; tooltip.style.left = `${left}px`; tooltip.style.top = `${top}px`; } function applySuggestion(targetSpan, suggestion) { const replacement = document.createTextNode(suggestion); targetSpan.parentNode.replaceChild(replacement, targetSpan); } // --- PDF Generation --- function downloadPdf() { const { jsPDF } = window.jspdf; if (!jsPDF) { showError("PDF library is not available."); return; } const doc = new jsPDF(); // Title doc.setFontSize(20); doc.text("Grammar Analysis Report", 105, 20, { align: 'center' }); // Original Text Section doc.setFontSize(14); doc.text("Original Text", 14, 40); doc.setFontSize(10); const originalTextLines = doc.splitTextToSize(originalText, 180); doc.text(originalTextLines, 14, 48); let finalY = doc.previousAutoTable ? doc.previousAutoTable.finalY : 70; if (finalY < 60) finalY = 60; // Ensure space finalY += 10; // Summary doc.setFontSize(14); doc.text("Analysis Summary", 14, finalY); finalY += 8; doc.setFontSize(10); doc.text(`Total issues found: ${currentIssues.length}`, 14, finalY); finalY += 10; if (currentIssues.length > 0) { const tableData = currentIssues.map(issue => [ issue.type, issue.original, issue.suggestion, issue.explanation ]); doc.autoTable({ head: [['Type', 'Original', 'Suggestion', 'Explanation']], body: tableData, startY: finalY, theme: 'grid', headStyles: { fillColor: [74, 85, 104] }, // slate-600 styles: { cellPadding: 2, fontSize: 9 }, }); } doc.save('Grammar_Analysis_Report.pdf'); } });