mdolr/survol

Should survol also act as a library to add previews to websites

Opened this issue · 1 comments

mdolr commented

Currently the extension code runs on both the extension and the github pages integration (at survol.me). To make sure the user experience is the same when trying the extension on github pages and using it, I'm importing scripts directly from the github repository. The only thing that I've added is a custom function which replaces window.survolBackgroundRequest

The script implenting this custom function is available at docs/scripts/survolBackgroundRequest.js and it runs the following code :

/**
 * Override js/core.js window.survolBackgroundRequest
 */
var REQUEST_CACHE = {};

// Clear cache every 10 mins
setInterval(() => {
    REQUEST_CACHE = {};
}, 1000 * 60 * 10);

document.addEventListener('DOMContentLoaded', () => {
    setTimeout(() => {
        window.survolBackgroundRequest = (url, noJSON) => {

            return new Promise((resolve, reject) => {
                let req = { data: { url, noJSON } };
                let res = { status: 'error', data: null };

                // if the request is cached
                if (REQUEST_CACHE[req.data.url]) {
                    res = REQUEST_CACHE[req.data.url];
                    res.cached = true;
                    resolve(res);
                }

                // If the request isn't cached
                else {
                    fetch(`https://cors-anywhere.herokuapp.com/${req.data.url}`)
                        .then((data) => { return req.data.noJSON ? data.text() : data.json(); })
                        .then((data) => {
                            res.data = data;
                            res.status = 'OK';
                            res.cached = false;
                            REQUEST_CACHE[req.data.url] = res;
                            resolve(res);
                        })
                        .catch((error) => {
                            res.data = error;
                            res.status = 'error';

                            console.error('SURVOL - Fetching error', error);
                            reject(res);
                        });
                }
            });
        };
    }, 50);
});

The extension is also able to detect if it's running as an extension or as a script in a web page in js/core.js :

// If the script is part of the extension
    if (window.chrome && chrome.runtime && chrome.runtime.id) {
        chrome.storage.local.get(['disabledDomains', 'previewMetadata'], function (res) {
            let disabledDomains = res.disabledDomains ? res.disabledDomains : ['survol.me'];

            if (res.previewMetadata === false) {
                previewMetadata = false;
            }

            if (!disabledDomains.includes(getDomain(CURRENT_TAB).toLowerCase())) {
                insertSurvolDiv()
                    .then(gatherHrefs)
                    .then(equipNodes);
            }
        });
    }

    // Else the script is running in demo-mode on survol.me
    else {
        insertSurvolDiv()
            .then(gatherHrefs)
            .then(equipNodes);
    }

Should we work more on this and allow anyone to embed survol in order to add previews to their webpage easily ?
/discuss

I think this is a good idea. The proof-of-concept already exists so it makes sense.