[frogend/bugfix] fix dynamicSpoiler elements (#1771)

This commit is contained in:
f0x52 2023-05-12 13:50:37 +02:00 committed by GitHub
parent b315aa10c8
commit 66df974143
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 19 deletions

View file

@ -104,31 +104,29 @@ function dynamicSpoiler(className, updateFunc) {
} }
dynamicSpoiler("text-spoiler", (spoiler) => { dynamicSpoiler("text-spoiler", (spoiler) => {
const button = spoiler.querySelector("button"); const button = spoiler.querySelector(".button");
if (button != undefined) {
return () => { return () => {
button.textContent = spoiler.open button.textContent = spoiler.open
? "Show less" ? "Show less"
: "Show more"; : "Show more";
}; };
}
}); });
dynamicSpoiler("video-spoiler", (spoiler) => { dynamicSpoiler("media-spoiler", (spoiler) => {
const video = spoiler.querySelector(".plyr-video");
const eye = spoiler.querySelector(".eye.button"); const eye = spoiler.querySelector(".eye.button");
const video = spoiler.querySelector(".plyr-video");
if (video != undefined) {
return () => { return () => {
if (spoiler.open) { if (spoiler.open) {
eye.setAttribute("aria-label", "Hide media"); eye.setAttribute("aria-label", "Hide media");
} else { } else {
eye.setAttribute("aria-label", "Show media"); eye.setAttribute("aria-label", "Show media");
if (video) {
video.pause(); video.pause();
} }
};
} }
};
}); });
Array.from(document.getElementsByClassName("plyr-video")).forEach((video) => { Array.from(document.getElementsByClassName("plyr-video")).forEach((video) => {

View file

@ -55,7 +55,7 @@
{{range $index, $media := .}} {{range $index, $media := .}}
{{with $media}} {{with $media}}
<div class="media-wrapper"> <div class="media-wrapper">
<details class="{{.Type}}-spoiler" {{if not $.Sensitive}}open{{end}}> <details class="{{.Type}}-spoiler media-spoiler" {{if not $.Sensitive}}open{{end}}>
<summary> <summary>
<div class="show sensitive button" aria-hidden="true"> <div class="show sensitive button" aria-hidden="true">
Show sensitive media Show sensitive media