diff options
Diffstat (limited to 'src/content/dependencies')
-rw-r--r-- | src/content/dependencies/generateListRandomPageLinksGroupSection.js | 79 | ||||
-rw-r--r-- | src/content/dependencies/listRandomPageLinks.js | 77 |
2 files changed, 149 insertions, 7 deletions
diff --git a/src/content/dependencies/generateListRandomPageLinksGroupSection.js b/src/content/dependencies/generateListRandomPageLinksGroupSection.js new file mode 100644 index 00000000..9a46e2c3 --- /dev/null +++ b/src/content/dependencies/generateListRandomPageLinksGroupSection.js @@ -0,0 +1,79 @@ +import {stitchArrays} from '../../util/sugar.js'; + +export default { + contentDependencies: ['generateColorStyleVariables', 'linkGroup'], + extraDependencies: ['html', 'language', 'wikiData'], + + sprawl: ({albumData}) => ({albumData}), + + query: (sprawl, group) => ({ + albums: + sprawl.albumData + .filter(album => album.groups.includes(group)), + }), + + relations: (relation, query, sprawl, group) => ({ + groupLink: + relation('linkGroup', group), + + albumColorVariables: + query.albums + .map(() => relation('generateColorStyleVariables')), + }), + + data: (query, sprawl, group) => ({ + groupDirectory: + group.directory, + + albumColors: + query.albums + .map(album => album.color), + + albumDirectories: + query.albums + .map(album => album.directory), + + albumNames: + query.albums + .map(album => album.name), + }), + + generate: (data, relations, {html, language}) => + html.tags([ + html.tag('dt', + language.$('listingPage.other.randomPages.group', { + group: relations.groupLink, + + randomAlbum: + html.tag('a', + {href: '#', 'data-random': 'album-in-' + data.groupDirectory}, + language.$('listingPage.other.randomPages.group.randomAlbum')), + + randomTrack: + html.tag('a', + {href: '#', 'data-random': 'track-in-' + data.groupDirectory}, + language.$('listingPage.other.randomPages.group.randomTrack')), + })), + + html.tag('dd', + html.tag('ul', + stitchArrays({ + colorVariables: relations.albumColorVariables, + color: data.albumColors, + directory: data.albumDirectories, + name: data.albumNames, + }).map(({colorVariables, color, directory, name}) => + html.tag('li', + language.$('listingPage.other.randomPages.album', { + album: + html.tag('a', { + href: '#', + 'data-random': 'track-in-album', + style: + colorVariables.slot('color', color).content + + '; ' + + `--album-directory: ${directory}`, + }, name), + }))))), + ]), +}; diff --git a/src/content/dependencies/listRandomPageLinks.js b/src/content/dependencies/listRandomPageLinks.js index 28a925ac..43bf7dd5 100644 --- a/src/content/dependencies/listRandomPageLinks.js +++ b/src/content/dependencies/listRandomPageLinks.js @@ -1,28 +1,91 @@ export default { - contentDependencies: ['generateListingPage'], - extraDependencies: ['html', 'wikiData'], + contentDependencies: [ + 'generateListingPage', + 'generateListRandomPageLinksGroupSection', + ], - sprawl() { - return {}; + extraDependencies: ['html', 'language', 'wikiData'], + + sprawl({groupData}) { + return {groupData}; }, query(sprawl, spec) { + const group = directory => + sprawl.groupData.find(group => group.directory === directory); + return { spec, + officialGroup: group('official'), + fandomGroup: group('fandom'), + beyondGroup: group('beyond'), }; }, relations(relation, query) { return { page: relation('generateListingPage', query.spec), + + officialSection: + relation('generateListRandomPageLinksGroupSection', query.officialGroup), + + fandomSection: + relation('generateListRandomPageLinksGroupSection', query.fandomGroup), + + beyondSection: + relation('generateListRandomPageLinksGroupSection', query.beyondGroup), }; }, - generate(relations, {html}) { + generate(relations, {html, language}) { return relations.page.slots({ type: 'custom', - content: - html.tag('p', `Alright alright, this is a stub page! Coming soon!`), + content: [ + html.tag('p', + language.$('listingPage.other.randomPages.chooseLinkLine')), + + html.tag('p', + {class: 'js-hide-once-data'}, + language.$('listingPage.other.randomPages.dataLoadingLine')), + + html.tag('p', + {class: 'js-show-once-data'}, + language.$('listingPage.other.randomPages.dataLoadedLine')), + + html.tag('dl', [ + html.tag('dt', + language.$('listingPage.other.randomPages.misc')), + + html.tag('dd', + html.tag('ul', [ + html.tag('li', [ + html.tag('a', + {href: '#', 'data-random': 'artist'}, + language.$('listingPage.other.randomPages.misc.randomArtist')), + + '(' + + html.tag('a', + {href: '#', 'data-random': 'artist-more-than-one-contrib'}, + language.$('listingPage.other.randomPages.misc.atLeastTwoContributions')) + + ')', + ]), + + html.tag('li', + html.tag('a', + {href: '#', 'data-random': 'album'}, + language.$('listingPage.other.randomPages.misc.randomAlbumWholeSite'))), + + html.tag('li', + html.tag('a', + {href: '#', 'data-random': 'track'}, + language.$('listingPage.other.randomPages.misc.randomTrackWholeSite'))), + ])), + + relations.officialSection, + relations.fandomSection, + relations.beyondSection, + ]), + ], }); }, }; |