From 257b7616e3a0997f2a5c2766c7923719cf2ca0b5 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Sun, 17 Nov 2024 16:38:07 -0400 Subject: content: generateTrackReferencedArtworksPage --- .../dependencies/generateBackToTrackLink.js | 15 +++ src/content/dependencies/generateTrackNavLinks.js | 17 ++- .../generateTrackReferencedArtworksPage.js | 143 +++++++++++++++++++++ src/page/track.js | 13 ++ src/strings-default.yaml | 16 +++ src/url-spec.js | 2 + 6 files changed, 205 insertions(+), 1 deletion(-) create mode 100644 src/content/dependencies/generateBackToTrackLink.js create mode 100644 src/content/dependencies/generateTrackReferencedArtworksPage.js diff --git a/src/content/dependencies/generateBackToTrackLink.js b/src/content/dependencies/generateBackToTrackLink.js new file mode 100644 index 00000000..8677d811 --- /dev/null +++ b/src/content/dependencies/generateBackToTrackLink.js @@ -0,0 +1,15 @@ +export default { + contentDependencies: ['linkTrack'], + extraDependencies: ['language'], + + relations: (relation, track) => ({ + trackLink: + relation('linkTrack', track), + }), + + generate: (relations, {language}) => + relations.trackLink.slots({ + content: language.$('trackPage.nav.backToTrack'), + color: false, + }), +}; diff --git a/src/content/dependencies/generateTrackNavLinks.js b/src/content/dependencies/generateTrackNavLinks.js index 89da171a..e6e6d6ab 100644 --- a/src/content/dependencies/generateTrackNavLinks.js +++ b/src/content/dependencies/generateTrackNavLinks.js @@ -18,7 +18,11 @@ export default { track.album.tracks.indexOf(track) + 1, }), - slots: {}, + slots: { + currentExtra: { + validate: v => v.is('referenced-art'), + }, + }, generate: (data, relations, slots, {html, language}) => language.encapsulate('trackPage.nav', navCapsule => [ @@ -42,6 +46,17 @@ export default { return language.$(workingCapsule, workingOptions); }), + + accent: + html.tag('a', + {[html.onlyIfContent]: true}, + + {href: ''}, + {class: 'current'}, + + (slots.currentExtra === 'referenced-art' + ? language.$(navCapsule, 'referencedArtworks') + : null)), }, ]), }; diff --git a/src/content/dependencies/generateTrackReferencedArtworksPage.js b/src/content/dependencies/generateTrackReferencedArtworksPage.js new file mode 100644 index 00000000..545276c5 --- /dev/null +++ b/src/content/dependencies/generateTrackReferencedArtworksPage.js @@ -0,0 +1,143 @@ +import {stitchArrays} from '#sugar'; + +export default { + contentDependencies: [ + 'generateAlbumStyleRules', + 'generateBackToTrackLink', + 'generateCoverGrid', + 'generatePageLayout', + 'generateTrackCoverArtwork', + 'generateTrackNavLinks', + 'image', + 'linkAlbum', + 'linkTrack', + ], + + extraDependencies: ['html', 'language'], + + relations: (relation, track) => ({ + layout: + relation('generatePageLayout'), + + albumStyleRules: + relation('generateAlbumStyleRules', track.album, track), + + navLinks: + relation('generateTrackNavLinks', track), + + backToTrackLink: + relation('generateBackToTrackLink', track), + + cover: + relation('generateTrackCoverArtwork', track), + + coverGrid: + relation('generateCoverGrid'), + + links: + track.referencedArtworks + .map(({thing}) => + (thing.album + ? relation('linkTrack', thing) + : relation('linkAlbum', thing))), + + images: + track.referencedArtworks + .map(({thing}) => + relation('image', thing.artTags)), + }), + + data: (track) => ({ + name: + track.name, + + color: + track.color, + + count: + track.referencedArtworks.length, + + names: + track.referencedArtworks + .map(({thing}) => thing.name), + + paths: + track.referencedArtworks + .map(({thing}) => + (thing.album + ? ['media.trackCover', thing.album.directory, thing.directory, thing.coverArtFileExtension] + : ['media.albumCover', thing.directory, thing.coverArtFileExtension])), + + dimensions: + track.referencedArtworks + .map(({thing}) => thing.coverArtDimensions), + + coverArtistNames: + track.referencedArtworks + .map(({thing}) => + thing.coverArtistContribs + .map(contrib => contrib.artist.name)), + }), + + generate: (data, relations, {html, language}) => + language.encapsulate('trackReferencedArtworksPage', pageCapsule => + relations.layout.slots({ + title: + language.$(pageCapsule, 'title', { + track: + data.name, + }), + + subtitle: + language.$(pageCapsule, 'subtitle'), + + color: data.color, + styleRules: [relations.albumStyleRules], + + cover: + relations.cover + .slot('mode', 'primary-artists'), + + mainClasses: ['top-index'], + mainContent: [ + html.tag('p', {class: 'quick-info'}, + language.$(pageCapsule, 'statsLine', { + artworks: + language.countArtworks(data.count, { + unit: true, + }), + })), + + relations.coverGrid.slots({ + links: relations.links, + names: data.names, + + images: + stitchArrays({ + image: relations.images, + path: data.paths, + dimensions: data.dimensions, + }).map(({image, path, dimensions}) => + image.slots({ + path, + dimensions, + })), + + info: + data.coverArtistNames.map(names => + language.$('misc.coverGrid.details.coverArtists', { + artists: + language.formatUnitList(names), + })), + }), + ], + + navLinkStyle: 'hierarchical', + navLinks: + html.resolve( + relations.navLinks + .slot('currentExtra', 'referenced-art')), + + navBottomRowContent: relations.backToTrackLink, + })), +}; diff --git a/src/page/track.js b/src/page/track.js index e75b6958..beb804f8 100644 --- a/src/page/track.js +++ b/src/page/track.js @@ -1,5 +1,7 @@ // Track page specification. +import {empty} from '#sugar'; + export const description = `per-track info pages`; export function targets({wikiData}) { @@ -17,5 +19,16 @@ export function pathsForTarget(track) { args: [track], }, }, + + !empty(track.referencedArtworks) && + { + type: 'page', + path: ['trackReferencedArtworks', track.directory], + + contentFunction: { + name: 'generateTrackReferencedArtworksPage', + args: [track], + }, + }, ]; } diff --git a/src/strings-default.yaml b/src/strings-default.yaml index dd80063b..d93b98cc 100644 --- a/src/strings-default.yaml +++ b/src/strings-default.yaml @@ -2089,6 +2089,10 @@ trackPage: nav: random: "Random" + backToTrack: "Return to track page" + + referencedArtworks: "Referenced Artworks" + track: _: "{TRACK}" withNumber: "{NUMBER}. {TRACK}" @@ -2107,3 +2111,15 @@ trackPage: withArtists.withCoverArtists: "By {ARTISTS}; art by {COVER_ARTISTS}." withArtists: "By {ARTISTS}." withCoverArtists: "Art by {COVER_ARTISTS}." + +# +# trackReferencedArtworksPage: +# The track referenced-artworks page shows a gallery grid of all the +# artworks which the art for a track references. +# +trackReferencedArtworksPage: + title: "{TRACK}" + subtitle: "Referenced Artworks" + + statsLine: >- + References {ARTWORKS}. diff --git a/src/url-spec.js b/src/url-spec.js index 56366ed4..e4224ef6 100644 --- a/src/url-spec.js +++ b/src/url-spec.js @@ -65,6 +65,8 @@ const urlSpec = { tag: 'tag/<>/', track: 'track/<>/', + trackReferencedArtworks: 'track/<>/referenced-art/', + trackReferencingArtworks: 'track/<>/referencing-art/', }, }, -- cgit 1.3.0-6-gf8a5