diff options
author | (quasar) nebula <qznebula@protonmail.com> | 2024-03-16 13:51:27 -0300 |
---|---|---|
committer | (quasar) nebula <qznebula@protonmail.com> | 2024-03-16 13:51:27 -0300 |
commit | b9e441d8e1d89fd7c89674eb08201073c16fd955 (patch) | |
tree | 06ec17e24a8140f70df0160a6e7301b247361b3a /src/content/dependencies | |
parent | c2019cab1e121e6e324fb74188652e541c30b6c2 (diff) |
content: generate{Album,Group}SecondaryNav: use nav-link classes
Diffstat (limited to 'src/content/dependencies')
-rw-r--r-- | src/content/dependencies/generateAlbumSecondaryNav.js | 95 | ||||
-rw-r--r-- | src/content/dependencies/generateGroupSecondaryNav.js | 13 |
2 files changed, 65 insertions, 43 deletions
diff --git a/src/content/dependencies/generateAlbumSecondaryNav.js b/src/content/dependencies/generateAlbumSecondaryNav.js index 5b2e3404..400420ba 100644 --- a/src/content/dependencies/generateAlbumSecondaryNav.js +++ b/src/content/dependencies/generateAlbumSecondaryNav.js @@ -100,50 +100,69 @@ export default { }, generate(relations, slots, {html, language}) { - return relations.secondaryNav.slots({ - class: 'nav-links-groups', - content: - stitchArrays({ - colorStyle: relations.colorStyles, - groupLink: relations.groupLinks, - previousNextLinks: relations.previousNextLinks ?? null, - previousAlbumLink: relations.previousAlbumLinks ?? null, - nextAlbumLink: relations.nextAlbumLinks ?? null, - }).map(({ - colorStyle, - groupLink, - previousNextLinks, - previousAlbumLink, - nextAlbumLink, - }) => { - if ( - slots.mode === 'track' || - !previousAlbumLink && !nextAlbumLink - ) { - return language.$('albumSidebar.groupBox.title', { - group: groupLink, - }); - } - - const {content: previousNextPart} = - previousNextLinks.slots({ + const navLinksShouldShowPreviousNext = + (slots.mode === 'track' + ? Array.from(relations.previousNextLinks, () => false) + : stitchArrays({ + previousAlbumLink: relations.previousAlbumLinks ?? null, + nextAlbumLink: relations.nextAlbumLinks ?? null, + }).map(({previousAlbumLink, nextAlbumLink}) => + previousAlbumLink || + nextAlbumLink)); + + const navLinkPreviousNextLinks = + stitchArrays({ + showPreviousNext: navLinksShouldShowPreviousNext, + previousNextLinks: relations.previousNextLinks ?? null, + previousAlbumLink: relations.previousAlbumLinks ?? null, + nextAlbumLink: relations.nextAlbumLinks ?? null, + }).map(({ + showPreviousNext, + previousNextLinks, + previousAlbumLink, + nextAlbumLink, + }) => + (showPreviousNext + ? previousNextLinks.slots({ previousLink: previousAlbumLink, nextLink: nextAlbumLink, id: false, - }); - - return ( - html.tag('span', - colorStyle.slot('context', 'primary-only'), + }) + : null)); - [ - language.$('albumSidebar.groupBox.title', { - group: groupLink.slot('color', false), - }), + for (const groupLink of relations.groupLinks) { + groupLink.setSlot('color', false); + } - `(${language.formatUnitList(previousNextPart)})`, - ])); + const navLinkContents = + stitchArrays({ + groupLink: relations.groupLinks, + previousNextLinks: navLinkPreviousNextLinks, + }).map(({groupLink, previousNextLinks}) => [ + language.$('albumSidebar.groupBox.title', { + group: groupLink, }), + + previousNextLinks && + `(${language.formatUnitList(previousNextLinks.content)})`, + ]); + + const navLinks = + stitchArrays({ + content: navLinkContents, + colorStyle: relations.colorStyles, + }).map(({content, colorStyle}, index) => + html.tag('span', {class: 'nav-link'}, + index > 0 && + {class: 'has-divider'}, + + colorStyle.slot('context', 'primary-only'), + + content)); + + return relations.secondaryNav.slots({ + class: 'nav-links-groups', + content: navLinks, }); }, }; diff --git a/src/content/dependencies/generateGroupSecondaryNav.js b/src/content/dependencies/generateGroupSecondaryNav.js index 6501cfca..17eb5083 100644 --- a/src/content/dependencies/generateGroupSecondaryNav.js +++ b/src/content/dependencies/generateGroupSecondaryNav.js @@ -83,15 +83,18 @@ export default { return relations.secondaryNav.slots({ class: 'nav-links-groups', content: - (!relations.previousGroupLink && !relations.nextGroupLink - ? categoryLink ?? html.blank() - : html.tag('span', - relations.colorStyle, + (relations.previousGroupLink || relations.nextGroupLink + ? html.tag('span', {class: 'nav-link'}, + relations.colorStyle.slot('context', 'primary-only'), [ categoryLink?.slot('color', false), `(${language.formatUnitList(previousNextPart)})`, - ])), + ]) + : categoryLink + ? html.tag('span', {class: 'nav-link'}, + categoryLink) + : html.blank()), }); }, }; |