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
55 lines
1.5 KiB
JavaScript
2 years ago
|
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;
|
||
|
|
};
|