photochamber-webserver/static/public/js/uiShare.js

$(() => {

var windowDisplayed = false;
var data = null;

class ShareData {
    dbId = 0;
    typeId = "";
    typeData = "";
    accessToId = 0;
    accessToData = "";
    grant = 0;

    constructor(data) {
        this.dbId = data.id;
        this.typeId = [ "unknown", "ldapAccount", "email", "link", "every one" ].indexOf(data.type);
        this.typeData = data.typeData;
        this.accessToId = [ "unknown", "item", "tag", "meta", "everything", "admin"].indexOf(data.accessTo);
        this.accessToData = data.accessToData;
        this.grant = [ "none", "read", "write", "read without meta"].indexOf(data.grant);
    }

    compare(b) {
        if (this.typeId != b.typeId) return b.typeId - this.typeId;
        if (this.accessToId != b.accessToId) return b.accessToId - this.accessToId;
        if (this.grant != b.grant) return b.grant - this.grant;
        return 0;
    }
}

function getData() {
    return new Promise((ok) => {
        if (data)
            return ok(data);
        $.get("/api/accessAdmin/list", {}, okData => {
            data = okData;
            ok(okData);
        });
    });
}

async function buildShareItem(data) {
    const htmlId = `collapseShareItem${data.dbId}`;
    let container = document.createElement("li");
    container.className = "accordion-item";
    let header = document.createElement("h2");
    header.className = "accordion-header";
    let headerButton = document.createElement("button");
    headerButton.className = "accordion-button bi " + (["bi-question-lg", "bi-database", "bi-envelope-at", "bi-link-45deg", "bi-people"][data.typeId]);
    headerButton.type = "button";
    headerButton.dataset.bsToggle = "collapse";
    headerButton.dataset.bsTarget = `#${htmlId}`;
    headerButton.textContent = data.typeData;
    headerButton.ariaExpanded = false;
    headerButton.ariaControls = htmlId;
    let accordionBodyContainer = document.createElement("div");
    accordionBodyContainer.className = "accordion-collapse collapse";
    accordionBodyContainer.dataset.bsParent = "#pch-share-container";
    accordionBodyContainer.id = htmlId;
    let accordionBody = document.createElement("div");
    accordionBody.className = "accordion-body";
    let typeDivRow = document.createElement("div");
    typeDivRow.className = "row";
    let typeDiv = document.createElement("div");
    typeDiv.className = "bi";
    typeDiv.classList.add(["bi-question-lg", "bi-diagram-2", "bi-tags", "bi-braces-asterisk", "bi-people", "bi-gear"][data.accessToId]);
    typeDiv.textContent = ["Unknown", "Single photo", "Tags", "Meta", "Everything", "Admin access"][data.accessToId];
    if (data.accessToId === 1)
        typeDiv.textContent += " (" +((await MediaStorage.Instance.getMedia(data.accessToData))?.fileName || "File not found") + ")";
    else if (data.accessToId === 2)
        typeDiv.textContent += ` (${data.accessToData})`;
    else if (data.accessToId === 3)
        typeDiv.textContent += ` (${data.accessToData})`;
    if (data.accessToId !== 5) {
        let grantDiv = document.createElement("div");
        grantDiv.textContent = ["None", "Read Access", "Write Access", "Read Access (Strip meta)"][data.grant];
        typeDiv.appendChild(grantDiv);
    }

    let deleteButtonRow = document.createElement("div");
    let deleteButtonDiv = document.createElement("div");
    let deleteButton = document.createElement("button");
    deleteButtonRow.className = "row";
    deleteButtonDiv.className = "col align-self-end";
    deleteButton.className = "btn btn-danger";
    deleteButton.textContent = "Revoke";
    deleteButtonRow.appendChild(deleteButtonDiv);
    deleteButtonDiv.appendChild(deleteButton);
    deleteButton.addEventListener("click", () => {
        console.log("Request to revoke " +data.dbId); // FIXME
    });

    header.appendChild(headerButton);
    container.appendChild(header);
    accordionBody.appendChild(typeDivRow);
    typeDivRow.appendChild(typeDiv);
    accordionBody.appendChild(deleteButtonRow);
    accordionBodyContainer.appendChild(accordionBody);
    container.appendChild(accordionBodyContainer);
    return container;
}

async function buildShareItems(data) {
    let container = document.createElement("ul");
    for (let i of data)
        container.appendChild(await buildShareItem(i));
    return container;
}

window.showShareUi = async () => {
    if (windowDisplayed)
        return;
    document.getElementById("pch-share-wrapper").classList.remove("hidden");
    document.Title.pushTitle("Share");
    document.body.classList.add("overlay-visible");
    const data = ((await getData()) || []).map(x => new ShareData(x)).sort((a, b) => a.compare(b));
    document.getElementById('pch-share-loading').classList.add("hidden");
    const container = document.getElementById('pch-share-container');
    container.innerHTML = "";
    container.appendChild(await buildShareItems(data));
    windowDisplayed = true;
}

window.closeShareUi = () => {
    if (!windowDisplayed)
        return;
    document.getElementById("pch-share-wrapper").classList.add("hidden");
    document.body.classList.remove("overlay-visible");
    windowDisplayed = false;
    document.Title.pop();
}

document.onClosePopinRequested(() => { window.closeShareUi(); });
document.getElementById("pch-share-closeBt").addEventListener("click", window.closeShareUi);

setTimeout(() => LoadingTasks.push(window.showShareUi), 1500);
});