You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

55 lines
1.5 KiB
JavaScript

const colophon = document.querySelector(".colophon");
const container = document.querySelector(".index");
fetch("releases.json")
.then((res) => res.json())
.then((data) => {
buildIndex(data.releases);
});
const buildIndex = function (releases) {
container.innerHTML = "";
for (const [index, release] of releases.entries()) {
let item = document.createElement("li");
let link = document.createElement("a");
link.href = index.toString().padStart(2, "0");
link.innerHTML = index.toString().padStart(2, "0") + ". " + release.title;
item.appendChild(link);
item.addEventListener("mouseenter", (e) => {
buildColophon(release);
});
container.appendChild(item);
}
};
const buildColophon = function (release) {
colophon.innerHTML = "";
let caretakers = document.createElement("div");
caretakers.classList.add("caretakers");
for (const caretaker of release.caretakers) {
caretakers.appendChild(buildAvatar(caretaker));
}
let contributors = document.createElement("ul");
contributors.classList.add("contributors");
for (const contributor of release.contributors) {
let contribution = document.createElement("div");
for (const person of contributor) {
contribution.appendChild(buildAvatar(person));
}
contributors.appendChild(contribution);
}
colophon.appendChild(caretakers);
colophon.appendChild(contributors);
};
const buildAvatar = function (who) {
let avatar = document.createElement("img");
avatar.classList.add("avatar");
avatar.src = "img/avatar/" + who + ".jpg";
avatar.alt = who;
return avatar;
};