diff options
Diffstat (limited to 'src/content/dependencies/generateArtTagGalleryPage.js')
| -rw-r--r-- | src/content/dependencies/generateArtTagGalleryPage.js | 151 |
1 files changed, 105 insertions, 46 deletions
diff --git a/src/content/dependencies/generateArtTagGalleryPage.js b/src/content/dependencies/generateArtTagGalleryPage.js index c04bfb68..72badb73 100644 --- a/src/content/dependencies/generateArtTagGalleryPage.js +++ b/src/content/dependencies/generateArtTagGalleryPage.js @@ -1,13 +1,16 @@ -import {stitchArrays} from '#sugar'; +import {empty, stitchArrays, unique} from '#sugar'; import {sortAlbumsTracksChronologically} from '#wiki-data'; export default { contentDependencies: [ + 'generateArtTagNavLinks', 'generateCoverGrid', 'generatePageLayout', + 'generateQuickDescription', 'image', 'linkAlbum', - 'linkArtTag', + 'linkArtTagGallery', + 'linkExternal', 'linkTrack', ], @@ -19,61 +22,94 @@ export default { }; }, - query(sprawl, tag) { - const things = tag.taggedInThings.slice(); + query(sprawl, artTag) { + const directThings = artTag.directlyTaggedInThings; + const indirectThings = artTag.indirectlyTaggedInThings; + const allThings = unique([...directThings, ...indirectThings]); - sortAlbumsTracksChronologically(things, { - getDate: thing => thing.coverArtDate, + sortAlbumsTracksChronologically(allThings, { + getDate: thing => thing.coverArtDate ?? thing.date, latestFirst: true, }); - return {things}; + return {directThings, indirectThings, allThings}; }, - relations(relation, query, sprawl, tag) { + relations(relation, query, sprawl, artTag) { const relations = {}; relations.layout = relation('generatePageLayout'); - relations.artTagMainLink = - relation('linkArtTag', tag); + relations.navLinks = + relation('generateArtTagNavLinks', artTag); + + relations.quickDescription = + relation('generateQuickDescription', artTag); + + if (!empty(artTag.extraReadingURLs)) { + relations.extraReadingLinks = + artTag.extraReadingURLs + .map(url => relation('linkExternal', url)); + } + + if (!empty(artTag.directAncestorArtTags)) { + relations.ancestorLinks = + artTag.directAncestorArtTags + .map(artTag => relation('linkArtTagGallery', artTag)); + } + + if (!empty(artTag.directDescendantArtTags)) { + relations.descendantLinks = + artTag.directDescendantArtTags + .map(artTag => relation('linkArtTagGallery', artTag)); + } relations.coverGrid = relation('generateCoverGrid'); relations.links = - query.things.map(thing => - (thing.album - ? relation('linkTrack', thing) - : relation('linkAlbum', thing))); + query.allThings + .map(thing => + (thing.album + ? relation('linkTrack', thing) + : relation('linkAlbum', thing))); relations.images = - query.things.map(thing => - relation('image', thing.artTags)); + query.allThings + .map(thing => relation('image', thing.artTags)); return relations; }, - data(query, sprawl, tag) { + data(query, sprawl, artTag) { const data = {}; data.enableListings = sprawl.enableListings; - data.name = tag.name; - data.color = tag.color; + data.name = artTag.name; + data.color = artTag.color; - data.numArtworks = query.things.length; + data.numArtworks = query.allThings.length; data.names = - query.things.map(thing => thing.name); + query.allThings.map(thing => thing.name); data.paths = - query.things.map(thing => + query.allThings.map(thing => (thing.album ? ['media.trackCover', thing.album.directory, thing.directory, thing.coverArtFileExtension] : ['media.albumCover', thing.directory, thing.coverArtFileExtension])); + data.coverArtists = + query.allThings.map(thing => + thing.coverArtistContribs + .map(({who: artist}) => artist.name)); + + data.onlyFeaturedIndirectly = + query.allThings.map(thing => + !query.directThings.includes(thing)); + return data; }, @@ -81,7 +117,7 @@ export default { return relations.layout .slots({ title: - language.$('tagPage.title', { + language.$('artTagGalleryPage.title', { tag: data.name, }), @@ -91,44 +127,67 @@ export default { mainClasses: ['top-index'], mainContent: [ - html.tag('p', - {class: 'quick-info'}, - language.$('tagPage.infoLine', { - coverArts: language.countCoverArts(data.numArtworks, { - unit: true, - }), - })), + relations.quickDescription.slots({ + extraReadingLinks: relations.extraReadingLinks ?? null, + }), + + html.tag('p', {class: 'quick-info'}, + (data.numArtworks === 0 + ? [ + language.$('artTagGalleryPage.infoLine.notFeatured'), + html.tag('br'), + language.$('artTagGalleryPage.infoLine.callToAction'), + ] + : language.$('artTagGalleryPage.infoLine', { + coverArts: language.countArtworks(data.numArtworks, { + unit: true, + }), + }))), + + relations.ancestorLinks && + html.tag('p', {class: 'quick-info'}, + language.$('artTagGalleryPage.descendsFrom', { + tags: language.formatConjunctionList(relations.ancestorLinks), + })), + + relations.descendantLinks && + html.tag('p', {clasS: 'quick-info'}, + language.$('artTagGalleryPage.desendants', { + tags: language.formatUnitList(relations.descendantLinks), + })), relations.coverGrid .slots({ links: relations.links, names: data.names, + lazy: 12, + + classes: + data.onlyFeaturedIndirectly.map(onlyFeaturedIndirectly => + (onlyFeaturedIndirectly ? 'featured-indirectly' : '')), + images: stitchArrays({ image: relations.images, path: data.paths, }).map(({image, path}) => image.slot('path', path)), + + info: + data.coverArtists.map(names => + (names === null + ? null + : language.$('misc.albumGrid.details.coverArtists', { + artists: language.formatUnitList(names), + }))), }), ], navLinkStyle: 'hierarchical', - navLinks: [ - {auto: 'home'}, - - data.enableListings && - { - path: ['localized.listingIndex'], - title: language.$('listingIndex.title'), - }, - - { - html: - language.$('tagPage.nav.tag', { - tag: relations.artTagMainLink, - }), - }, - ], + navLinks: + relations.navLinks + .slot('currentExtra', 'gallery') + .content, }); }, }; |