A Way to Back Up Desmos Graphs From Gallery!

Discussion
1

I was tweaking around with f12 console scripts and asked ai to generate a script that could save desmos graphs as files. It came up with these scripts:

(function() {
window.desmosVault = new Map();
const log = (m) => console.log("%c[Vault] " + m, “color: #7c3aed; font-weight: bold;”);

log("Vault Active! Scroll down SLOWLY to the very bottom...");

const collect = () => {
    const items = document.querySelectorAll('.dcg-graph-gallery-grid__item');
    items.forEach(item => {
        const anchor = item.querySelector('a.dcg-graph-gallery-grid__link');
        const titleEl = item.querySelector('.dcg-graph-tile__title');
        if (anchor) {
            const href = anchor.getAttribute('href');
            const url = href.startsWith('http') ? href : 'https://www.desmos.com' + href;
            const title = titleEl ? titleEl.innerText : "Untitled";

            if (!window.desmosVault.has(url)) {
                window.desmosVault.set(url, { url, title });
                console.clear();
                log(`Captured: ${window.desmosVault.size} unique graphs.`);
                log("When finished scrolling, type: exportVault()");
            }
        }
    });
};

const interval = setInterval(collect, 200);

window.exportVault = () => {
    clearInterval(interval);
    const data = Array.from(window.desmosVault.values());
    console.clear();
    console.log("%c=== COPY THE LINE BELOW ===", "background: #7c3aed; color: white; padding: 5px;");
    console.log(`const graphData = ${JSON.stringify(data)};`);
    console.log("%c===========================", "color: #7c3aed");
    alert(`Vault exported ${data.length} graphs. Copy the code from the console.`);
};

})();

(async function() {
if (typeof graphData === ‘undefined’ || graphData.length === 0) {
return console.error(“[Error] No graphData found. Paste Script 1’s output first!”);
}

const log = (m, col = "#059669") => console.log(`%c[Extractor] ${m}`, `color: ${col}; font-weight: bold;`);
let finalLog = "";

log(`🚀 Starting backup for ${graphData.length} graphs...`);

for (let i = 0; i < graphData.length; i++) {
    const item = graphData[i];
    
    // Pause to let the browser's memory clear
    if (i > 0 && i % 5 === 0) {
        log(`Clean-up pause (3s)...`, "#3b82f6");
        await new Promise(r => setTimeout(r, 3000));
    }

    log(`[${i+1}/${graphData.length}] Opening: ${item.title}`);
    
    const win = window.open(item.url, "_blank");
    
    // CRITICAL CHECK
    if (!win || win.closed || typeof win.closed == 'undefined') {
        console.error("%c[CRITICAL] Pop-up was blocked by the browser!", "background: red; color: white; padding: 5px;");
        alert("STOP! Browser blocked the pop-up. Click the 'Allow' icon in the URL bar and REFRESH the page.");
        return; 
    }

    let math = null;
    // Wait up to 30s
    for (let t = 0; t < 60; t++) {
        await new Promise(r => setTimeout(r, 500));
        try {
            if (win.closed) break;
            math = win.eval(`(function() {
                if (typeof Calc === 'undefined' || !Calc.getState()) return null;
                return Calc.getState().expressions.list
                    .map(e => e.latex || e.text || '')
                    .filter(Boolean);
            })()`);
            if (math && math.length > 0) break;
        } catch (e) { /* Tab loading... */ }
    }

    if (math) {
        finalLog += `### ${item.title}\nURL: ${item.url}\n${math.join('\n')}\n\n---\n\n`;
        log(`✅ Saved ${item.title}`);
    } else {
        log(`❌ Failed/Timed out: ${item.title}`, "#dc2626");
        finalLog += `### ${item.title} [FAILED TO LOAD]\nURL: ${item.url}\n\n---\n\n`;
    }

    win.close();
    await new Promise(r => setTimeout(r, 1000)); 
}

// Generate the file
const blob = new Blob([finalLog], { type: "text/plain" });
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = `Desmos_Gallery_Backup_${new Date().getTime()}.txt`;
document.body.appendChild(a);
a.click();
log("✨ DONE! File downloaded.");

})();

The first on is to be pasted into a Desmos Gallery, after doing f12 and clicking “Console“. After that, type “exportVault()“, which will then list all of the Desmos graphs in the gallery. Then, paste that along with the second script, and enable pop-ups. It will then open and close each Desmos graph individually, extracting each expression from the opened graphs. After that, it will download a .txt file of all of the Desmos graphs’ expressions. Note, I have only tested this on my computer, and it seems to be able to work on all computers, though I am not sure if it works on phones.

2 Likes