MediaWiki

BibTest.js: Difference between revisions

From Illustrations in German Translations of Mark Twain's Works

No edit summary
No edit summary
Line 119: Line 119:
}
}


document.addEventListener("DOMContentLoaded", () => {
 
function sortEntriesAlphabetically() {


     const container = document.getElementById("listView");
     const container = document.getElementById("listView");
    if (!container) return;


     const entries = Array.from(container.querySelectorAll(".bib-entry"));
     const entries = Array.from(container.querySelectorAll(".bib-entry"));
Line 127: Line 129:
     entries.sort((a, b) => {
     entries.sort((a, b) => {


         const titleA = a.querySelector("h3").innerText.toLowerCase();
         const titleA = a.querySelector("h3")?.innerText.trim().toLowerCase() || "";
         const titleB = b.querySelector("h3").innerText.toLowerCase();
         const titleB = b.querySelector("h3")?.innerText.trim().toLowerCase() || "";


         return titleA.localeCompare(titleB);
         return titleA.localeCompare(titleB, "en", { sensitivity: "base" });


     });
     });
Line 136: Line 138:
     entries.forEach(entry => container.appendChild(entry));
     entries.forEach(entry => container.appendChild(entry));


});
}

Revision as of 22:23, 11 May 2026

/* =========================
   STATE
========================= */

const activeTags = new Set();

/* =========================
   TAG FILTERING (GLOBAL)
========================= */


document.querySelectorAll(".tag").forEach(tag => {

    tag.addEventListener("click", () => {

        const value = tag.dataset.tag;

        if (activeTags.has(value)) {
            activeTags.delete(value);
        } else {
            activeTags.add(value);
        }

        filterEntries();
        syncTagUI();   // 

    });

});


function filterEntries() {

    document.querySelectorAll(".bib-entry").forEach(entry => {

        const entryTags = entry.dataset.tags.split(" ");

        const matches =
            [...activeTags].every(t => entryTags.includes(t));

        if (activeTags.size === 0 || matches) {
            entry.style.display = "block";
        } else {
            entry.style.display = "none";
        }

    });

}


/* =========================
   VIEW SWITCH (LIST / NETWORK)
========================= */

document.querySelectorAll(".view-btn").forEach(btn => {

    btn.addEventListener("click", () => {

        document.querySelectorAll(".view-btn")
            .forEach(b => b.classList.remove("active"));

        btn.classList.add("active");

        const view = btn.dataset.view;

        const listView = document.getElementById("listView");
        const networkView = document.getElementById("networkView");

        listView.style.display = (view === "list") ? "block" : "none";
        networkView.classList.toggle("hidden", view !== "network");

        if (view === "network") {
            buildNetwork();
        }

    });

});


/* =========================
   EXPAND ABSTRACTS
========================= */

document.querySelectorAll(".expand-btn").forEach(btn => {

    btn.addEventListener("click", () => {

        const abstract = btn.nextElementSibling;

        abstract.classList.toggle("hidden");

        btn.textContent =
            abstract.classList.contains("hidden")
                ? "Show Abstract"
                : "Hide Abstract";

    });

});



function syncTagUI() {

    document.querySelectorAll(".tag").forEach(tagEl => {

        const value = tagEl.dataset.tag;

        if (activeTags.has(value)) {
            tagEl.classList.add("active");
        } else {
            tagEl.classList.remove("active");
        }

    });

}


function sortEntriesAlphabetically() {

    const container = document.getElementById("listView");
    if (!container) return;

    const entries = Array.from(container.querySelectorAll(".bib-entry"));

    entries.sort((a, b) => {

        const titleA = a.querySelector("h3")?.innerText.trim().toLowerCase() || "";
        const titleB = b.querySelector("h3")?.innerText.trim().toLowerCase() || "";

        return titleA.localeCompare(titleB, "en", { sensitivity: "base" });

    });

    entries.forEach(entry => container.appendChild(entry));

}