Webpage Screenshot Tool
Enter a URL to generate a full-page screenshot using AI.
Screenshot will appear here
Enter a URL and click "Capture".
Generating Screenshot...
Capture Failed
${message}
`;
elements.outputPlaceholder.classList.remove('hidden');
elements.outputContainer.classList.add('hidden');
}
// --- PDF Generation ---
function generatePdf() {
const screenshotSrc = elements.screenshotPreview.src;
if (!screenshotSrc || screenshotSrc.endsWith('#')) return;
const { jsPDF } = window.jspdf;
const doc = new jsPDF('p', 'mm', 'a4');
const margin = 15;
const pageWidth = doc.internal.pageSize.getWidth();
doc.setFont('helvetica', 'bold');
doc.setFontSize(18);
doc.text('Webpage Screenshot Report', pageWidth / 2, 20, { align: 'center' });
doc.setFontSize(11);
doc.setTextColor(100);
doc.text(`Captured URL: ${elements.urlInput.value}`, margin, 30);
doc.text(`Capture Date: ${new Date().toLocaleDateString('en-US')}`, margin, 37);
doc.addImage(screenshotSrc, 'PNG', margin, 45, pageWidth - (margin * 2), 0);
doc.save('webpage-screenshot-report.pdf');
}
initialize();
});