From 48dde4a388fd4c31dd5680f7535419874124e554 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Thu, 25 Jul 2024 16:35:02 -0300 Subject: wip --- src/static/js/client/lyrics-switcher.js | 70 +++++++++++++++++++++++++++++++++ 1 file changed, 70 insertions(+) create mode 100644 src/static/js/client/lyrics-switcher.js (limited to 'src/static/js/client/lyrics-switcher.js') diff --git a/src/static/js/client/lyrics-switcher.js b/src/static/js/client/lyrics-switcher.js new file mode 100644 index 00000000..b350ea50 --- /dev/null +++ b/src/static/js/client/lyrics-switcher.js @@ -0,0 +1,70 @@ +/* eslint-env browser */ + +import {stitchArrays} from '../../shared-util/sugar.js'; + +import {cssProp} from '../client-util.js'; + +export const info = { + id: 'lyricsSwitcherInfo', + + entries: null, + switchLinks: null, + currentLinks: null, +}; + +export function getPageReferences() { + const content = document.getElementById('content'); + + if (!content) return; + + const switcher = content.querySelector('.lyrics-switcher'); + + if (!switcher) return; + + info.entries = + Array.from(content.querySelectorAll('.lyrics-entry')); + + info.currentLinks = + Array.from(switcher.querySelectorAll('a.current')); + + info.switchLinks = + Array.from(switcher.querySelectorAll('a:not(.current)')); +} + +export function addPageListeners() { + if (!info.switchLinks) return; + + for (const {switchLink, entry} of stitchArrays({ + switchLink: info.switchLinks, + entry: info.entries, + })) { + switchLink.addEventListener('click', domEvent => { + domEvent.preventDefault(); + showLyricsEntry(entry); + }); + } +} + +function showLyricsEntry(entry) { + const entryToShow = entry; + + stitchArrays({ + entry: info.entries, + currentLink: info.currentLinks, + switchLink: info.switchLinks, + }).forEach(({ + entry, + currentLink, + switchLink, + }) => { + if (entry === entryToShow) { + cssProp(entry, 'display', null); + cssProp(currentLink, 'display', null); + cssProp(switchLink, 'display', 'none'); + } else { + cssProp(entry, 'display', 'none'); + cssProp(currentLink, 'display', 'none'); + cssProp(switchLink, 'display', null); + } + }); +} -- cgit 1.3.0-6-gf8a5