From 284008f34ef1efd24edf252c0ddbccddc1ba8d73 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Sun, 23 Jun 2024 21:50:16 -0300 Subject: content: generateCommentaryEntryDate Just moves somewhat complex logic out of the main component. --- .../dependencies/generateCommentaryEntry.js | 76 ++------------------- .../dependencies/generateCommentaryEntryDate.js | 78 ++++++++++++++++++++++ 2 files changed, 83 insertions(+), 71 deletions(-) create mode 100644 src/content/dependencies/generateCommentaryEntryDate.js diff --git a/src/content/dependencies/generateCommentaryEntry.js b/src/content/dependencies/generateCommentaryEntry.js index c148d244..b51d4315 100644 --- a/src/content/dependencies/generateCommentaryEntry.js +++ b/src/content/dependencies/generateCommentaryEntry.js @@ -2,9 +2,8 @@ import {empty} from '#sugar'; export default { contentDependencies: [ + 'generateCommentaryEntryDate', 'generateColorStyleAttribute', - 'generateTextWithTooltip', - 'generateTooltip', 'linkArtist', 'transformContent', ], @@ -36,27 +35,15 @@ export default { colorStyle: relation('generateColorStyleAttribute'), - textWithTooltip: - relation('generateTextWithTooltip'), - - tooltip: - relation('generateTooltip'), - }), - - data: (entry) => ({ - date: entry.date, - secondDate: entry.secondDate, - dateKind: entry.dateKind, - - accessDate: entry.accessDate, - accessKind: entry.accessKind, + date: + relation('generateCommentaryEntryDate', entry), }), slots: { color: {validate: v => v.isColor}, }, - generate: (data, relations, slots, {html, language}) => + generate: (relations, slots, {html, language}) => language.encapsulate('misc.artistCommentary.entry', entryCapsule => html.tags([ html.tag('p', {class: 'commentary-entry-heading'}, @@ -106,60 +93,7 @@ export default { return language.$(workingCapsule, workingOptions); })), - relations.textWithTooltip.slots({ - attributes: {class: 'commentary-date'}, - - customInteractionCue: true, - - text: - html.tag('time', - {class: 'text-with-tooltip-interaction-cue'}, - {[html.onlyIfContent]: true}, - - language.encapsulate(titleCapsule, 'date', workingCapsule => { - const workingOptions = {}; - - if (!data.date) { - return html.blank(); - } - - const rangeNeeded = - data.dateKind === 'sometime' || - data.dateKind === 'throughout'; - - if (rangeNeeded && !data.secondDate) { - workingOptions.date = language.formatDate(data.date); - return language.$(workingCapsule, workingOptions); - } - - if (data.dateKind) { - workingCapsule += '.' + data.dateKind; - } - - if (data.secondDate) { - workingCapsule += '.range'; - workingOptions.dateRange = - language.formatDateRange(data.date, data.secondDate); - } else { - workingOptions.date = - language.formatDate(data.date); - } - - return language.$(workingCapsule, workingOptions); - })), - - tooltip: - data.accessKind && - relations.tooltip.slots({ - attributes: {class: 'commentary-date-tooltip'}, - - content: - language.$(titleCapsule, 'date', data.accessKind, { - date: - language.formatDate(data.accessDate), - }), - }), - }), + relations.date, ])), html.tag('blockquote', {class: 'commentary-entry-body'}, diff --git a/src/content/dependencies/generateCommentaryEntryDate.js b/src/content/dependencies/generateCommentaryEntryDate.js new file mode 100644 index 00000000..628bf22f --- /dev/null +++ b/src/content/dependencies/generateCommentaryEntryDate.js @@ -0,0 +1,78 @@ +export default { + contentDependencies: ['generateTextWithTooltip', 'generateTooltip'], + extraDependencies: ['html', 'language'], + + relations: (relation, _entry) => ({ + textWithTooltip: + relation('generateTextWithTooltip'), + + tooltip: + relation('generateTooltip'), + }), + + data: (entry) => ({ + date: entry.date, + secondDate: entry.secondDate, + dateKind: entry.dateKind, + + accessDate: entry.accessDate, + accessKind: entry.accessKind, + }), + + generate: (data, relations, {html, language}) => + language.encapsulate('misc.artistCommentary.entry.title', titleCapsule => + relations.textWithTooltip.slots({ + attributes: {class: 'commentary-date'}, + + customInteractionCue: true, + + text: + html.tag('time', + {class: 'text-with-tooltip-interaction-cue'}, + {[html.onlyIfContent]: true}, + + language.encapsulate(titleCapsule, 'date', workingCapsule => { + const workingOptions = {}; + + if (!data.date) { + return html.blank(); + } + + const rangeNeeded = + data.dateKind === 'sometime' || + data.dateKind === 'throughout'; + + if (rangeNeeded && !data.secondDate) { + workingOptions.date = language.formatDate(data.date); + return language.$(workingCapsule, workingOptions); + } + + if (data.dateKind) { + workingCapsule += '.' + data.dateKind; + } + + if (data.secondDate) { + workingCapsule += '.range'; + workingOptions.dateRange = + language.formatDateRange(data.date, data.secondDate); + } else { + workingOptions.date = + language.formatDate(data.date); + } + + return language.$(workingCapsule, workingOptions); + })), + + tooltip: + data.accessKind && + relations.tooltip.slots({ + attributes: {class: 'commentary-date-tooltip'}, + + content: + language.$(titleCapsule, 'date', data.accessKind, { + date: + language.formatDate(data.accessDate), + }), + }), + })), +} -- cgit 1.3.0-6-gf8a5