Bookmarklet to Download first scans / photos from PSA

bookmarklet.js

javascript:(function() {
    const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
    const getCSVContent = (rows) => {
        let csvContent = "Line Number,Item Number,Cert Number,Front Pic,Back Pic\n";
        rows.forEach(row => {
            csvContent += `${row.lineNumber},${row.itemNumber},${row.certNumber},${row.frontImage},${row.backImage}\n`;
        });
        return csvContent;
    };
    const downloadCSV = (csvContent, fileName) => {
        const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8;" });
        const link = document.createElement("a");
        const url = URL.createObjectURL(blob);
        link.href = url;
        link.style.display = "none";
        link.download = fileName;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    };
    const fetchImageData = async (url) => {
        const response = await fetch(url);
        const data = await response.json();
        return { frontImage: data.frontImage, backImage: data.backImage };
    };
    const createProgressBar = () => {
        const progressBarContainer = document.createElement("div");
        progressBarContainer.style.position = "fixed";
        progressBarContainer.style.top = "10px";
        progressBarContainer.style.left = "10px";
        progressBarContainer.style.width = "300px";
        progressBarContainer.style.height = "30px";
        progressBarContainer.style.border = "1px solid black";
        progressBarContainer.style.backgroundColor = "white";
        progressBarContainer.style.zIndex = "10000";

        const progressBar = document.createElement("div");
        progressBar.style.width = "0%";
        progressBar.style.height = "100%";
        progressBar.style.backgroundColor = "#4CAF50";

        progressBarContainer.appendChild(progressBar);
        document.body.style.marginTop = "50px";
        document.body.appendChild(progressBarContainer);

        return progressBar;
    };
    const main = async () => {
        const rows = Array.from(document.querySelectorAll("tr.report-error-row")).map(tr => ({
            lineNumber: tr.querySelector("td[data-title='Line #']").textContent,
            itemNumber: tr.querySelector("td[data-title='Item #']").textContent,
            certNumber: tr.querySelector("td[data-title='Cert #']").textContent,
            imageUrl: tr.querySelector("span.firstview-preview").dataset.url
        }));
        const progressBar = createProgressBar();
        const totalRows = rows.length;
        let processedRows = 0;
        for (let row of rows) {
            console.log(`Processing row: ${row.lineNumber}`);
            const imageData = await fetchImageData(row.imageUrl);
            await delay(500);
            row.frontImage = imageData.frontImage;
            row.backImage = imageData.backImage;
            processedRows++;
            progressBar.style.width = `${(processedRows / totalRows) * 100}%`;
            console.log(`Row ${row.lineNumber} processed`);
        }
        const csvContent = getCSVContent(rows);
        downloadCSV(csvContent, "cards.csv");
        document.body.removeChild(progressBar.parentNode);
        document.body.style.marginTop = "";
    };
    main();
})();