From 97f587966f6239821589bd5c137b9875e7ae29b0 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Tue, 30 Apr 2024 16:41:07 -0300 Subject: content: generatePageSidebar: always use boxes slot Removes the 'content' shorthand slot, making the surface of all sidebars more predictable. --- .../dependencies/generateAlbumCommentaryPage.js | 29 ++----------- .../dependencies/generateAlbumCommentarySidebar.js | 47 ++++++++++++++++++++++ src/content/dependencies/generateGroupSidebar.js | 25 +++++++----- src/content/dependencies/generateListingSidebar.js | 16 ++++++-- src/content/dependencies/generatePageSidebar.js | 34 ++++------------ 5 files changed, 85 insertions(+), 66 deletions(-) create mode 100644 src/content/dependencies/generateAlbumCommentarySidebar.js (limited to 'src') diff --git a/src/content/dependencies/generateAlbumCommentaryPage.js b/src/content/dependencies/generateAlbumCommentaryPage.js index 751a0c91..7879269f 100644 --- a/src/content/dependencies/generateAlbumCommentaryPage.js +++ b/src/content/dependencies/generateAlbumCommentaryPage.js @@ -2,15 +2,14 @@ import {empty, stitchArrays} from '#sugar'; export default { contentDependencies: [ + 'generateAlbumCommentarySidebar', 'generateAlbumCoverArtwork', 'generateAlbumNavAccent', - 'generateAlbumSidebarTrackSection', 'generateAlbumStyleRules', 'generateCommentaryEntry', 'generateContentHeading', 'generateTrackCoverArtwork', 'generatePageLayout', - 'generatePageSidebar', 'linkAlbum', 'linkExternal', 'linkTrack', @@ -25,7 +24,7 @@ export default { relation('generatePageLayout'); relations.sidebar = - relation('generatePageSidebar'); + relation('generateAlbumCommentarySidebar', album); relations.albumStyleRules = relation('generateAlbumStyleRules', album, null); @@ -86,13 +85,6 @@ export default { track.commentary .map(entry => relation('generateCommentaryEntry', entry))); - relations.sidebarAlbumLink = - relation('linkAlbum', album); - - relations.sidebarTrackSections = - album.trackSections.map(trackSection => - relation('generateAlbumSidebarTrackSection', album, null, trackSection)); - return relations; }, @@ -253,22 +245,7 @@ export default { }, ], - leftSidebar: - relations.sidebar.slots({ - attributes: {class: 'commentary-track-list-sidebar-box'}, - - stickyMode: 'column', - - content: [ - html.tag('h1', relations.sidebarAlbumLink), - relations.sidebarTrackSections.map(section => - section.slots({ - anchor: true, - open: true, - mode: 'commentary', - })), - ], - }), + leftSidebar: relations.sidebar, }); }, }; diff --git a/src/content/dependencies/generateAlbumCommentarySidebar.js b/src/content/dependencies/generateAlbumCommentarySidebar.js new file mode 100644 index 00000000..435860cb --- /dev/null +++ b/src/content/dependencies/generateAlbumCommentarySidebar.js @@ -0,0 +1,47 @@ +export default { + contentDependencies: [ + 'generateAlbumSidebarTrackSection', + 'generatePageSidebar', + 'generatePageSidebarBox', + 'linkAlbum', + ], + + extraDependencies: ['html'], + + relations: (relation, album) => ({ + sidebar: + relation('generatePageSidebar'), + + sidebarBox: + relation('generatePageSidebarBox'), + + albumLink: + relation('linkAlbum', album), + + trackSections: + album.trackSections.map(trackSection => + relation('generateAlbumSidebarTrackSection', + album, + null, + trackSection)), + }), + + generate: (relations, {html}) => + relations.sidebar.slots({ + stickyMode: 'column', + boxes: [ + relations.sidebarBox.slots({ + attributes: {class: 'commentary-track-list-sidebar-box'}, + content: [ + html.tag('h1', relations.albumLink), + relations.trackSections.map(section => + section.slots({ + anchor: true, + open: true, + mode: 'commentary', + })), + ], + }), + ] + }), +} diff --git a/src/content/dependencies/generateGroupSidebar.js b/src/content/dependencies/generateGroupSidebar.js index 3abb3392..0888cbbe 100644 --- a/src/content/dependencies/generateGroupSidebar.js +++ b/src/content/dependencies/generateGroupSidebar.js @@ -2,6 +2,7 @@ export default { contentDependencies: [ 'generateGroupSidebarCategoryDetails', 'generatePageSidebar', + 'generatePageSidebarBox', ], extraDependencies: ['html', 'language', 'wikiData'], @@ -12,6 +13,9 @@ export default { sidebar: relation('generatePageSidebar'), + sidebarBox: + relation('generatePageSidebarBox'), + categoryDetails: sprawl.groupCategoryData.map(category => relation('generateGroupSidebarCategoryDetails', category, group)), @@ -25,15 +29,18 @@ export default { generate: (relations, slots, {html, language}) => relations.sidebar.slots({ - attributes: {class: 'category-map-sidebar-box'}, - - content: [ - html.tag('h1', - language.$('groupSidebar.title')), - - relations.categoryDetails - .map(details => - details.slot('currentExtra', slots.currentExtra)), + boxes: [ + relations.sidebarBox.slots({ + attributes: {class: 'category-map-sidebar-box'}, + content: [ + html.tag('h1', + language.$('groupSidebar.title')), + + relations.categoryDetails + .map(details => + details.slot('currentExtra', slots.currentExtra)), + ], + }), ], }), }; diff --git a/src/content/dependencies/generateListingSidebar.js b/src/content/dependencies/generateListingSidebar.js index 1e5c8bfc..aeac05cf 100644 --- a/src/content/dependencies/generateListingSidebar.js +++ b/src/content/dependencies/generateListingSidebar.js @@ -2,6 +2,7 @@ export default { contentDependencies: [ 'generateListingIndexList', 'generatePageSidebar', + 'generatePageSidebarBox', 'linkListingIndex', ], @@ -11,6 +12,9 @@ export default { sidebar: relation('generatePageSidebar'), + sidebarBox: + relation('generatePageSidebarBox'), + listingIndexLink: relation('linkListingIndex'), @@ -20,10 +24,14 @@ export default { generate: (relations, {html}) => relations.sidebar.slots({ - attributes: {class: 'listing-map-sidebar-box'}, - content: [ - html.tag('h1', relations.listingIndexLink), - relations.listingIndexList.slot('mode', 'sidebar'), + boxes: [ + relations.sidebarBox.slots({ + attributes: {class: 'listing-map-sidebar-box'}, + content: [ + html.tag('h1', relations.listingIndexLink), + relations.listingIndexList.slot('mode', 'sidebar'), + ], + }), ], }), }; diff --git a/src/content/dependencies/generatePageSidebar.js b/src/content/dependencies/generatePageSidebar.js index a7da3d1d..dda75dd3 100644 --- a/src/content/dependencies/generatePageSidebar.js +++ b/src/content/dependencies/generatePageSidebar.js @@ -1,29 +1,16 @@ export default { - contentDependencies: ['generatePageSidebarBox'], extraDependencies: ['html'], - relations: (relation) => ({ - box: - relation('generatePageSidebarBox'), - }), - slots: { - // Content is a flat HTML array. It'll all be placed into one sidebar box - // if specified. - content: { - type: 'html', - mutable: false, - }, - - // Attributes to apply to the whole sidebar. If specifying multiple - // sections, this be added to the containing sidebar-column, arr - specify - // attributes on each section if that's more suitable. + // Attributes to apply to the whole sidebar. This be added to the + // containing sidebar-column, arr - specify attributes on each section if + // that's more suitable. attributes: { type: 'attributes', mutable: false, }, - // Chunks of content to be split into separate boxes in the sidebar. + // Content boxes to line up vertically in the sidebar. boxes: { type: 'html', mutable: false, @@ -62,7 +49,7 @@ export default { }, }, - generate(relations, slots, {html}) { + generate(slots, {html}) { const attributes = html.attributes({class: [ 'sidebar-column', @@ -87,17 +74,10 @@ export default { attributes.add('class', `sticky-${slots.stickyMode}`); } - const boxes = - (!html.isBlank(slots.boxes) - ? slots.boxes - : !html.isBlank(slots.content) - ? relations.box.slot('content', slots.content) - : html.blank()); - - if (html.isBlank(boxes)) { + if (html.isBlank(slots.boxes)) { return html.blank(); } else { - return html.tag('div', attributes, boxes); + return html.tag('div', attributes, slots.boxes); } }, }; -- cgit 1.3.0-6-gf8a5