110 lines
3.0 KiB
JavaScript
110 lines
3.0 KiB
JavaScript
const description = document.querySelector("#description > #full");
|
|
const summary = document.querySelector("#description > #summary");
|
|
|
|
function showDescription() {
|
|
summary.classList.toggle("hidden");
|
|
description.classList.toggle("hidden");
|
|
}
|
|
|
|
description &&
|
|
[description, summary].forEach(
|
|
(item) => (item.onclick = showDescription)
|
|
);
|
|
|
|
window.addEventListener("load", () => {
|
|
const geniusURL =
|
|
"https://genius.com" +
|
|
document.location.pathname +
|
|
document.location.search;
|
|
document.getElementById("goto-genius").setAttribute("href", geniusURL);
|
|
document.querySelectorAll("#lyrics a").forEach((item) => {
|
|
item.addEventListener("click", getAnnotation);
|
|
});
|
|
|
|
const linkedAnnotationId = window.location.pathname.match(
|
|
new RegExp("/(\\d+)")
|
|
)?.[1];
|
|
if (linkedAnnotationId) {
|
|
const target = document.querySelector(
|
|
`a[href^="/${linkedAnnotationId}"][class^="ReferentFragmentdesktop__ClickTarget"] > span`
|
|
);
|
|
target?.click();
|
|
target?.scrollIntoView();
|
|
}
|
|
});
|
|
|
|
function getAnnotation(e) {
|
|
e.preventDefault();
|
|
//document.querySelector('.annotation')?.remove()
|
|
const unreviewedAnnotation =
|
|
'<p id="unreviewed-annotation">This annotation is unreviewed</p>';
|
|
const link = e.currentTarget;
|
|
const uri = link.getAttribute("href");
|
|
const presentAnnotation =
|
|
link.nextElementSibling.matches(".annotation") &&
|
|
link.nextElementSibling;
|
|
if (presentAnnotation) {
|
|
presentAnnotation.remove();
|
|
return;
|
|
}
|
|
|
|
xhr = new XMLHttpRequest();
|
|
xhr.open("GET", uri + "/annotations");
|
|
xhr.send();
|
|
xhr.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
const parsedReponse = JSON.parse(this.responseText);
|
|
const annotationDiv = document.createElement("div");
|
|
annotationDiv.innerHTML = parsedReponse.body.html;
|
|
annotationDiv.id = uri;
|
|
annotationDiv.className = "annotation";
|
|
|
|
if (parsedReponse.state !== "accepted") {
|
|
annotationDiv.insertAdjacentHTML(
|
|
"afterbegin",
|
|
unreviewedAnnotation
|
|
);
|
|
}
|
|
|
|
if (!link.nextElementSibling.matches(".annotation")) {
|
|
link.insertAdjacentElement(
|
|
"afterend",
|
|
annotationDiv
|
|
);
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
window._currentTheme = localStorage.getItem("_theme") || (window.matchMedia("(prefers-color-scheme:dark)").matches ? "dark" : "light");
|
|
setTheme(window._currentTheme);
|
|
|
|
const themeChooser = document.getElementById("choose-theme");
|
|
themeChooser.addEventListener("click", function () {
|
|
if (window._currentTheme === "dark") {
|
|
setTheme("light");
|
|
} else {
|
|
setTheme("dark");
|
|
}
|
|
});
|
|
|
|
function setTheme(theme) {
|
|
const toggler = document.getElementById(
|
|
"ic_fluent_dark_theme_24_regular"
|
|
);
|
|
switch (theme) {
|
|
case "dark":
|
|
toggler.setAttribute("fill", "#fff");
|
|
localStorage.setItem("_theme", "dark");
|
|
document.body.classList.add("dark");
|
|
window._currentTheme = "dark";
|
|
return;
|
|
case "light":
|
|
toggler.setAttribute("fill", "#181d31");
|
|
localStorage.setItem("_theme", "light");
|
|
document.body.classList.remove("dark");
|
|
window._currentTheme = "light";
|
|
return;
|
|
}
|
|
}
|