From 38e048838eae945a1b0ed8cffd747c0534e46af2 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Sun, 3 Dec 2023 13:28:26 -0400 Subject: content: generateAdditionalNamesBoxItem + "from" support --- .../dependencies/generateAdditionalNamesBox.js | 46 +++------------ .../dependencies/generateAdditionalNamesBoxItem.js | 68 ++++++++++++++++++++++ src/static/site6.css | 2 +- src/strings-default.yaml | 8 ++- 4 files changed, 84 insertions(+), 40 deletions(-) create mode 100644 src/content/dependencies/generateAdditionalNamesBoxItem.js (limited to 'src') diff --git a/src/content/dependencies/generateAdditionalNamesBox.js b/src/content/dependencies/generateAdditionalNamesBox.js index f7fa3b00..63427c58 100644 --- a/src/content/dependencies/generateAdditionalNamesBox.js +++ b/src/content/dependencies/generateAdditionalNamesBox.js @@ -1,48 +1,20 @@ -import {stitchArrays} from '#sugar'; - export default { - contentDependencies: ['transformContent'], + contentDependencies: ['generateAdditionalNamesBoxItem'], extraDependencies: ['html', 'language'], relations: (relation, additionalNames) => ({ - names: - additionalNames.map(({name}) => - relation('transformContent', name)), - - annotations: - additionalNames.map(({annotation}) => - (annotation - ? relation('transformContent', annotation) - : null)), + items: + additionalNames + .map(entry => relation('generateAdditionalNamesBoxItem', entry)), }), - generate: (relations, {html, language}) => { - const names = - relations.names.map(name => - html.tag('span', {class: 'additional-name'}, - name.slot('mode', 'inline'))); - - const annotations = - relations.annotations.map(annotation => - (annotation - ? html.tag('span', {class: 'annotation'}, - language.$('misc.additionalNames.item.annotation', { - annotation: - annotation.slot('mode', 'inline'), - })) - : null)); - - return html.tag('div', {id: 'additional-names-box'}, [ + generate: (relations, {html, language}) => + html.tag('div', {id: 'additional-names-box'}, [ html.tag('p', language.$('misc.additionalNames.title')), html.tag('ul', - stitchArrays({name: names, annotation: annotations}) - .map(({name, annotation}) => - html.tag('li', - (annotation - ? language.$('misc.additionalNames.item.withAnnotation', {name, annotation}) - : language.$('misc.additionalNames.item', {name}))))), - ]); - }, + relations.items + .map(item => html.tag('li', item))), + ]), }; diff --git a/src/content/dependencies/generateAdditionalNamesBoxItem.js b/src/content/dependencies/generateAdditionalNamesBoxItem.js new file mode 100644 index 00000000..bb4c8477 --- /dev/null +++ b/src/content/dependencies/generateAdditionalNamesBoxItem.js @@ -0,0 +1,68 @@ +import {stitchArrays} from '#sugar'; + +export default { + contentDependencies: ['linkTrack', 'transformContent'], + extraDependencies: ['html', 'language'], + + relations: (relation, entry) => ({ + nameContent: + relation('transformContent', entry.name), + + annotationContent: + (entry.annotation + ? relation('transformContent', entry.annotation) + : null), + + trackLinks: + (entry.from + ? entry.from.map(track => relation('linkTrack', track)) + : null), + }), + + data: (entry) => ({ + albumNames: + (entry.from + ? entry.from.map(track => track.album.name) + : null), + }), + + generate: (data, relations, {html, language}) => { + const prefix = 'misc.additionalNames.item'; + + const itemParts = [prefix]; + const itemOptions = {}; + + itemOptions.name = + html.tag('span', {class: 'additional-name'}, + relations.nameContent.slot('mode', 'inline')); + + const accentParts = [prefix, 'accent']; + const accentOptions = {}; + + if (relations.annotationContent) { + accentParts.push('withAnnotation'); + accentOptions.annotation = + relations.annotationContent.slot('mode', 'inline'); + } + + if (relations.trackLinks) { + accentParts.push('withAlbums'); + accentOptions.albums = + language.formatConjunctionList( + stitchArrays({ + trackLink: relations.trackLinks, + albumName: data.albumNames, + }).map(({trackLink, albumName}) => + trackLink.slot('content', albumName))); + } + + if (accentParts.length > 2) { + itemParts.push('withAccent'); + itemOptions.accent = + html.tag('span', {class: 'accent'}, + language.$(...accentParts, accentOptions)); + } + + return language.$(...itemParts, itemOptions); + }, +}; diff --git a/src/static/site6.css b/src/static/site6.css index 76b58f32..892458d6 100644 --- a/src/static/site6.css +++ b/src/static/site6.css @@ -955,7 +955,7 @@ h1 a[href="#additional-names-box"]:hover { margin-top: 0.5em; } -#additional-names-box li .annotation { +#additional-names-box li .accent { opacity: 0.8; display: inline-block; } diff --git a/src/strings-default.yaml b/src/strings-default.yaml index f02a10a0..53763dcc 100644 --- a/src/strings-default.yaml +++ b/src/strings-default.yaml @@ -346,8 +346,12 @@ misc: item: _: "{NAME}" - withAnnotation: "{NAME} {ANNOTATION}" - annotation: "({ANNOTATION})" + withAccent: "{NAME} {ACCENT}" + + accent: + withAnnotation: "({ANNOTATION})" + withAlbums: "(on {ALBUMS})" + withAnnotations.withAlbums: "({ANNOTATION}; on {ALBUMS})" # alt: # Fallback text for the alt text of images and artworks - these -- cgit 1.3.0-6-gf8a5