diff options
| -rw-r--r-- | web/source/frontend/index.js | 34 | ||||
| -rw-r--r-- | web/template/status.tmpl | 2 |
2 files changed, 17 insertions, 19 deletions
diff --git a/web/source/frontend/index.js b/web/source/frontend/index.js index 2fa035adb..6fb1d5be7 100644 --- a/web/source/frontend/index.js +++ b/web/source/frontend/index.js @@ -104,31 +104,29 @@ function dynamicSpoiler(className, updateFunc) { } dynamicSpoiler("text-spoiler", (spoiler) => { - const button = spoiler.querySelector("button"); + const button = spoiler.querySelector(".button"); - if (button != undefined) { - return () => { - button.textContent = spoiler.open - ? "Show less" - : "Show more"; - }; - } + return () => { + button.textContent = spoiler.open + ? "Show less" + : "Show more"; + }; }); -dynamicSpoiler("video-spoiler", (spoiler) => { - const video = spoiler.querySelector(".plyr-video"); +dynamicSpoiler("media-spoiler", (spoiler) => { const eye = spoiler.querySelector(".eye.button"); + const video = spoiler.querySelector(".plyr-video"); - if (video != undefined) { - return () => { - if (spoiler.open) { - eye.setAttribute("aria-label", "Hide media"); - } else { - eye.setAttribute("aria-label", "Show media"); + return () => { + if (spoiler.open) { + eye.setAttribute("aria-label", "Hide media"); + } else { + eye.setAttribute("aria-label", "Show media"); + if (video) { video.pause(); } - }; - } + } + }; }); Array.from(document.getElementsByClassName("plyr-video")).forEach((video) => { diff --git a/web/template/status.tmpl b/web/template/status.tmpl index a8c9792ab..08cbdcf01 100644 --- a/web/template/status.tmpl +++ b/web/template/status.tmpl @@ -55,7 +55,7 @@ {{range $index, $media := .}} {{with $media}} <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> <div class="show sensitive button" aria-hidden="true"> Show sensitive media |