diff options
author | (quasar) nebula <qznebula@protonmail.com> | 2023-10-14 13:35:18 -0300 |
---|---|---|
committer | (quasar) nebula <qznebula@protonmail.com> | 2025-02-25 20:03:27 -0400 |
commit | db9b437cbb5a36e5a497345b408205d8da81078f (patch) | |
tree | d277908ef1fde671915c154b9771ebc6a37518d6 /src/content/dependencies | |
parent | dd1e0cbb5f7c85119164b6ab768d0ffcb725ad67 (diff) |
content, client, css: tag gallery: showing all / direct / indirect
Diffstat (limited to 'src/content/dependencies')
3 files changed, 98 insertions, 14 deletions
diff --git a/src/content/dependencies/generateArtTagGalleryPage.js b/src/content/dependencies/generateArtTagGalleryPage.js index 95d9469a..26a52656 100644 --- a/src/content/dependencies/generateArtTagGalleryPage.js +++ b/src/content/dependencies/generateArtTagGalleryPage.js @@ -3,6 +3,8 @@ import {empty, stitchArrays, unique} from '#sugar'; export default { contentDependencies: [ + 'generateArtTagGalleryPageFeaturedLine', + 'generateArtTagGalleryPageShowingLine', 'generateArtTagNavLinks', 'generateCoverGrid', 'generatePageLayout', @@ -47,6 +49,12 @@ export default { relations.quickDescription = relation('generateQuickDescription', artTag); + relations.featuredLine = + relation('generateArtTagGalleryPageFeaturedLine'); + + relations.showingLine = + relation('generateArtTagGalleryPageShowingLine'); + if (!empty(artTag.extraReadingURLs)) { relations.extraReadingLinks = artTag.extraReadingURLs @@ -90,7 +98,9 @@ export default { data.name = artTag.name; data.color = artTag.color; - data.numArtworks = query.allThings.length; + data.numArtworksIndirectly = query.indirectThings.length; + data.numArtworksDirectly = query.directThings.length; + data.numArtworksTotal = query.allThings.length; data.names = query.allThings.map(thing => thing.name); @@ -113,6 +123,10 @@ export default { query.allThings.map(thing => !query.directThings.includes(thing)); + data.hasMixedDirectIndirect = + data.onlyFeaturedIndirectly.includes(true) && + data.onlyFeaturedIndirectly.includes(false); + return data; }, @@ -134,19 +148,33 @@ export default { extraReadingLinks: relations.extraReadingLinks ?? null, }), - html.tag('p', {class: 'quick-info'}, - language.encapsulate(pageCapsule, 'infoLine', capsule => - (data.numArtworks === 0 - ? language.encapsulate(capsule, 'notFeatured', capsule => [ - language.$(capsule), - html.tag('br'), - language.$(capsule, 'callToAction'), - ]) - : language.$(capsule, { - coverArts: language.countArtworks(data.numArtworks, { - unit: true, - }), - })))), + data.numArtworksTotal === 0 && + html.tag('p', {class: 'quick-info'}, + language.encapsulate(pageCapsule, 'featuredLine.notFeatured', capsule => [ + language.$(capsule), + html.tag('br'), + language.$(capsule, 'callToAction'), + ])), + + relations.featuredLine.clone() + .slots({ + showing: 'all', + count: data.numArtworksTotal, + }), + + data.hasMixedDirectIndirect && [ + relations.featuredLine.clone() + .slots({ + showing: 'direct', + count: data.numArtworksDirectly, + }), + + relations.featuredLine.clone() + .slots({ + showing: 'indirect', + count: data.numArtworksIndirectly, + }), + ], relations.ancestorLinks && html.tag('p', {class: 'quick-info'}, @@ -160,6 +188,17 @@ export default { tags: language.formatUnitList(relations.descendantLinks), })), + data.hasMixedDirectIndirect && [ + relations.showingLine.clone() + .slot('showing', 'all'), + + relations.showingLine.clone() + .slot('showing', 'direct'), + + relations.showingLine.clone() + .slot('showing', 'indirect'), + ], + relations.coverGrid .slots({ links: relations.links, diff --git a/src/content/dependencies/generateArtTagGalleryPageFeaturedLine.js b/src/content/dependencies/generateArtTagGalleryPageFeaturedLine.js new file mode 100644 index 00000000..b4620fa4 --- /dev/null +++ b/src/content/dependencies/generateArtTagGalleryPageFeaturedLine.js @@ -0,0 +1,23 @@ +export default { + extraDependencies: ['html', 'language'], + + slots: { + showing: { + validate: v => v.is('all', 'direct', 'indirect'), + }, + + count: {type: 'number'}, + }, + + generate: (slots, {html, language}) => + language.encapsulate('artTagGalleryPage', pageCapsule => + html.tag('p', {class: 'quick-info'}, + {id: `featured-${slots.showing}-line`}, + + language.$(pageCapsule, 'featuredLine', slots.showing, { + coverArts: + language.countArtworks(slots.count, { + unit: true, + }), + }))), +}; diff --git a/src/content/dependencies/generateArtTagGalleryPageShowingLine.js b/src/content/dependencies/generateArtTagGalleryPageShowingLine.js new file mode 100644 index 00000000..6df4d0e5 --- /dev/null +++ b/src/content/dependencies/generateArtTagGalleryPageShowingLine.js @@ -0,0 +1,22 @@ +export default { + extraDependencies: ['html', 'language'], + + slots: { + showing: { + validate: v => v.is('all', 'direct', 'indirect'), + }, + + count: {type: 'number'}, + }, + + generate: (slots, {html, language}) => + language.encapsulate('artTagGalleryPage', pageCapsule => + html.tag('p', {class: 'quick-info'}, + {id: `showing-${slots.showing}-line`}, + + language.$(pageCapsule, 'showingLine', { + showing: + html.tag('a', {href: '#'}, + language.$(pageCapsule, 'showingLine', slots.showing)), + }))), +}; |