rushlink/assets/js/copyclipboard.js

"use strict";

const COPY_TO_CLIPBOARD_CONTAINER_ID = "copyToClipboardContainer";
const COPY_TO_CLIPBOARD_STATUS_ID = "copyToClipboardStatus";
let copyToClipboardCtr = 0;

function copyToClipboardSuccess() {
    let statusElem = document.getElementById(COPY_TO_CLIPBOARD_STATUS_ID);
    statusElem.innerText = "URL copied!";
    statusElem.classList.remove("fail");
    statusElem.classList.add("success");
}

function copyToClipboardFail(cause) {
    let statusElem = document.getElementById(COPY_TO_CLIPBOARD_STATUS_ID);
    if (!cause) cause = "unknown error";
    let msg = "copy failed: " + cause;
    console.log(msg);
    statusElem.innerText = msg;
    statusElem.classList.remove("success");
    statusElem.classList.add("fail");
}

function copyToClipboard(url) {
    let copyEventIdx = ++copyToClipboardCtr;

    if (!window.navigator.clipboard) {
        copyToClipboardFail("could not access clipboard");
        return;
    }
    window.navigator.clipboard.writeText(url).then(() => {
        if (copyToClipboardCtr !== copyEventIdx) return;
        copyToClipboardSuccess();
    }, () => {
        if (copyToClipboardCtr !== copyEventIdx) return;
        copyToClipboardFail();
    });
}

(function () {
    if (!window.navigator.clipboard) {
        let msg = "cannot access clipboard";
        if (window.location.protocol !== "https:") {
            msg += ": website not using https"
        }
        console.error(msg);
    } else {
        let container = document.getElementById(COPY_TO_CLIPBOARD_CONTAINER_ID);
        container.classList.remove("hidden");
    }
})();