diff options
Diffstat (limited to 'src/content/dependencies/generateAlbumCommentaryPage.js')
| -rw-r--r-- | src/content/dependencies/generateAlbumCommentaryPage.js | 240 |
1 files changed, 145 insertions, 95 deletions
diff --git a/src/content/dependencies/generateAlbumCommentaryPage.js b/src/content/dependencies/generateAlbumCommentaryPage.js index 05dbdcf3..1e39b47d 100644 --- a/src/content/dependencies/generateAlbumCommentaryPage.js +++ b/src/content/dependencies/generateAlbumCommentaryPage.js @@ -1,14 +1,14 @@ -import {stitchArrays} from '#sugar'; +import {empty, stitchArrays} from '#sugar'; export default { contentDependencies: [ 'generateAlbumCommentarySidebar', - 'generateAlbumCoverArtwork', 'generateAlbumNavAccent', + 'generateAlbumSecondaryNav', 'generateAlbumStyleRules', 'generateCommentaryEntry', 'generateContentHeading', - 'generateTrackCoverArtwork', + 'generateCoverArtwork', 'generatePageLayout', 'linkAlbum', 'linkExternal', @@ -17,12 +17,30 @@ export default { extraDependencies: ['html', 'language'], - relations(relation, album) { + query(album) { + const query = {}; + + query.tracksWithCommentary = + album.tracks + .filter(({commentary}) => !empty(commentary)); + + query.thingsWithCommentary = + (empty(album.commentary) + ? query.tracksWithCommentary + : [album, ...query.tracksWithCommentary]); + + return query; + }, + + relations(relation, query, album) { const relations = {}; relations.layout = relation('generatePageLayout'); + relations.secondaryNav = + relation('generateAlbumSecondaryNav', album); + relations.sidebar = relation('generateAlbumCommentarySidebar', album); @@ -35,7 +53,7 @@ export default { relations.albumNavAccent = relation('generateAlbumNavAccent', album, null); - if (album.commentary) { + if (!empty(album.commentary)) { relations.albumCommentaryHeading = relation('generateContentHeading'); @@ -47,7 +65,7 @@ export default { if (album.hasCoverArt) { relations.albumCommentaryCover = - relation('generateAlbumCoverArtwork', album); + relation('generateCoverArtwork', album.coverArtworks[0]); } relations.albumCommentaryEntries = @@ -55,32 +73,28 @@ export default { .map(entry => relation('generateCommentaryEntry', entry)); } - const tracksWithCommentary = - album.tracks - .filter(({commentary}) => commentary); - relations.trackCommentaryHeadings = - tracksWithCommentary + query.tracksWithCommentary .map(() => relation('generateContentHeading')); relations.trackCommentaryLinks = - tracksWithCommentary + query.tracksWithCommentary .map(track => relation('linkTrack', track)); relations.trackCommentaryListeningLinks = - tracksWithCommentary + query.tracksWithCommentary .map(track => track.urls.map(url => relation('linkExternal', url))); relations.trackCommentaryCovers = - tracksWithCommentary + query.tracksWithCommentary .map(track => (track.hasUniqueCoverArt - ? relation('generateTrackCoverArtwork', track) + ? relation('generateCoverArtwork', track.trackArtworks[0]) : null)); relations.trackCommentaryEntries = - tracksWithCommentary + query.tracksWithCommentary .map(track => track.commentary .map(entry => relation('generateCommentaryEntry', entry))); @@ -88,40 +102,36 @@ export default { return relations; }, - data(album) { + data(query, album) { const data = {}; data.name = album.name; data.color = album.color; - - const tracksWithCommentary = - album.tracks - .filter(({commentary}) => commentary); - - const thingsWithCommentary = - (album.commentary - ? [album, ...tracksWithCommentary] - : tracksWithCommentary); + data.date = album.date; data.entryCount = - thingsWithCommentary + query.thingsWithCommentary .flatMap(({commentary}) => commentary) .length; data.wordCount = - thingsWithCommentary + query.thingsWithCommentary .flatMap(({commentary}) => commentary) .map(({body}) => body) .join(' ') .split(' ') .length; + data.trackCommentaryTrackDates = + query.tracksWithCommentary + .map(track => track.dateFirstReleased); + data.trackCommentaryDirectories = - tracksWithCommentary + query.tracksWithCommentary .map(track => track.directory); data.trackCommentaryColors = - tracksWithCommentary + query.tracksWithCommentary .map(track => (track.color === album.color ? null @@ -130,11 +140,11 @@ export default { return data; }, - generate(data, relations, {html, language}) { - return relations.layout - .slots({ + generate: (data, relations, {html, language}) => + language.encapsulate('albumCommentaryPage', pageCapsule => + relations.layout.slots({ title: - language.$('albumCommentaryPage.title', { + language.$(pageCapsule, 'title', { album: data.name, }), @@ -146,49 +156,74 @@ export default { mainClasses: ['long-content'], mainContent: [ html.tag('p', - language.$('albumCommentaryPage.infoLine', { - words: - html.tag('b', - language.formatWordCount(data.wordCount, {unit: true})), - - entries: - html.tag('b', - language.countCommentaryEntries(data.entryCount, {unit: true})), - })), - - relations.albumCommentaryEntries && [ - relations.albumCommentaryHeading.slots({ - tag: 'h3', - color: data.color, - - title: - language.$('albumCommentaryPage.entry.title.albumCommentary', { - album: relations.albumCommentaryLink, + {[html.joinChildren]: html.tag('br')}, + + [ + data.date && + data.entryCount >= 1 && + language.$('releaseInfo.albumReleased', { + date: + html.tag('b', + language.formatDate(data.date)), }), - stickyTitle: - language.$('albumCommentaryPage.entry.title.albumCommentary.sticky', { - album: data.name, - }), + language.encapsulate(pageCapsule, 'infoLine', workingCapsule => { + const workingOptions = {}; - accent: - language.$('albumCommentaryPage.entry.title.albumCommentary.accent', { - [language.onlyIfOptions]: ['listeningLinks'], - listeningLinks: - language.formatUnitList( - relations.albumCommentaryListeningLinks - .map(link => link.slots({ - context: 'album', - tab: 'separate', - }))), - }), - }), + if (data.entryCount >= 1) { + workingOptions.words = + html.tag('b', + language.formatWordCount(data.wordCount, {unit: true})); + + workingOptions.entries = + html.tag('b', + language.countCommentaryEntries(data.entryCount, {unit: true})); + } - relations.albumCommentaryCover - ?.slots({mode: 'commentary'}), + if (data.entryCount === 0) { + workingCapsule += '.withoutCommentary'; + } - relations.albumCommentaryEntries, - ], + return language.$(workingCapsule, workingOptions); + }) + ]), + + relations.albumCommentaryEntries && + language.encapsulate(pageCapsule, 'entry', entryCapsule => [ + language.encapsulate(entryCapsule, 'title.albumCommentary', titleCapsule => + relations.albumCommentaryHeading.slots({ + tag: 'h3', + attributes: {id: 'album-commentary'}, + color: data.color, + + title: + language.$(titleCapsule, { + album: relations.albumCommentaryLink, + }), + + stickyTitle: + language.$(titleCapsule, 'sticky', { + album: data.name, + }), + + accent: + language.$(titleCapsule, 'accent', { + [language.onlyIfOptions]: ['listeningLinks'], + listeningLinks: + language.formatUnitList( + relations.albumCommentaryListeningLinks + .map(link => link.slots({ + context: 'album', + tab: 'separate', + }))), + }), + })), + + relations.albumCommentaryCover + ?.slots({mode: 'commentary'}), + + relations.albumCommentaryEntries, + ]), stitchArrays({ heading: relations.trackCommentaryHeadings, @@ -198,6 +233,7 @@ export default { cover: relations.trackCommentaryCovers, entries: relations.trackCommentaryEntries, color: data.trackCommentaryColors, + trackDate: data.trackCommentaryTrackDates, }).map(({ heading, link, @@ -206,31 +242,41 @@ export default { cover, entries, color, - }) => [ - heading.slots({ - tag: 'h3', - attributes: {id: directory}, - color, - - title: - language.$('albumCommentaryPage.entry.title.trackCommentary', { - track: link, - }), - - accent: - language.$('albumCommentaryPage.entry.title.trackCommentary.accent', { - [language.onlyIfOptions]: ['listeningLinks'], - listeningLinks: - language.formatUnitList( - listeningLinks.map(link => - link.slot('tab', 'separate'))), - }), - }), + trackDate, + }) => + language.encapsulate(pageCapsule, 'entry', entryCapsule => [ + language.encapsulate(entryCapsule, 'title.trackCommentary', titleCapsule => + heading.slots({ + tag: 'h3', + attributes: {id: directory}, + color, + + title: + language.$(titleCapsule, { + track: link, + }), + + accent: + language.$(titleCapsule, 'accent', { + [language.onlyIfOptions]: ['listeningLinks'], + listeningLinks: + language.formatUnitList( + listeningLinks.map(link => + link.slot('tab', 'separate'))), + }), + })), cover?.slots({mode: 'commentary'}), + trackDate && + trackDate !== data.date && + html.tag('p', {class: 'track-info'}, + language.$('releaseInfo.trackReleased', { + date: language.formatDate(trackDate), + })), + entries.map(entry => entry.slot('color', color)), - ]), + ])), ], navLinkStyle: 'hierarchical', @@ -250,7 +296,11 @@ export default { }, ], + secondaryNav: + relations.secondaryNav.slots({ + alwaysVisible: true, + }), + leftSidebar: relations.sidebar, - }); - }, + })), }; |