diff options
author | (quasar) nebula <qznebula@protonmail.com> | 2023-10-10 09:38:25 -0300 |
---|---|---|
committer | (quasar) nebula <qznebula@protonmail.com> | 2023-10-10 09:38:25 -0300 |
commit | f2381a1ee1e20dea5b23ea9d20c7a85b5b1c1c45 (patch) | |
tree | 3c0d11e7bb0bb214cdca3e934e082142ed54f3ae | |
parent | cc4c12ad31be6b6d8432f257e112195179f7eafa (diff) | |
parent | 962e6d1777feb69711e33b16d11d322edd1744cd (diff) |
Merge branch 'album-gallery-nav' into preview
-rw-r--r-- | src/content/dependencies/generateAlbumGalleryNoTrackArtworksLine.js | 7 | ||||
-rw-r--r-- | src/content/dependencies/generateAlbumGalleryPage.js | 87 | ||||
-rw-r--r-- | src/content/dependencies/generateAlbumNavAccent.js | 16 | ||||
-rw-r--r-- | src/content/dependencies/generateAlbumSecondaryNav.js | 6 | ||||
-rw-r--r-- | src/content/dependencies/generateGroupGalleryPage.js | 35 | ||||
-rw-r--r-- | src/content/dependencies/generateGroupInfoPage.js | 6 | ||||
-rw-r--r-- | src/content/dependencies/generateGroupNavLinks.js | 44 | ||||
-rw-r--r-- | src/content/dependencies/generateGroupSecondaryNav.js | 99 | ||||
-rw-r--r-- | src/content/dependencies/generatePageLayout.js | 47 | ||||
-rw-r--r-- | src/content/dependencies/linkAlbumDynamically.js | 14 | ||||
-rw-r--r-- | src/content/dependencies/linkGroupDynamically.js | 14 | ||||
-rw-r--r-- | src/page/album.js | 3 | ||||
-rw-r--r-- | src/static/site5.css (renamed from src/static/site4.css) | 6 | ||||
-rw-r--r-- | src/strings-default.json | 3 | ||||
-rwxr-xr-x | src/upd8.js | 2 |
15 files changed, 259 insertions, 130 deletions
diff --git a/src/content/dependencies/generateAlbumGalleryNoTrackArtworksLine.js b/src/content/dependencies/generateAlbumGalleryNoTrackArtworksLine.js new file mode 100644 index 00000000..ad99cb87 --- /dev/null +++ b/src/content/dependencies/generateAlbumGalleryNoTrackArtworksLine.js @@ -0,0 +1,7 @@ +export default { + extraDependencies: ['html', 'language'], + + generate: ({html, language}) => + html.tag('p', {class: 'quick-info'}, + language.$('albumGalleryPage.noTrackArtworksLine')), +}; diff --git a/src/content/dependencies/generateAlbumGalleryPage.js b/src/content/dependencies/generateAlbumGalleryPage.js index b98abc46..f61b1983 100644 --- a/src/content/dependencies/generateAlbumGalleryPage.js +++ b/src/content/dependencies/generateAlbumGalleryPage.js @@ -3,8 +3,10 @@ import {compareArrays, stitchArrays} from '#sugar'; export default { contentDependencies: [ 'generateAlbumGalleryCoverArtistsLine', + 'generateAlbumGalleryNoTrackArtworksLine', 'generateAlbumGalleryStatsLine', 'generateAlbumNavAccent', + 'generateAlbumSecondaryNav', 'generateAlbumStyleRules', 'generateCoverGrid', 'generatePageLayout', @@ -59,9 +61,17 @@ export default { relations.albumNavAccent = relation('generateAlbumNavAccent', album, null); + relations.secondaryNav = + relation('generateAlbumSecondaryNav', album); + relations.statsLine = relation('generateAlbumGalleryStatsLine', album); + if (album.tracks.every(track => !track.hasUniqueCoverArt)) { + relations.noTrackArtworksLine = + relation('generateAlbumGalleryNoTrackArtworksLine'); + } + if (query.coverArtistsForAllTracks) { relations.coverArtistsLine = relation('generateAlbumGalleryCoverArtistsLine', query.coverArtistsForAllTracks); @@ -70,15 +80,25 @@ export default { relations.coverGrid = relation('generateCoverGrid'); - relations.links = - album.tracks.map(track => - relation('linkTrack', track)); + relations.links = [ + relation('linkAlbum', album), - relations.images = - album.tracks.map(track => - (track.hasUniqueCoverArt - ? relation('image', track.artTags) - : relation('image'))); + ... + album.tracks + .map(track => relation('linkTrack', track)), + ]; + + relations.images = [ + (album.hasCoverArt + ? relation('image', album.artTags) + : relation('image')), + + ... + album.tracks.map(track => + (track.hasUniqueCoverArt + ? relation('image', track.artTags) + : relation('image'))), + ]; return relations; }, @@ -89,27 +109,41 @@ export default { data.name = album.name; data.color = album.color; - data.names = - album.tracks.map(track => track.name); + data.names = [ + album.name, + ...album.tracks.map(track => track.name), + ]; - data.coverArtists = - album.tracks.map(track => { - if (query.coverArtistsForAllTracks) { - return null; - } + data.coverArtists = [ + (album.hasCoverArt + ? album.coverArtistContribs.map(({who: artist}) => artist.name) + : null), - if (track.hasUniqueCoverArt) { - return track.coverArtistContribs.map(({who: artist}) => artist.name); - } + ... + album.tracks.map(track => { + if (query.coverArtistsForAllTracks) { + return null; + } - return null; - }); + if (track.hasUniqueCoverArt) { + return track.coverArtistContribs.map(({who: artist}) => artist.name); + } + + return null; + }), + ]; - data.paths = - album.tracks.map(track => - (track.hasUniqueCoverArt - ? ['media.trackCover', track.album.directory, track.directory, track.coverArtFileExtension] - : null)); + data.paths = [ + (album.hasCoverArt + ? ['media.albumCover', album.directory, album.coverArtFileExtension] + : null), + + ... + album.tracks.map(track => + (track.hasUniqueCoverArt + ? ['media.trackCover', track.album.directory, track.directory, track.coverArtFileExtension] + : null)), + ]; return data; }, @@ -131,6 +165,7 @@ export default { mainContent: [ relations.statsLine, relations.coverArtistsLine, + relations.noTrackArtworksLine, relations.coverGrid .slots({ @@ -172,6 +207,8 @@ export default { }), }, ], + + secondaryNav: relations.secondaryNav, }); }, }; diff --git a/src/content/dependencies/generateAlbumNavAccent.js b/src/content/dependencies/generateAlbumNavAccent.js index c79219bb..7eb1dac0 100644 --- a/src/content/dependencies/generateAlbumNavAccent.js +++ b/src/content/dependencies/generateAlbumNavAccent.js @@ -33,10 +33,8 @@ export default { } } - if (album.tracks.some(t => t.hasUniqueCoverArt)) { - relations.albumGalleryLink = - relation('linkAlbumGallery', album); - } + relations.albumGalleryLink = + relation('linkAlbumGallery', album); if (album.commentary || album.tracks.some(t => t.commentary)) { relations.albumCommentaryLink = @@ -49,6 +47,7 @@ export default { data(album, track) { return { hasMultipleTracks: album.tracks.length > 1, + galleryIsStub: album.tracks.every(t => !t.hasUniqueCoverArt), isTrackPage: !!track, }; }, @@ -66,10 +65,11 @@ export default { const {content: extraLinks = []} = slots.showExtraLinks && {content: [ - relations.albumGalleryLink?.slots({ - attributes: {class: slots.currentExtra === 'gallery' && 'current'}, - content: language.$('albumPage.nav.gallery'), - }), + (!data.galleryIsStub || slots.currentExtra === 'gallery') && + relations.albumGalleryLink?.slots({ + attributes: {class: slots.currentExtra === 'gallery' && 'current'}, + content: language.$('albumPage.nav.gallery'), + }), relations.albumCommentaryLink?.slots({ attributes: {class: slots.currentExtra === 'commentary' && 'current'}, diff --git a/src/content/dependencies/generateAlbumSecondaryNav.js b/src/content/dependencies/generateAlbumSecondaryNav.js index 705dec51..8cf36fa4 100644 --- a/src/content/dependencies/generateAlbumSecondaryNav.js +++ b/src/content/dependencies/generateAlbumSecondaryNav.js @@ -5,7 +5,7 @@ export default { 'generateColorStyleVariables', 'generatePreviousNextLinks', 'generateSecondaryNav', - 'linkAlbum', + 'linkAlbumDynamically', 'linkGroup', 'linkTrack', ], @@ -64,14 +64,14 @@ export default { query.adjacentGroupInfo .map(({previousAlbum}) => (previousAlbum - ? relation('linkAlbum', previousAlbum) + ? relation('linkAlbumDynamically', previousAlbum) : null)); relations.nextAlbumLinks = query.adjacentGroupInfo .map(({nextAlbum}) => (nextAlbum - ? relation('linkAlbum', nextAlbum) + ? relation('linkAlbumDynamically', nextAlbum) : null)); } diff --git a/src/content/dependencies/generateGroupGalleryPage.js b/src/content/dependencies/generateGroupGalleryPage.js index 47239f55..259f5dce 100644 --- a/src/content/dependencies/generateGroupGalleryPage.js +++ b/src/content/dependencies/generateGroupGalleryPage.js @@ -11,6 +11,7 @@ export default { 'generateCoverCarousel', 'generateCoverGrid', 'generateGroupNavLinks', + 'generateGroupSecondaryNav', 'generateGroupSidebar', 'generatePageLayout', 'image', @@ -20,18 +21,8 @@ export default { extraDependencies: ['html', 'language', 'wikiData'], - sprawl({listingSpec, wikiInfo}) { - const sprawl = {}; - sprawl.enableGroupUI = wikiInfo.enableGroupUI; - - if (wikiInfo.enableListings && wikiInfo.enableGroupUI) { - sprawl.groupsByCategoryListing = - listingSpec - .find(l => l.directory === 'groups/by-category'); - } - - return sprawl; - }, + sprawl: ({wikiInfo}) => + ({enableGroupUI: wikiInfo.enableGroupUI}), relations(relation, sprawl, group) { const relations = {}; @@ -46,15 +37,13 @@ export default { relation('generateGroupNavLinks', group); if (sprawl.enableGroupUI) { + relations.secondaryNav = + relation('generateGroupSecondaryNav', group); + relations.sidebar = relation('generateGroupSidebar', group); } - if (sprawl.groupsByCategoryListing) { - relations.groupListingLink = - relation('linkListing', sprawl.groupsByCategoryListing); - } - const carouselAlbums = filterItemsForCarousel(group.featuredAlbums); if (!empty(carouselAlbums)) { @@ -160,15 +149,6 @@ export default { })), })), - relations.groupListingLink && - html.tag('p', - {class: 'quick-info'}, - language.$('groupGalleryPage.anotherGroupLine', { - link: - relations.groupListingLink - .slot('content', language.$('groupGalleryPage.anotherGroupLine.link')), - })), - relations.coverGrid .slots({ links: relations.gridLinks, @@ -208,6 +188,9 @@ export default { relations.navLinks .slot('currentExtra', 'gallery') .content, + + secondaryNav: + relations.secondaryNav ?? null, }); }, }; diff --git a/src/content/dependencies/generateGroupInfoPage.js b/src/content/dependencies/generateGroupInfoPage.js index e162a26a..0583755e 100644 --- a/src/content/dependencies/generateGroupInfoPage.js +++ b/src/content/dependencies/generateGroupInfoPage.js @@ -4,6 +4,7 @@ export default { contentDependencies: [ 'generateContentHeading', 'generateGroupNavLinks', + 'generateGroupSecondaryNav', 'generateGroupSidebar', 'generatePageLayout', 'linkAlbum', @@ -32,6 +33,9 @@ export default { relation('generateGroupNavLinks', group); if (sprawl.enableGroupUI) { + relations.secondaryNav = + relation('generateGroupSecondaryNav', group); + relations.sidebar = relation('generateGroupSidebar', group); } @@ -161,6 +165,8 @@ export default { navLinkStyle: 'hierarchical', navLinks: relations.navLinks.content, + + secondaryNav: relations.secondaryNav ?? null, }); }, }; diff --git a/src/content/dependencies/generateGroupNavLinks.js b/src/content/dependencies/generateGroupNavLinks.js index 68341e0a..5cde2ab4 100644 --- a/src/content/dependencies/generateGroupNavLinks.js +++ b/src/content/dependencies/generateGroupNavLinks.js @@ -2,10 +2,8 @@ import {empty} from '#sugar'; export default { contentDependencies: [ - 'generatePreviousNextLinks', 'linkGroup', 'linkGroupGallery', - 'linkGroupExtra', ], extraDependencies: ['html', 'language', 'wikiData'], @@ -28,24 +26,6 @@ export default { relations.mainLink = relation('linkGroup', group); - relations.previousNextLinks = - relation('generatePreviousNextLinks'); - - const groups = sprawl.groupCategoryData - .flatMap(category => category.groups); - - const index = groups.indexOf(group); - - if (index > 0) { - relations.previousLink = - relation('linkGroupExtra', groups[index - 1]); - } - - if (index < groups.length - 1) { - relations.nextLink = - relation('linkGroupExtra', groups[index + 1]); - } - relations.infoLink = relation('linkGroup', group); @@ -80,26 +60,6 @@ export default { ]; } - const previousNextLinks = - (relations.previousLink || relations.nextLink) && - relations.previousNextLinks.slots({ - previousLink: - relations.previousLink - ?.slot('extra', slots.currentExtra) - ?.content - ?? null, - nextLink: - relations.nextLink - ?.slot('extra', slots.currentExtra) - ?.content - ?? null, - }); - - const previousNextPart = - previousNextLinks && - language.formatUnitList( - previousNextLinks.content.filter(Boolean)); - const infoLink = relations.infoLink.slots({ attributes: {class: slots.currentExtra === null && 'current'}, @@ -119,7 +79,9 @@ export default { : language.formatUnitList([infoLink, ...extraLinks])); const accent = - `(${[extrasPart, previousNextPart].filter(Boolean).join('; ')})`; + (extrasPart + ? `(${extrasPart})` + : null); return [ {auto: 'home'}, diff --git a/src/content/dependencies/generateGroupSecondaryNav.js b/src/content/dependencies/generateGroupSecondaryNav.js new file mode 100644 index 00000000..e3b28099 --- /dev/null +++ b/src/content/dependencies/generateGroupSecondaryNav.js @@ -0,0 +1,99 @@ +export default { + contentDependencies: [ + 'generateColorStyleVariables', + 'generatePreviousNextLinks', + 'generateSecondaryNav', + 'linkGroupDynamically', + 'linkListing', + ], + + extraDependencies: ['html', 'language', 'wikiData'], + + sprawl: ({listingSpec, wikiInfo}) => ({ + groupsByCategoryListing: + (wikiInfo.enableListings + ? listingSpec + .find(l => l.directory === 'groups/by-category') + : null), + }), + + query(sprawl, group) { + const groups = group.category.groups; + const index = groups.indexOf(group); + + return { + previousGroup: + (index > 0 + ? groups[index - 1] + : null), + + nextGroup: + (index < groups.length - 1 + ? groups[index + 1] + : null), + }; + }, + + relations(relation, query, sprawl, _group) { + const relations = {}; + + relations.secondaryNav = + relation('generateSecondaryNav'); + + if (sprawl.groupsByCategoryListing) { + relations.categoryLink = + relation('linkListing', sprawl.groupsByCategoryListing); + } + + relations.colorVariables = + relation('generateColorStyleVariables'); + + if (query.previousGroup || query.nextGroup) { + relations.previousNextLinks = + relation('generatePreviousNextLinks'); + } + + relations.previousGroupLink = + (query.previousGroup + ? relation('linkGroupDynamically', query.previousGroup) + : null); + + relations.nextGroupLink = + (query.nextGroup + ? relation('linkGroupDynamically', query.nextGroup) + : null); + + return relations; + }, + + data: (query, sprawl, group) => ({ + categoryName: group.category.name, + categoryColor: group.category.color, + }), + + generate(data, relations, {html, language}) { + const {content: previousNextPart} = + relations.previousNextLinks.slots({ + previousLink: relations.previousGroupLink, + nextLink: relations.nextGroupLink, + id: true, + }); + + const {categoryLink} = relations; + + categoryLink?.setSlot('content', data.categoryName); + + return relations.secondaryNav.slots({ + class: 'nav-links-groups', + content: + (!relations.previousGroupLink && !relations.nextGroupLink + ? categoryLink + : html.tag('span', + {style: relations.colorVariables.slot('color', data.categoryColor).content}, + [ + categoryLink.slot('color', false), + `(${language.formatUnitList(previousNextPart)})`, + ])), + }); + }, +}; diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js index 5377f80d..cd831ba7 100644 --- a/src/content/dependencies/generatePageLayout.js +++ b/src/content/dependencies/generatePageLayout.js @@ -394,6 +394,10 @@ export default { const sidebarLeftHTML = generateSidebarHTML('leftSidebar', 'sidebar-left'); const sidebarRightHTML = generateSidebarHTML('rightSidebar', 'sidebar-right'); + + const hasSidebarLeft = !html.isBlank(sidebarLeftHTML); + const hasSidebarRight = !html.isBlank(sidebarRightHTML); + const collapseSidebars = slots.leftSidebarCollapse && slots.rightSidebarCollapse; const hasID = (() => { @@ -422,20 +426,20 @@ export default { processSkippers([ {condition: true, id: 'content', string: 'content'}, { - condition: !html.isBlank(sidebarLeftHTML), + condition: hasSidebarLeft, id: 'sidebar-left', string: - (html.isBlank(sidebarRightHTML) - ? 'sidebar' - : 'sidebar.left'), + (hasSidebarRight + ? 'sidebar.left' + : 'sidebar'), }, { - condition: !html.isBlank(sidebarRightHTML), + condition: hasSidebarRight, id: 'sidebar-right', string: - (html.isBlank(sidebarLeftHTML) - ? 'sidebar' - : 'sidebar.right'), + (hasSidebarLeft + ? 'sidebar.right' + : 'sidebar'), }, {condition: navHTML, id: 'header', string: 'header'}, {condition: footerHTML, id: 'footer', string: 'footer'}, @@ -507,11 +511,6 @@ export default { class: [ 'layout-columns', !collapseSidebars && 'vertical-when-thin', - (sidebarLeftHTML || sidebarRightHTML) && 'has-one-sidebar', - (sidebarLeftHTML && sidebarRightHTML) && 'has-two-sidebars', - !(sidebarLeftHTML || sidebarRightHTML) && 'has-zero-sidebars', - sidebarLeftHTML && 'has-sidebar-left', - sidebarRightHTML && 'has-sidebar-right', ], }, [ @@ -609,7 +608,7 @@ export default { html.tag('link', { rel: 'stylesheet', - href: to('shared.staticFile', 'site4.css', cachebust), + href: to('shared.staticFile', 'site5.css', cachebust), }), html.tag('style', [ @@ -624,12 +623,22 @@ export default { ]), html.tag('body', - // {style: body.style || ''}, [ - html.tag('div', {id: 'page-container'}, [ - skippersHTML, - layoutHTML, - ]), + html.tag('div', + { + id: 'page-container', + class: [ + (hasSidebarLeft || hasSidebarRight) && 'has-one-sidebar', + (hasSidebarLeft && hasSidebarRight) && 'has-two-sidebars', + !(hasSidebarLeft || hasSidebarRight) && 'has-zero-sidebars', + hasSidebarLeft && 'has-sidebar-left', + hasSidebarRight && 'has-sidebar-right', + ], + }, + [ + skippersHTML, + layoutHTML, + ]), // infoCardHTML, imageOverlayHTML, diff --git a/src/content/dependencies/linkAlbumDynamically.js b/src/content/dependencies/linkAlbumDynamically.js new file mode 100644 index 00000000..3adc64df --- /dev/null +++ b/src/content/dependencies/linkAlbumDynamically.js @@ -0,0 +1,14 @@ +export default { + contentDependencies: ['linkAlbumGallery', 'linkAlbum'], + extraDependencies: ['pagePath'], + + relations: (relation, album) => ({ + galleryLink: relation('linkAlbumGallery', album), + infoLink: relation('linkAlbum', album), + }), + + generate: (relations, {pagePath}) => + (pagePath[0] === 'albumGallery' + ? relations.galleryLink + : relations.infoLink), +}; diff --git a/src/content/dependencies/linkGroupDynamically.js b/src/content/dependencies/linkGroupDynamically.js new file mode 100644 index 00000000..90303ed1 --- /dev/null +++ b/src/content/dependencies/linkGroupDynamically.js @@ -0,0 +1,14 @@ +export default { + contentDependencies: ['linkGroupGallery', 'linkGroup'], + extraDependencies: ['pagePath'], + + relations: (relation, group) => ({ + galleryLink: relation('linkGroupGallery', group), + infoLink: relation('linkGroup', group), + }), + + generate: (relations, {pagePath}) => + (pagePath[0] === 'groupGallery' + ? relations.galleryLink + : relations.infoLink), +}; diff --git a/src/page/album.js b/src/page/album.js index 69fcabcf..af410763 100644 --- a/src/page/album.js +++ b/src/page/album.js @@ -5,7 +5,6 @@ export function targets({wikiData}) { } export function pathsForTarget(album) { - const hasGalleryPage = album.tracks.some(t => t.hasUniqueCoverArt); const hasCommentaryPage = !!album.commentary || album.tracks.some(t => t.commentary); return [ @@ -19,7 +18,7 @@ export function pathsForTarget(album) { }, }, - hasGalleryPage && { + { type: 'page', path: ['albumGallery', album.directory], diff --git a/src/static/site4.css b/src/static/site5.css index ab17bf0c..7b3e3e03 100644 --- a/src/static/site4.css +++ b/src/static/site5.css @@ -1625,7 +1625,7 @@ html[data-language-code="preview-en"][data-url-key="localized.home"] #content /* Layout - Wide (most computers) */ @media (min-width: 900px) { - #secondary-nav:not(.no-hide) { + #page-container:not(.has-zero-sidebars) #secondary-nav { display: none; } } @@ -1667,12 +1667,12 @@ html[data-language-code="preview-en"][data-url-key="localized.home"] #content z-index: 2; } - html[data-url-key="localized.home"] .layout-columns.has-one-sidebar .grid-listing > .grid-item:not(:nth-child(n+10)) { + html[data-url-key="localized.home"] #page-container.has-one-sidebar .grid-listing > .grid-item:not(:nth-child(n+10)) { flex-basis: 23%; margin: 15px; } - html[data-url-key="localized.home"] .layout-columns.has-one-sidebar .grid-listing > .grid-item:nth-child(n+10) { + html[data-url-key="localized.home"] #page-container.has-one-sidebar .grid-listing > .grid-item:nth-child(n+10) { flex-basis: 18%; margin: 10px; } diff --git a/src/strings-default.json b/src/strings-default.json index 0ad7a516..904d25d4 100644 --- a/src/strings-default.json +++ b/src/strings-default.json @@ -267,6 +267,7 @@ "albumGalleryPage.statsLine": "{TRACKS} totaling {DURATION}.", "albumGalleryPage.statsLine.withDate": "{TRACKS} totaling {DURATION}. Released {DATE}.", "albumGalleryPage.coverArtistsLine": "All track artwork by {ARTISTS}.", + "albumGalleryPage.noTrackArtworksLine": "This album doesn't have any track artwork.", "albumCommentaryPage.title": "{ALBUM} - Commentary", "albumCommentaryPage.infoLine": "{WORDS} across {ENTRIES}.", "albumCommentaryPage.nav.album": "Album: {ALBUM}", @@ -336,8 +337,6 @@ "groupInfoPage.albumList.item.otherGroupAccent": "(from {GROUP})", "groupGalleryPage.title": "{GROUP} - Gallery", "groupGalleryPage.infoLine": "{TRACKS} across {ALBUMS}, totaling {TIME}.", - "groupGalleryPage.anotherGroupLine": "({LINK})", - "groupGalleryPage.anotherGroupLine.link": "Choose another group to filter by!", "listingIndex.title": "Listings", "listingIndex.infoLine": "{WIKI}: {TRACKS} across {ALBUMS}, totaling {DURATION}.", "listingIndex.exploreList": "Feel free to explore any of the listings linked below and in the sidebar!", diff --git a/src/upd8.js b/src/upd8.js index 2cc8f554..9cd2c509 100755 --- a/src/upd8.js +++ b/src/upd8.js @@ -81,7 +81,7 @@ import * as buildModes from './write/build-modes/index.js'; const __dirname = path.dirname(fileURLToPath(import.meta.url)); -const CACHEBUST = 21; +const CACHEBUST = 22; let COMMIT; try { |