« get me outta code hell

hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/content/dependencies
diff options
context:
space:
mode:
Diffstat (limited to 'src/content/dependencies')
-rw-r--r--src/content/dependencies/generateAlbumCommentaryPage.js5
-rw-r--r--src/content/dependencies/generateAlbumGalleryStatsLine.js84
-rw-r--r--src/content/dependencies/generateAlbumGalleryTrackGrid.js6
-rw-r--r--src/content/dependencies/generateAlbumInfoPage.js45
-rw-r--r--src/content/dependencies/generateAlbumNavAccent.js11
-rw-r--r--src/content/dependencies/generateAlbumReleaseInfo.js40
-rw-r--r--src/content/dependencies/generateAlbumSidebar.js79
-rw-r--r--src/content/dependencies/generateAlbumSidebarTrackListBox.js4
-rw-r--r--src/content/dependencies/generateAlbumSidebarTrackSection.js23
-rw-r--r--src/content/dependencies/generateAlbumTrackListItem.js2
-rw-r--r--src/content/dependencies/generateArtistCredit.js47
-rw-r--r--src/content/dependencies/generateArtistCreditWikiEditsPart.js1
-rw-r--r--src/content/dependencies/generateArtistGalleryPage.js6
-rw-r--r--src/content/dependencies/generateArtistGroupContributionsInfo.js137
-rw-r--r--src/content/dependencies/generateArtistInfoPage.js44
-rw-r--r--src/content/dependencies/generateArtistInfoPageArtworksChunkItem.js10
-rw-r--r--src/content/dependencies/generateArtistInfoPageFirstReleaseTooltip.js4
-rw-r--r--src/content/dependencies/generateArtistInfoPageRereleaseTooltip.js4
-rw-r--r--src/content/dependencies/generateArtistInfoPageTracksChunkItem.js12
-rw-r--r--src/content/dependencies/generateArtistNavLinks.js13
-rw-r--r--src/content/dependencies/generateArtistRollingWindowPage.js428
-rw-r--r--src/content/dependencies/generateCommentaryContentHeading.js33
-rw-r--r--src/content/dependencies/generateContentContentHeading.js39
-rw-r--r--src/content/dependencies/generateContributionTooltip.js152
-rw-r--r--src/content/dependencies/generateContributionTooltipChronologySection.js56
-rw-r--r--src/content/dependencies/generateCoverArtwork.js30
-rw-r--r--src/content/dependencies/generateCoverArtworkOriginDetails.js18
-rw-r--r--src/content/dependencies/generateCoverGrid.js64
-rw-r--r--src/content/dependencies/generateFlashInfoPage.js19
-rw-r--r--src/content/dependencies/generateGroupGalleryPage.js5
-rw-r--r--src/content/dependencies/generateGroupGalleryPageAlbumGrid.js74
-rw-r--r--src/content/dependencies/generateGroupGalleryPageAlbumGridTab.js82
-rw-r--r--src/content/dependencies/generateGroupGalleryPageAlbumsByDateView.js22
-rw-r--r--src/content/dependencies/generateGroupGalleryPageStyleSelector.js62
-rw-r--r--src/content/dependencies/generateGroupInfoPageAlbumsListItem.js4
-rw-r--r--src/content/dependencies/generateIntrapageDotSwitcher.js31
-rw-r--r--src/content/dependencies/generateLyricsSection.js29
-rw-r--r--src/content/dependencies/generateReadCommentaryLine.js47
-rw-r--r--src/content/dependencies/generateReleaseInfoListenLine.js159
-rw-r--r--src/content/dependencies/generateTrackArtistCommentarySection.js60
-rw-r--r--src/content/dependencies/generateTrackInfoPage.js113
-rw-r--r--src/content/dependencies/generateTrackList.js13
-rw-r--r--src/content/dependencies/generateTrackListDividedByGroups.js10
-rw-r--r--src/content/dependencies/generateTrackListItem.js4
-rw-r--r--src/content/dependencies/generateTrackReleaseInfo.js31
-rw-r--r--src/content/dependencies/linkAlbum.js10
-rw-r--r--src/content/dependencies/linkAnythingMan.js14
-rw-r--r--src/content/dependencies/linkArtistRollingWindow.js8
-rw-r--r--src/content/dependencies/linkArtwork.js11
-rw-r--r--src/content/dependencies/linkContribution.js2
-rw-r--r--src/content/dependencies/linkReferencedArtworks.js13
-rw-r--r--src/content/dependencies/linkReferencingArtworks.js13
-rw-r--r--src/content/dependencies/listAlbumsByDuration.js8
-rw-r--r--src/content/dependencies/listAlbumsByTracks.js31
-rw-r--r--src/content/dependencies/listArtistsByContributions.js52
-rw-r--r--src/content/dependencies/transformContent.js91
56 files changed, 1867 insertions, 548 deletions
diff --git a/src/content/dependencies/generateAlbumCommentaryPage.js b/src/content/dependencies/generateAlbumCommentaryPage.js
index 03b145f8..3529c4dc 100644
--- a/src/content/dependencies/generateAlbumCommentaryPage.js
+++ b/src/content/dependencies/generateAlbumCommentaryPage.js
@@ -266,7 +266,10 @@ export default {
                       }),
                   })),
 
-              cover?.slots({mode: 'commentary'}),
+              cover?.slots({
+                mode: 'commentary',
+                color: true,
+              }),
 
               trackDate &&
               trackDate !== data.date &&
diff --git a/src/content/dependencies/generateAlbumGalleryStatsLine.js b/src/content/dependencies/generateAlbumGalleryStatsLine.js
index 75bffb36..09d9a30b 100644
--- a/src/content/dependencies/generateAlbumGalleryStatsLine.js
+++ b/src/content/dependencies/generateAlbumGalleryStatsLine.js
@@ -3,36 +3,56 @@ import {getTotalDuration} from '#wiki-data';
 export default {
   extraDependencies: ['html', 'language'],
 
-  data(album) {
-    return {
-      name: album.name,
-      date: album.date,
-      duration: getTotalDuration(album.tracks),
-      numTracks: album.tracks.length,
-    };
-  },
-
-  generate(data, {html, language}) {
-    const parts = ['albumGalleryPage.statsLine'];
-    const options = {};
-
-    options.tracks =
-      html.tag('b',
-        language.countTracks(data.numTracks, {unit: true}));
-
-    options.duration =
-      html.tag('b',
-        language.formatDuration(data.duration, {unit: true}));
-
-    if (data.date) {
-      parts.push('withDate');
-      options.date =
-        html.tag('b',
-          language.formatDate(data.date));
-    }
-
-    return (
-      html.tag('p', {class: 'quick-info'},
-        language.formatString(...parts, options)));
-  },
+  data: (album) => ({
+    date:
+      album.date,
+
+    hideDuration:
+      album.hideDuration,
+
+    duration:
+      (album.hideDuration
+        ? null
+        : getTotalDuration(album.tracks)),
+
+    tracks:
+      (album.hideDuration
+        ? null
+        : album.tracks.length),
+  }),
+
+  generate: (data, {html, language}) =>
+    html.tag('p', {class: 'quick-info'},
+      {[html.onlyIfContent]: true},
+
+      language.encapsulate('albumGalleryPage.statsLine', workingCapsule => {
+        const workingOptions = {};
+
+        if (data.hideDuration && !data.date) {
+          return html.blank();
+        }
+
+        if (!data.hideDuration) {
+          workingOptions.tracks =
+            html.tag('b',
+              language.countTracks(data.tracks, {unit: true}));
+
+          workingOptions.duration =
+            html.tag('b',
+              language.formatDuration(data.duration, {unit: true}));
+        }
+
+        if (data.date) {
+          workingCapsule += '.withDate';
+          workingOptions.date =
+            html.tag('b',
+              language.formatDate(data.date));
+        }
+
+        if (data.hideDuration) {
+          workingCapsule += '.noDuration';
+        }
+
+        return language.$(workingCapsule, workingOptions);
+      })),
 };
diff --git a/src/content/dependencies/generateAlbumGalleryTrackGrid.js b/src/content/dependencies/generateAlbumGalleryTrackGrid.js
index fb5ed7ea..86c35b6f 100644
--- a/src/content/dependencies/generateAlbumGalleryTrackGrid.js
+++ b/src/content/dependencies/generateAlbumGalleryTrackGrid.js
@@ -77,6 +77,9 @@ export default {
           ? artwork.artistContribs
               .map(contrib => contrib.artist.name)
           : null)),
+
+    allWarnings:
+      query.artworks.flatMap(artwork => artwork?.contentWarnings),
   }),
 
   slots: {
@@ -117,6 +120,9 @@ export default {
                 artists:
                   language.formatUnitList(artists),
               })),
+
+          revealAllWarnings:
+            data.allWarnings,
         }),
       ]),
 };
diff --git a/src/content/dependencies/generateAlbumInfoPage.js b/src/content/dependencies/generateAlbumInfoPage.js
index 9a4ccfd2..1c5be6e6 100644
--- a/src/content/dependencies/generateAlbumInfoPage.js
+++ b/src/content/dependencies/generateAlbumInfoPage.js
@@ -13,9 +13,12 @@ export default {
     'generateAlbumSocialEmbed',
     'generateAlbumStyleTags',
     'generateAlbumTrackList',
+    'generateCommentaryContentHeading',
     'generateCommentaryEntry',
+    'generateContentContentHeading',
     'generateContentHeading',
     'generatePageLayout',
+    'generateReadCommentaryLine',
     'linkAlbumCommentary',
     'linkAlbumGallery',
   ],
@@ -55,6 +58,9 @@ export default {
     contentHeading:
       relation('generateContentHeading'),
 
+    contentContentHeading:
+      relation('generateContentContentHeading', album),
+
     releaseInfo:
       relation('generateAlbumReleaseInfo', album),
 
@@ -64,16 +70,22 @@ export default {
         : null),
 
     commentaryLink:
-      ([album, ...album.tracks].some(({commentary}) => !empty(commentary))
+      (album.tracks.some(track => !empty(track.commentary))
         ? relation('linkAlbumCommentary', album)
         : null),
 
+    readCommentaryLine:
+      relation('generateReadCommentaryLine', album),
+
     trackList:
       relation('generateAlbumTrackList', album),
 
     additionalFilesList:
       relation('generateAdditionalFilesList', album.additionalFiles),
 
+    commentaryContentHeading:
+      relation('generateCommentaryContentHeading', album),
+
     artistCommentaryEntries:
       album.commentary
         .map(entry => relation('generateCommentaryEntry', entry)),
@@ -156,6 +168,10 @@ export default {
 
                 : html.blank()),
 
+              !relations.commentaryLink &&
+              !html.isBlank(relations.artistCommentaryEntries) &&
+                relations.readCommentaryLine,
+
               !html.isBlank(relations.creditSourceEntries) &&
                 language.encapsulate(capsule, 'readCreditingSources', capsule =>
                   language.$(capsule, {
@@ -170,14 +186,16 @@ export default {
 
           html.tag('p',
             {[html.onlyIfContent]: true},
-            {[html.joinChildren]: html.tag('br')},
 
-            language.encapsulate('releaseInfo', capsule => [
-              language.$(capsule, 'addedToWiki', {
-                [language.onlyIfOptions]: ['date'],
-                date: language.formatDate(data.dateAddedToWiki),
-              }),
-            ])),
+            language.$('releaseInfo.addedToWiki', {
+              [language.onlyIfOptions]: ['date'],
+              date: language.formatDate(data.dateAddedToWiki),
+            })),
+
+          (!html.isBlank(relations.artistCommentaryEntries) ||
+           !html.isBlank(relations.creditSourceEntries))
+          &&
+            html.tag('hr', {class: 'main-separator'}),
 
           language.encapsulate('releaseInfo.additionalFiles', capsule =>
             html.tags([
@@ -191,20 +209,15 @@ export default {
             ])),
 
           html.tags([
-            relations.contentHeading.clone()
-              .slots({
-                attributes: {id: 'artist-commentary'},
-                title: language.$('misc.artistCommentary'),
-              }),
-
+            relations.commentaryContentHeading,
             relations.artistCommentaryEntries,
           ]),
 
           html.tags([
-            relations.contentHeading.clone()
+            relations.contentContentHeading.clone()
               .slots({
                 attributes: {id: 'crediting-sources'},
-                title: language.$('misc.creditingSources'),
+                string: 'misc.creditingSources',
               }),
 
             relations.creditSourceEntries,
diff --git a/src/content/dependencies/generateAlbumNavAccent.js b/src/content/dependencies/generateAlbumNavAccent.js
index 432c5f3d..00aec94a 100644
--- a/src/content/dependencies/generateAlbumNavAccent.js
+++ b/src/content/dependencies/generateAlbumNavAccent.js
@@ -64,9 +64,8 @@ export default {
     hasMultipleTracks:
       album.tracks.length > 1,
 
-    commentaryPageIsStub:
-      [album, ...album.tracks]
-        .every(({commentary}) => empty(commentary)),
+    hasSubstantialCommentaryPage:
+      album.tracks.some(track => !empty(track.commentary)),
 
     galleryIsStub:
       album.tracks.every(t => !t.hasUniqueCoverArt),
@@ -97,14 +96,16 @@ export default {
         relations.nextLink.slot('link', relations.nextTrackLink);
 
     const galleryLink =
-      (!data.galleryIsStub || slots.currentExtra === 'gallery') &&
+      (!data.galleryIsStub ||
+       slots.currentExtra === 'gallery') &&
         relations.albumGalleryLink.slots({
           attributes: {class: slots.currentExtra === 'gallery' && 'current'},
           content: language.$(albumNavCapsule, 'gallery'),
         });
 
     const commentaryLink =
-      (!data.commentaryPageIsStub || slots.currentExtra === 'commentary') &&
+      (data.hasSubstantialCommentaryPage ||
+       slots.currentExtra === 'commentary') &&
         relations.albumCommentaryLink.slots({
           attributes: {class: slots.currentExtra === 'commentary' && 'current'},
           content: language.$(albumNavCapsule, 'commentary'),
diff --git a/src/content/dependencies/generateAlbumReleaseInfo.js b/src/content/dependencies/generateAlbumReleaseInfo.js
index 0abb412c..a156dfec 100644
--- a/src/content/dependencies/generateAlbumReleaseInfo.js
+++ b/src/content/dependencies/generateAlbumReleaseInfo.js
@@ -3,7 +3,7 @@ import {accumulateSum, empty} from '#sugar';
 export default {
   contentDependencies: [
     'generateReleaseInfoContributionsLine',
-    'linkExternal',
+    'generateReleaseInfoListenLine',
   ],
 
   extraDependencies: ['html', 'language'],
@@ -14,15 +14,8 @@ export default {
     relations.artistContributionsLine =
       relation('generateReleaseInfoContributionsLine', album.artistContribs);
 
-    relations.wallpaperArtistContributionsLine =
-      relation('generateReleaseInfoContributionsLine', album.wallpaperArtistContribs);
-
-    relations.bannerArtistContributionsLine =
-      relation('generateReleaseInfoContributionsLine', album.bannerArtistContribs);
-
-    relations.externalLinks =
-      album.urls.map(url =>
-        relation('linkExternal', url));
+    relations.listenLine =
+      relation('generateReleaseInfoListenLine', album);
 
     return relations;
   },
@@ -43,7 +36,7 @@ export default {
         .map(track => track.duration)
         .filter(value => value > 0);
 
-    if (empty(durationTerms)) {
+    if (empty(durationTerms) || album.hideDuration) {
       data.duration = null;
       data.durationApproximate = null;
     } else {
@@ -87,21 +80,16 @@ export default {
         html.tag('p',
           {[html.onlyIfContent]: true},
 
-          language.$(capsule, 'listenOn', {
-            [language.onlyIfOptions]: ['links'],
-
-            links:
-              language.formatDisjunctionList(
-                relations.externalLinks
-                  .map(link =>
-                    link.slot('context', [
-                      'album',
-                      (data.numTracks === 0
-                        ? 'albumNoTracks'
-                     : data.numTracks === 1
-                        ? 'albumOneTrack'
-                        : 'albumMultipleTracks'),
-                    ]))),
+          relations.listenLine.slots({
+            context: [
+              'album',
+
+              (data.numTracks === 0
+                ? 'albumNoTracks'
+             : data.numTracks === 1
+                ? 'albumOneTrack'
+                : 'albumMultipleTracks'),
+            ],
           })),
       ])),
 };
diff --git a/src/content/dependencies/generateAlbumSidebar.js b/src/content/dependencies/generateAlbumSidebar.js
index 7cf689cc..29d434cd 100644
--- a/src/content/dependencies/generateAlbumSidebar.js
+++ b/src/content/dependencies/generateAlbumSidebar.js
@@ -108,39 +108,65 @@ export default {
         : null),
   }),
 
-  data: (_query, _sprawl, _album, track) => ({
+  data: (_query, _sprawl, album, track) => ({
     isAlbumPage: !track,
     isTrackPage: !!track,
+
+    albumStyle: album.style,
   }),
 
   generate(data, relations, {html}) {
+    const presentGroupsLikeAlbum =
+      data.isAlbumPage ||
+      data.albumStyle === 'single';
+
     for (const box of [
       ...relations.groupBoxes,
       ...relations.seriesBoxes.flat(),
       ...relations.disconnectedSeriesBoxes,
     ]) {
-      box.setSlot('mode',
-        data.isAlbumPage ? 'album' : 'track');
+      box.setSlot('mode', presentGroupsLikeAlbum ? 'album' : 'track');
     }
 
+    const groupBoxes =
+      (presentGroupsLikeAlbum
+        ? [
+            relations.disconnectedSeriesBoxes,
+
+            stitchArrays({
+              groupBox: relations.groupBoxes,
+              seriesBoxes: relations.seriesBoxes,
+            }).map(({groupBox, seriesBoxes}) => [
+                groupBox,
+                seriesBoxes.map(seriesBox => [
+                  html.tag('div',
+                    {class: 'sidebar-box-joiner'},
+                    {class: 'collapsible'}),
+                  seriesBox,
+                ]),
+              ]),
+          ]
+        : [
+            relations.conjoinedBox.slots({
+              attributes: {class: 'conjoined-group-sidebar-box'},
+              boxes:
+                ([relations.disconnectedSeriesBoxes,
+                  stitchArrays({
+                    groupBox: relations.groupBoxes,
+                    seriesBoxes: relations.seriesBoxes,
+                  }).flatMap(({groupBox, seriesBoxes}) => [
+                      groupBox,
+                      ...seriesBoxes,
+                    ]),
+                ]).flat()
+                  .map(box => box.content), /* TODO: Kludge. */
+            })
+          ]);
+
     return relations.sidebar.slots({
       boxes: [
-        data.isAlbumPage && [
-          relations.disconnectedSeriesBoxes,
-
-          stitchArrays({
-            groupBox: relations.groupBoxes,
-            seriesBoxes: relations.seriesBoxes,
-          }).map(({groupBox, seriesBoxes}) => [
-              groupBox,
-              seriesBoxes.map(seriesBox => [
-                html.tag('div',
-                  {class: 'sidebar-box-joiner'},
-                  {class: 'collapsible'}),
-                seriesBox,
-              ]),
-            ]),
-        ],
+        data.isAlbumPage &&
+          groupBoxes,
 
         data.isTrackPage &&
           relations.earlierTrackReleaseBoxes,
@@ -151,20 +177,7 @@ export default {
           relations.laterTrackReleaseBoxes,
 
         data.isTrackPage &&
-          relations.conjoinedBox.slots({
-            attributes: {class: 'conjoined-group-sidebar-box'},
-            boxes:
-              ([relations.disconnectedSeriesBoxes,
-                stitchArrays({
-                  groupBox: relations.groupBoxes,
-                  seriesBoxes: relations.seriesBoxes,
-                }).flatMap(({groupBox, seriesBoxes}) => [
-                    groupBox,
-                    ...seriesBoxes,
-                  ]),
-              ]).flat()
-                .map(box => box.content), /* TODO: Kludge. */
-          }),
+          groupBoxes,
       ],
     });
   },
diff --git a/src/content/dependencies/generateAlbumSidebarTrackListBox.js b/src/content/dependencies/generateAlbumSidebarTrackListBox.js
index 3a244e3a..218e07ab 100644
--- a/src/content/dependencies/generateAlbumSidebarTrackListBox.js
+++ b/src/content/dependencies/generateAlbumSidebarTrackListBox.js
@@ -24,7 +24,9 @@ export default {
       attributes: {class: 'track-list-sidebar-box'},
 
       content: [
-        html.tag('h1', relations.albumLink),
+        html.tag('h1', {[html.onlyIfSiblings]: true},
+          relations.albumLink),
+
         relations.trackSections,
       ],
     })
diff --git a/src/content/dependencies/generateAlbumSidebarTrackSection.js b/src/content/dependencies/generateAlbumSidebarTrackSection.js
index dae5fa03..a158d2d4 100644
--- a/src/content/dependencies/generateAlbumSidebarTrackSection.js
+++ b/src/content/dependencies/generateAlbumSidebarTrackSection.js
@@ -22,10 +22,12 @@ export default {
       !empty(trackSection.tracks);
 
     data.isTrackPage = !!track;
+    data.albumStyle = album.style;
 
     data.name = trackSection.name;
     data.color = trackSection.color;
     data.isDefaultTrackSection = trackSection.isDefaultTrackSection;
+    data.hasSiblingSections = album.trackSections.length > 1;
 
     data.firstTrackNumber =
       (data.hasTrackNumbers
@@ -115,6 +117,21 @@ export default {
                   : trackLink),
             })));
 
+    const list =
+      (data.hasTrackNumbers
+        ? html.tag('ol',
+            {start: data.firstTrackNumber},
+            trackListItems)
+        : html.tag('ul', trackListItems));
+
+    if (data.albumStyle === 'single' && !data.hasSiblingSections) {
+      if (trackListItems.length <= 1) {
+        return html.blank();
+      } else {
+        return list;
+      }
+    }
+
     return html.tag('details',
       data.includesCurrentTrack &&
         {class: 'current'},
@@ -157,11 +174,7 @@ export default {
                 return language.$(workingCapsule, workingOptions);
               })))),
 
-        (data.hasTrackNumbers
-          ? html.tag('ol',
-              {start: data.firstTrackNumber},
-              trackListItems)
-          : html.tag('ul', trackListItems)),
+        list,
       ]);
   },
 };
diff --git a/src/content/dependencies/generateAlbumTrackListItem.js b/src/content/dependencies/generateAlbumTrackListItem.js
index 44297c15..201ca53a 100644
--- a/src/content/dependencies/generateAlbumTrackListItem.js
+++ b/src/content/dependencies/generateAlbumTrackListItem.js
@@ -20,7 +20,7 @@ export default {
     item:
       relation('generateTrackListItem',
         track,
-        track.album.artistContribs),
+        track.album.trackArtistContribs),
   }),
 
   data: (query, track, album) => ({
diff --git a/src/content/dependencies/generateArtistCredit.js b/src/content/dependencies/generateArtistCredit.js
index bab32f7d..2d611ca6 100644
--- a/src/content/dependencies/generateArtistCredit.js
+++ b/src/content/dependencies/generateArtistCredit.js
@@ -162,33 +162,42 @@ export default {
       (slots.showAnnotation && data.normalContributionAnnotationsDifferFromContext) ||
       (data.normalContributionArtistsDifferFromContext);
 
+    let content;
+
     if (empty(relations.featuringContributionLinks)) {
       if (effectivelyDiffers) {
-        return language.$(slots.normalStringKey, {
-          ...slots.additionalStringOptions,
-          artists: artistsList,
-        });
+        content =
+          language.$(slots.normalStringKey, {
+            ...slots.additionalStringOptions,
+            artists: artistsList,
+          });
       } else {
         return html.blank();
       }
-    }
-
-    if (effectivelyDiffers && slots.normalFeaturingStringKey) {
-      return language.$(slots.normalFeaturingStringKey, {
-        ...slots.additionalStringOptions,
-        artists: artistsList,
-        featuring: featuringList,
+    } else if (effectivelyDiffers && slots.normalFeaturingStringKey) {
+      content =
+        language.$(slots.normalFeaturingStringKey, {
+          ...slots.additionalStringOptions,
+          artists: artistsList,
+          featuring: featuringList,
       });
     } else if (slots.featuringStringKey) {
-      return language.$(slots.featuringStringKey, {
-        ...slots.additionalStringOptions,
-        artists: featuringList,
-      });
+      content =
+        language.$(slots.featuringStringKey, {
+          ...slots.additionalStringOptions,
+          artists: featuringList,
+        });
     } else {
-      return language.$(slots.normalStringKey, {
-        ...slots.additionalStringOptions,
-        artists: everyoneList,
-      });
+      content =
+        language.$(slots.normalStringKey, {
+          ...slots.additionalStringOptions,
+          artists: everyoneList,
+        });
     }
+
+    // TODO: This is obviously evil.
+    return (
+      html.metatag('chunkwrap', {split: /,| (?=and)/},
+        html.resolve(content)));
   },
 };
diff --git a/src/content/dependencies/generateArtistCreditWikiEditsPart.js b/src/content/dependencies/generateArtistCreditWikiEditsPart.js
index 70296e39..1b9930ee 100644
--- a/src/content/dependencies/generateArtistCreditWikiEditsPart.js
+++ b/src/content/dependencies/generateArtistCreditWikiEditsPart.js
@@ -48,6 +48,7 @@ export default {
                         showAnnotation: slots.showAnnotation,
                         trimAnnotation: true,
                         preventTooltip: true,
+                        preventWrapping: true,
                       }))),
                 }),
           }),
diff --git a/src/content/dependencies/generateArtistGalleryPage.js b/src/content/dependencies/generateArtistGalleryPage.js
index 6a24275e..094edc0c 100644
--- a/src/content/dependencies/generateArtistGalleryPage.js
+++ b/src/content/dependencies/generateArtistGalleryPage.js
@@ -58,6 +58,10 @@ export default {
         .map(artwork => artwork.artistContribs
           .filter(contrib => contrib.artist !== artist)
           .map(contrib => contrib.artist.name)),
+
+    allWarnings:
+      query.artworks
+        .flatMap(artwork => artwork.contentWarnings),
   }),
 
   generate: (data, relations, {html, language}) =>
@@ -93,6 +97,8 @@ export default {
 
                     artists: language.formatUnitList(names),
                   })),
+
+              revealAllWarnings: data.allWarnings,
             }),
         ],
 
diff --git a/src/content/dependencies/generateArtistGroupContributionsInfo.js b/src/content/dependencies/generateArtistGroupContributionsInfo.js
index 3e0cd1d2..e1fa7a0b 100644
--- a/src/content/dependencies/generateArtistGroupContributionsInfo.js
+++ b/src/content/dependencies/generateArtistGroupContributionsInfo.js
@@ -1,83 +1,90 @@
-import {empty, filterProperties, stitchArrays, unique} from '#sugar';
+import {accumulateSum, empty, stitchArrays, withEntries} from '#sugar';
 
 export default {
   contentDependencies: ['linkGroup'],
   extraDependencies: ['html', 'language', 'wikiData'],
 
-  sprawl({groupCategoryData}) {
-    return {
-      groupOrder: groupCategoryData.flatMap(category => category.groups),
-    }
-  },
+  sprawl: ({groupCategoryData}) => ({
+    groupOrder:
+      groupCategoryData.flatMap(category => category.groups),
+  }),
 
-  query(sprawl, tracksAndAlbums) {
-    const filteredAlbums = tracksAndAlbums.filter(thing => !thing.album);
-    const filteredTracks = tracksAndAlbums.filter(thing => thing.album);
+  query(sprawl, contributions) {
+    const allGroupsUnordered =
+      new Set(contributions.flatMap(contrib => contrib.groups));
 
-    const allAlbums = unique([
-      ...filteredAlbums,
-      ...filteredTracks.map(track => track.album),
-    ]);
+    const allGroupsOrdered =
+      sprawl.groupOrder.filter(group => allGroupsUnordered.has(group));
 
-    const allGroupsUnordered = new Set(Array.from(allAlbums).flatMap(album => album.groups));
-    const allGroupsOrdered = sprawl.groupOrder.filter(group => allGroupsUnordered.has(group));
+    const groupToThingsCountedForContributions =
+      new Map(allGroupsOrdered.map(group => [group, new Set]));
 
-    const mapTemplate = allGroupsOrdered.map(group => [group, 0]);
-    const groupToCountMap = new Map(mapTemplate);
-    const groupToDurationMap = new Map(mapTemplate);
-    const groupToDurationCountMap = new Map(mapTemplate);
+    const groupToThingsCountedForDuration =
+      new Map(allGroupsOrdered.map(group => [group, new Set]));
 
-    for (const album of filteredAlbums) {
-      for (const group of album.groups) {
-        groupToCountMap.set(group, groupToCountMap.get(group) + 1);
-      }
-    }
+    for (const contrib of contributions) {
+      for (const group of contrib.groups) {
+        if (contrib.countInContributionTotals) {
+          groupToThingsCountedForContributions.get(group).add(contrib.thing);
+        }
 
-    for (const track of filteredTracks) {
-      for (const group of track.album.groups) {
-        groupToCountMap.set(group, groupToCountMap.get(group) + 1);
-        if (track.duration && track.mainReleaseTrack === null) {
-          groupToDurationMap.set(group, groupToDurationMap.get(group) + track.duration);
-          groupToDurationCountMap.set(group, groupToDurationCountMap.get(group) + 1);
+        if (contrib.countInDurationTotals) {
+          groupToThingsCountedForDuration.get(group).add(contrib.thing);
         }
       }
     }
 
+    const groupToTotalContributions =
+      withEntries(
+        groupToThingsCountedForContributions,
+        entries => entries.map(
+          ([group, things]) =>
+          ([group, things.size])));
+
+    const groupToTotalDuration =
+      withEntries(
+        groupToThingsCountedForDuration,
+        entries => entries.map(
+          ([group, things]) =>
+          ([group, accumulateSum(things, thing => thing.duration)])))
+
     const groupsSortedByCount =
       allGroupsOrdered
-        .slice()
-        .sort((a, b) => groupToCountMap.get(b) - groupToCountMap.get(a));
+        .filter(group => groupToTotalContributions.get(group) > 0)
+        .sort((a, b) =>
+          (groupToTotalContributions.get(b)
+         - groupToTotalContributions.get(a)));
 
-    // The filter here ensures all displayed groups have at least some duration
-    // when sorting by duration.
     const groupsSortedByDuration =
       allGroupsOrdered
-        .filter(group => groupToDurationMap.get(group) > 0)
-        .sort((a, b) => groupToDurationMap.get(b) - groupToDurationMap.get(a));
+        .filter(group => groupToTotalDuration.get(group) > 0)
+        .sort((a, b) =>
+          (groupToTotalDuration.get(b)
+         - groupToTotalDuration.get(a)));
 
     const groupCountsSortedByCount =
       groupsSortedByCount
-        .map(group => groupToCountMap.get(group));
+        .map(group => groupToTotalContributions.get(group));
 
     const groupDurationsSortedByCount =
       groupsSortedByCount
-        .map(group => groupToDurationMap.get(group));
+        .map(group => groupToTotalDuration.get(group));
 
     const groupDurationsApproximateSortedByCount =
       groupsSortedByCount
-        .map(group => groupToDurationCountMap.get(group) > 1);
+        .map(group => groupToThingsCountedForDuration.get(group).size > 1);
 
     const groupCountsSortedByDuration =
       groupsSortedByDuration
-        .map(group => groupToCountMap.get(group));
+        .map(group => groupToTotalContributions.get(group));
 
     const groupDurationsSortedByDuration =
       groupsSortedByDuration
-        .map(group => groupToDurationMap.get(group));
+        .map(group => groupToTotalDuration.get(group));
 
     const groupDurationsApproximateSortedByDuration =
       groupsSortedByDuration
-        .map(group => groupToDurationCountMap.get(group) > 1);
+        .map(group => groupToThingsCountedForDuration.get(group).size > 1);
 
     return {
       groupsSortedByCount,
@@ -93,29 +100,35 @@ export default {
     };
   },
 
-  relations(relation, query) {
-    return {
-      groupLinksSortedByCount:
-        query.groupsSortedByCount
-          .map(group => relation('linkGroup', group)),
+  relations: (relation, query) => ({
+    groupLinksSortedByCount:
+      query.groupsSortedByCount
+        .map(group => relation('linkGroup', group)),
 
-      groupLinksSortedByDuration:
-        query.groupsSortedByDuration
-          .map(group => relation('linkGroup', group)),
-    };
-  },
+    groupLinksSortedByDuration:
+      query.groupsSortedByDuration
+        .map(group => relation('linkGroup', group)),
+  }),
 
-  data(query) {
-    return filterProperties(query, [
-      'groupCountsSortedByCount',
-      'groupDurationsSortedByCount',
-      'groupDurationsApproximateSortedByCount',
+  data: (query) => ({
+    groupCountsSortedByCount:
+      query.groupCountsSortedByCount,
 
-      'groupCountsSortedByDuration',
-      'groupDurationsSortedByDuration',
-      'groupDurationsApproximateSortedByDuration',
-    ]);
-  },
+    groupDurationsSortedByCount:
+      query.groupDurationsSortedByCount,
+
+    groupDurationsApproximateSortedByCount:
+      query.groupDurationsApproximateSortedByCount,
+
+    groupCountsSortedByDuration:
+      query.groupCountsSortedByDuration,
+
+    groupDurationsSortedByDuration:
+      query.groupDurationsSortedByDuration,
+
+    groupDurationsApproximateSortedByDuration:
+      query.groupDurationsApproximateSortedByDuration,
+  }),
 
   slots: {
     title: {
diff --git a/src/content/dependencies/generateArtistInfoPage.js b/src/content/dependencies/generateArtistInfoPage.js
index 3a3cf8b7..1f738de4 100644
--- a/src/content/dependencies/generateArtistInfoPage.js
+++ b/src/content/dependencies/generateArtistInfoPage.js
@@ -20,29 +20,17 @@ export default {
   extraDependencies: ['html', 'language'],
 
   query: (artist) => ({
-    // Even if an artist has served as both "artist" (compositional) and
-    // "contributor" (instruments, production, etc) on the same track, that
-    // track only counts as one unique contribution in the list.
-    allTracks:
-      unique(
-        ([
-          artist.trackArtistContributions,
-          artist.trackContributorContributions,
-        ]).flat()
-          .map(({thing}) => thing)),
-
-    // Artworks are different, though. We intentionally duplicate album data
-    // objects when the artist has contributed some combination of cover art,
-    // wallpaper, and banner - these each count as a unique contribution.
-    allArtworkThings:
-      ([
-        artist.albumCoverArtistContributions,
-        artist.albumWallpaperArtistContributions,
-        artist.albumBannerArtistContributions,
-        artist.trackCoverArtistContributions,
-      ]).flat()
-        .filter(({annotation}) => !annotation?.startsWith('edits for wiki'))
-        .map(({thing}) => thing.thing),
+    trackContributions: [
+      ...artist.trackArtistContributions,
+      ...artist.trackContributorContributions,
+    ],
+
+    artworkContributions: [
+      ...artist.albumCoverArtistContributions,
+      ...artist.albumWallpaperArtistContributions,
+      ...artist.albumBannerArtistContributions,
+      ...artist.trackCoverArtistContributions,
+    ],
 
     // Banners and wallpapers don't show up in the artist gallery page, only
     // cover art.
@@ -93,7 +81,7 @@ export default {
       relation('generateArtistInfoPageTracksChunkedList', artist),
 
     tracksGroupInfo:
-      relation('generateArtistGroupContributionsInfo', query.allTracks),
+      relation('generateArtistGroupContributionsInfo', query.trackContributions),
 
     artworksChunkedList:
       relation('generateArtistInfoPageArtworksChunkedList', artist, false),
@@ -102,7 +90,7 @@ export default {
       relation('generateArtistInfoPageArtworksChunkedList', artist, true),
 
     artworksGroupInfo:
-      relation('generateArtistGroupContributionsInfo', query.allArtworkThings),
+      relation('generateArtistGroupContributionsInfo', query.artworkContributions),
 
     artistGalleryLink:
       (query.hasGallery
@@ -128,7 +116,11 @@ export default {
         .map(({annotation}) => annotation),
 
     totalTrackCount:
-      query.allTracks.length,
+      unique(
+        query.trackContributions
+          .filter(contrib => contrib.countInContributionTotals)
+          .map(contrib => contrib.thing))
+        .length,
 
     totalDuration:
       artist.totalDuration,
diff --git a/src/content/dependencies/generateArtistInfoPageArtworksChunkItem.js b/src/content/dependencies/generateArtistInfoPageArtworksChunkItem.js
index cb436b0f..98d9ce7a 100644
--- a/src/content/dependencies/generateArtistInfoPageArtworksChunkItem.js
+++ b/src/content/dependencies/generateArtistInfoPageArtworksChunkItem.js
@@ -12,11 +12,15 @@ export default {
 
   query: (contrib) => ({
     kind:
-      (contrib.isBannerArtistContribution
+      (contrib.thingProperty === 'bannerArtistContribs' ||
+       (contrib.thing.isArtwork &&
+        contrib.thing.thingProperty === 'bannerArtwork')
         ? 'banner'
-     : contrib.isWallpaperArtistContribution
+     : contrib.thingProperty === 'wallpaperArtistContribs' ||
+       (contrib.thing.isArtwork &&
+        contrib.thing.thingProperty === 'wallpaperArtwork')
         ? 'wallpaper'
-     : contrib.isForAlbum
+     : contrib.thing.isAlbum
         ? 'album-cover'
         : 'track-cover'),
   }),
diff --git a/src/content/dependencies/generateArtistInfoPageFirstReleaseTooltip.js b/src/content/dependencies/generateArtistInfoPageFirstReleaseTooltip.js
index f86dead7..31a223f5 100644
--- a/src/content/dependencies/generateArtistInfoPageFirstReleaseTooltip.js
+++ b/src/content/dependencies/generateArtistInfoPageFirstReleaseTooltip.js
@@ -1,4 +1,4 @@
-import {sortChronologically} from '#sort';
+import {sortAlbumsTracksChronologically} from '#sort';
 import {stitchArrays} from '#sugar';
 
 export default {
@@ -12,7 +12,7 @@ export default {
 
   query: (track) => ({
     rereleases:
-      sortChronologically(track.allReleases).slice(1),
+      sortAlbumsTracksChronologically(track.allReleases).slice(1),
   }),
 
   relations: (relation, query, track, artist) => ({
diff --git a/src/content/dependencies/generateArtistInfoPageRereleaseTooltip.js b/src/content/dependencies/generateArtistInfoPageRereleaseTooltip.js
index 1d849919..853edcb7 100644
--- a/src/content/dependencies/generateArtistInfoPageRereleaseTooltip.js
+++ b/src/content/dependencies/generateArtistInfoPageRereleaseTooltip.js
@@ -1,4 +1,4 @@
-import {sortChronologically} from '#sort';
+import {sortAlbumsTracksChronologically} from '#sort';
 
 export default {
   contentDependencies: [
@@ -11,7 +11,7 @@ export default {
 
   query: (track) => ({
     firstRelease:
-      sortChronologically(track.allReleases)[0],
+      sortAlbumsTracksChronologically(track.allReleases)[0],
   }),
 
   relations: (relation, query, track, artist) => ({
diff --git a/src/content/dependencies/generateArtistInfoPageTracksChunkItem.js b/src/content/dependencies/generateArtistInfoPageTracksChunkItem.js
index a42d6fee..877b2fe9 100644
--- a/src/content/dependencies/generateArtistInfoPageTracksChunkItem.js
+++ b/src/content/dependencies/generateArtistInfoPageTracksChunkItem.js
@@ -1,4 +1,4 @@
-import {sortChronologically} from '#sort';
+import {sortAlbumsTracksChronologically} from '#sort';
 import {empty} from '#sugar';
 
 export default {
@@ -22,11 +22,11 @@ export default {
 
     const creditedAsArtist =
       contribs
-        .some(contrib => contrib.isArtistContribution);
+        .some(contrib => contrib.thingProperty === 'artistContribs');
 
     const creditedAsContributor =
       contribs
-        .some(contrib => contrib.isContributorContribution);
+        .some(contrib => contrib.thingProperty === 'contributorContribs');
 
     const annotatedContribs =
       contribs
@@ -34,11 +34,11 @@ export default {
 
     const annotatedArtistContribs =
       annotatedContribs
-        .filter(contrib => contrib.isArtistContribution);
+        .filter(contrib => contrib.thingProperty === 'artistContribs');
 
     const annotatedContributorContribs =
       annotatedContribs
-        .filter(contrib => contrib.isContributorContribution);
+        .filter(contrib => contrib.thingProperty === 'contributorContribs');
 
     // Don't display annotations associated with crediting in the
     // Contributors field if the artist is also credited as an Artist
@@ -73,7 +73,7 @@ export default {
     // different - and it's the latter that determines whether the
     // track is a rerelease!
     const allReleasesChronologically =
-      sortChronologically(query.track.allReleases);
+      sortAlbumsTracksChronologically(query.track.allReleases);
 
     query.isFirstRelease =
       allReleasesChronologically[0] === query.track;
diff --git a/src/content/dependencies/generateArtistNavLinks.js b/src/content/dependencies/generateArtistNavLinks.js
index 1b4b6eca..1a520e84 100644
--- a/src/content/dependencies/generateArtistNavLinks.js
+++ b/src/content/dependencies/generateArtistNavLinks.js
@@ -5,6 +5,7 @@ export default {
     'generateInterpageDotSwitcher',
     'linkArtist',
     'linkArtistGallery',
+    'linkArtistRollingWindow',
   ],
 
   extraDependencies: ['html', 'language', 'wikiData'],
@@ -34,6 +35,9 @@ export default {
       (query.hasGallery
         ? relation('linkArtistGallery', artist)
         : null),
+
+    artistRollingWindowLink:
+      relation('linkArtistRollingWindow', artist),
   }),
 
   data: (_query, sprawl) => ({
@@ -45,7 +49,7 @@ export default {
     showExtraLinks: {type: 'boolean', default: false},
 
     currentExtra: {
-      validate: v => v.is('gallery'),
+      validate: v => v.is('gallery', 'rolling-window'),
     },
   },
 
@@ -79,6 +83,7 @@ export default {
             }),
 
             slots.showExtraLinks &&
+            slots.currentExtra !== 'rolling-window' &&
               relations.artistGalleryLink?.slots({
                 attributes: [
                   slots.currentExtra === 'gallery' &&
@@ -87,6 +92,12 @@ export default {
 
                 content: language.$('misc.nav.gallery'),
               }),
+
+            slots.currentExtra === 'rolling-window' &&
+              relations.artistRollingWindowLink.slots({
+                attributes: {class: 'current'},
+                content: language.$('misc.nav.rollingWindow'),
+              }),
           ],
         }),
     },
diff --git a/src/content/dependencies/generateArtistRollingWindowPage.js b/src/content/dependencies/generateArtistRollingWindowPage.js
new file mode 100644
index 00000000..33b1501e
--- /dev/null
+++ b/src/content/dependencies/generateArtistRollingWindowPage.js
@@ -0,0 +1,428 @@
+import {sortAlbumsTracksChronologically} from '#sort';
+import Thing from '#thing';
+
+import {
+  chunkByConditions,
+  filterMultipleArrays,
+  empty,
+  sortMultipleArrays,
+  stitchArrays,
+  unique,
+} from '#sugar';
+
+export default {
+  contentDependencies: [
+    'image',
+    'generateArtistNavLinks',
+    'generateCoverGrid',
+    'generatePageLayout',
+    'linkAnythingMan',
+  ],
+
+  extraDependencies: ['html', 'language', 'wikiData'],
+
+  sprawl: ({groupCategoryData}) => ({
+    groupCategoryData,
+  }),
+
+  query(sprawl, artist) {
+    const query = {};
+
+    const musicContributions =
+      artist.musicContributions
+        .filter(contrib => contrib.date);
+
+    const artworkContributions =
+      artist.artworkContributions
+        .filter(contrib =>
+          contrib.date &&
+          contrib.thingProperty !== 'wallpaperArtistContribs' &&
+          contrib.thingProperty !== 'bannerArtistContribs');
+
+    const musicThings =
+      musicContributions
+        .map(contrib => contrib.thing);
+
+    const artworkThings =
+      artworkContributions
+        .map(contrib => contrib.thing.thing);
+
+    const musicContributionDates =
+      musicContributions
+        .map(contrib => contrib.date);
+
+    const artworkContributionDates =
+      artworkContributions
+        .map(contrib => contrib.date);
+
+    const musicContributionKinds =
+      musicContributions
+        .map(() => 'music');
+
+    const artworkContributionKinds =
+      artworkContributions
+        .map(() => 'artwork');
+
+    const allThings = [
+      ...artworkThings,
+      ...musicThings,
+    ];
+
+    const allContributionDates = [
+      ...artworkContributionDates,
+      ...musicContributionDates,
+    ];
+
+    const allContributionKinds = [
+      ...artworkContributionKinds,
+      ...musicContributionKinds,
+    ];
+
+    const sortedThings =
+      sortAlbumsTracksChronologically(allThings.slice(), {latestFirst: true});
+
+    sortMultipleArrays(
+      allThings,
+      allContributionDates,
+      allContributionKinds,
+      (thing1, thing2) =>
+        sortedThings.indexOf(thing1) -
+        sortedThings.indexOf(thing2));
+
+    const sourceIndices =
+      Array.from({length: allThings.length}, (_, i) => i);
+
+    const sourceChunks =
+      chunkByConditions(sourceIndices, [
+        (index1, index2) =>
+          allThings[index1] !==
+          allThings[index2],
+      ]);
+
+    const indicesTo = array => index => array[index];
+
+    query.things =
+      sourceChunks
+        .map(chunks => allThings[chunks[0]]);
+
+    query.thingGroups =
+      query.things.map(thing =>
+        (thing.constructor[Thing.referenceType] === 'album'
+          ? thing.groups
+       : thing.constructor[Thing.referenceType] === 'track'
+          ? thing.album.groups
+          : null));
+
+    query.thingContributionDates =
+      sourceChunks
+        .map(indices => indices
+          .map(indicesTo(allContributionDates)));
+
+    query.thingContributionKinds =
+      sourceChunks
+        .map(indices => indices
+          .map(indicesTo(allContributionKinds)));
+
+    // Matches the "kind" dropdown.
+    const kinds = ['artwork', 'music', 'flash'];
+
+    const allKinds =
+      unique(query.thingContributionKinds.flat(2));
+
+    query.kinds =
+      kinds
+        .filter(kind => allKinds.includes(kind));
+
+    query.firstKind =
+      query.kinds.at(0);
+
+    query.thingArtworks =
+      stitchArrays({
+        thing: query.things,
+        kinds: query.thingContributionKinds,
+      }).map(({thing, kinds}) =>
+          (kinds.includes('artwork')
+            ? (thing.coverArtworks ?? thing.trackArtworks ?? [])
+                .find(artwork => artwork.artistContribs
+                  .some(contrib => contrib.artist === artist))
+            : (thing.coverArtworks ?? thing.trackArtworks)?.[0] ??
+              thing.album?.coverArtworks[0] ??
+              null));
+
+    const allGroups =
+      unique(query.thingGroups.flat());
+
+    query.groupCategories =
+      sprawl.groupCategoryData.slice();
+
+    query.groupCategoryGroups =
+      sprawl.groupCategoryData
+        .map(category => category.groups
+          .filter(group => allGroups.includes(group)));
+
+    filterMultipleArrays(
+      query.groupCategories,
+      query.groupCategoryGroups,
+      (_category, groups) => !empty(groups));
+
+    const groupsMatchingFirstKind =
+      unique(
+        stitchArrays({
+          thing: query.things,
+          groups: query.thingGroups,
+          kinds: query.thingContributionKinds,
+        }).filter(({kinds}) => kinds.includes(query.firstKind))
+          .flatMap(({groups}) => groups));
+
+    query.firstGroup =
+      sprawl.groupCategoryData
+        .flatMap(category => category.groups)
+        .find(group => groupsMatchingFirstKind.includes(group));
+
+    query.firstGroupCategory =
+      query.firstGroup.category;
+
+    return query;
+  },
+
+  relations: (relation, query, sprawl, artist) => ({
+    layout:
+      relation('generatePageLayout'),
+
+    artistNavLinks:
+      relation('generateArtistNavLinks', artist),
+
+    sourceGrid:
+      relation('generateCoverGrid'),
+
+    sourceGridImages:
+      query.thingArtworks
+        .map(artwork => relation('image', artwork)),
+
+    sourceGridLinks:
+      query.things
+        .map(thing => relation('linkAnythingMan', thing)),
+  }),
+
+  data: (query, sprawl, artist) => ({
+    name:
+      artist.name,
+
+    categoryGroupDirectories:
+      query.groupCategoryGroups
+        .map(groups => groups
+          .map(group => group.directory)),
+
+    categoryGroupNames:
+      query.groupCategoryGroups
+        .map(groups => groups
+          .map(group => group.name)),
+
+    firstGroupCategoryIndex:
+      query.groupCategories
+        .indexOf(query.firstGroupCategory),
+
+    firstGroupIndex:
+      stitchArrays({
+        category: query.groupCategories,
+        groups: query.groupCategoryGroups,
+      }).find(({category}) => category === query.firstGroupCategory)
+        .groups
+          .indexOf(query.firstGroup),
+
+    kinds:
+      query.kinds,
+
+    sourceGridNames:
+      query.things
+        .map(thing => thing.name),
+
+    sourceGridGroupDirectories:
+      query.thingGroups
+        .map(groups => groups
+          .map(group => group.directory)),
+
+    sourceGridGroupNames:
+      query.thingGroups
+        .map(groups => groups
+          .map(group => group.name)),
+
+    sourceGridContributionKinds:
+      query.thingContributionKinds,
+
+    sourceGridContributionDates:
+      query.thingContributionDates,
+  }),
+
+  generate: (data, relations, {html, language}) =>
+    relations.layout.slots({
+      title:
+        language.$('artistRollingWindowPage.title', {
+          artist: data.name,
+        }),
+
+      mainClasses: ['top-index'],
+      mainContent: [
+        html.tag('p', {id: 'timeframe-configuration'},
+          language.$('artistRollingWindowPage.windowConfigurationLine', {
+            timeBefore:
+              language.$('artistRollingWindowPage.timeframe.months', {
+                input:
+                  html.tag('input', {id: 'timeframe-months-before'},
+                    {type: 'number'},
+                    {value: 3, min: 0}),
+              }),
+
+            timeAfter:
+              language.$('artistRollingWindowPage.timeframe.months', {
+                input:
+                  html.tag('input', {id: 'timeframe-months-after'},
+                    {type: 'number'},
+                    {value: 3, min: 1}),
+              }),
+
+            peek:
+              language.$('artistRollingWindowPage.timeframe.months', {
+                input:
+                  html.tag('input', {id: 'timeframe-months-peek'},
+                    {type: 'number'},
+                    {value: 1, min: 0}),
+              }),
+          })),
+
+        html.tag('p', {id: 'contribution-configuration'},
+          language.$('artistRollingWindowPage.contributionConfigurationLine', {
+            kind:
+              html.tag('select', {id: 'contribution-kind'},
+                data.kinds.map(kind =>
+                  html.tag('option', {value: kind},
+                    language.$('artistRollingWindowPage.contributionKind', kind)))),
+
+            group:
+              html.tag('select', {id: 'contribution-group'}, [
+                html.tag('option', {value: '-'},
+                  language.$('artistRollingWindowPage.contributionGroup.all')),
+
+                stitchArrays({
+                  names: data.categoryGroupNames,
+                  directories: data.categoryGroupDirectories,
+                }).map(({names, directories}, categoryIndex) => [
+                    html.tag('hr'),
+
+                    stitchArrays({name: names, directory: directories})
+                      .map(({name, directory}, groupIndex) =>
+                        html.tag('option', {value: directory},
+                          categoryIndex === data.firstGroupCategoryIndex &&
+                          groupIndex === data.firstGroupIndex &&
+                            {selected: true},
+
+                          language.$('artistRollingWindowPage.contributionGroup.group', {
+                            group: name,
+                          }))),
+                  ]),
+              ]),
+          })),
+
+        html.tag('p', {id: 'timeframe-selection-info'}, [
+          html.tag('span', {id: 'timeframe-selection-some'},
+            {style: 'display: none'},
+
+            language.$('artistRollingWindowPage.timeframeSelectionLine', {
+              contributions:
+                html.tag('b', {id: 'timeframe-selection-contribution-count'}),
+
+              timeframes:
+                html.tag('b', {id: 'timeframe-selection-timeframe-count'}),
+
+              firstDate:
+                html.tag('b', {id: 'timeframe-selection-first-date'}),
+
+              lastDate:
+                html.tag('b', {id: 'timeframe-selection-last-date'}),
+            })),
+
+          html.tag('span', {id: 'timeframe-selection-none'},
+            {style: 'display: none'},
+            language.$('artistRollingWindowPage.timeframeSelectionLine.none')),
+        ]),
+
+        html.tag('p', {id: 'timeframe-selection-control'},
+          {style: 'display: none'},
+
+          language.$('artistRollingWindowPage.timeframeSelectionControl', {
+            timeframes:
+              html.tag('select', {id: 'timeframe-selection-menu'}),
+
+            previous:
+              html.tag('a', {id: 'timeframe-selection-previous'},
+                {href: '#'},
+                language.$('artistRollingWindowPage.timeframeSelectionControl.previous')),
+
+            next:
+              html.tag('a', {id: 'timeframe-selection-next'},
+                {href: '#'},
+                language.$('artistRollingWindowPage.timeframeSelectionControl.next')),
+          })),
+
+        html.tag('div', {id: 'timeframe-source-area'}, [
+          html.tag('p', {id: 'timeframe-empty'},
+            {style: 'display: none'},
+            language.$('artistRollingWindowPage.emptyTimeframeLine')),
+
+          relations.sourceGrid.slots({
+            attributes: {style: 'display: none'},
+
+            lazy: true,
+
+            links:
+              relations.sourceGridLinks.map(link =>
+                link.slot('attributes', {target: '_blank'})),
+
+            names:
+              data.sourceGridNames,
+
+            images:
+              relations.sourceGridImages,
+
+            info:
+              stitchArrays({
+                contributionKinds: data.sourceGridContributionKinds,
+                contributionDates: data.sourceGridContributionDates,
+                groupDirectories: data.sourceGridGroupDirectories,
+                groupNames: data.sourceGridGroupNames,
+              }).map(({
+                  contributionKinds,
+                  contributionDates,
+                  groupDirectories,
+                  groupNames,
+                }) => [
+                  stitchArrays({
+                    directory: groupDirectories,
+                    name: groupNames,
+                  }).map(({directory, name}) =>
+                    html.tag('data', {class: 'contribution-group'},
+                      {value: directory},
+                      name)),
+
+                  stitchArrays({
+                    kind: contributionKinds,
+                    date: contributionDates,
+                  }).map(({kind, date}) =>
+                      html.tag('time', {class: `${kind}-contribution-date`},
+                        {datetime: date.toUTCString()},
+                        language.formatDate(date))),
+                ]),
+          }),
+        ]),
+      ],
+
+      navLinkStyle: 'hierarchical',
+      navLinks:
+        relations.artistNavLinks
+          .slots({
+            showExtraLinks: true,
+            currentExtra: 'rolling-window',
+          })
+          .content,
+    }),
+}
diff --git a/src/content/dependencies/generateCommentaryContentHeading.js b/src/content/dependencies/generateCommentaryContentHeading.js
new file mode 100644
index 00000000..92405010
--- /dev/null
+++ b/src/content/dependencies/generateCommentaryContentHeading.js
@@ -0,0 +1,33 @@
+export default {
+  contentDependencies: ['generateContentContentHeading'],
+  extraDependencies: ['language'],
+
+  relations: (relation, thing) => ({
+    contentContentHeading:
+      relation('generateContentContentHeading', thing),
+  }),
+
+  data: (thing) => ({
+    hasWikiEditorCommentary:
+      thing.commentary
+        .some(entry => entry.isWikiEditorCommentary),
+
+    onlyWikiEditorCommentary:
+      thing.commentary
+        .every(entry => entry.isWikiEditorCommentary),
+  }),
+
+  generate: (data, relations, {language}) =>
+    relations.contentContentHeading.slots({
+      // It's #artist-commentary for legacy reasons... Sorry...
+      attributes: {id: 'artist-commentary'},
+
+      string:
+        language.encapsulate('misc.artistCommentary', capsule =>
+          (data.onlyWikiEditorCommentary
+            ? language.encapsulate(capsule, 'onlyWikiCommentary')
+         : data.hasWikiEditorCommentary
+            ? language.encapsulate(capsule, 'withWikiCommentary')
+            : capsule)),
+    }),
+};
diff --git a/src/content/dependencies/generateContentContentHeading.js b/src/content/dependencies/generateContentContentHeading.js
new file mode 100644
index 00000000..314ef197
--- /dev/null
+++ b/src/content/dependencies/generateContentContentHeading.js
@@ -0,0 +1,39 @@
+export default {
+  contentDependencies: ['generateContentHeading'],
+  extraDependencies: ['html', 'language'],
+
+  relations: (relation, _thing) => ({
+    contentHeading:
+      relation('generateContentHeading'),
+  }),
+
+  data: (thing) => ({
+    name:
+      thing.name,
+  }),
+
+  slots: {
+    attributes: {
+      type: 'attributes',
+      mutable: false,
+    },
+
+    string: {
+      type: 'string',
+    },
+  },
+
+  generate: (data, relations, slots, {html, language}) =>
+    relations.contentHeading.slots({
+      attributes: slots.attributes,
+
+      title:
+        language.$(slots.string, {
+          thing:
+            html.tag('i', data.name),
+        }),
+
+      stickyTitle:
+        language.$(slots.string, 'sticky'),
+    }),
+};
diff --git a/src/content/dependencies/generateContributionTooltip.js b/src/content/dependencies/generateContributionTooltip.js
index 3a31014d..1eba7273 100644
--- a/src/content/dependencies/generateContributionTooltip.js
+++ b/src/content/dependencies/generateContributionTooltip.js
@@ -1,3 +1,36 @@
+function compareReleaseContributions(a, b) {
+  if (a === b) {
+    return true;
+  }
+
+  const {previous: aPrev, next: aNext} = getSiblings(a);
+  const {previous: bPrev, next: bNext} = getSiblings(b);
+
+  const effective = contrib =>
+    (contrib?.thing.isAlbum && contrib.thing.style === 'single'
+      ? contrib.thing.tracks[0]
+      : contrib?.thing);
+
+  return (
+    effective(aPrev) === effective(bPrev) &&
+    effective(aNext) === effective(bNext)
+  );
+}
+
+function getSiblings(contribution) {
+  let previous = contribution;
+  while (previous && previous.thing === contribution.thing) {
+    previous = previous.previousBySameArtist;
+  }
+
+  let next = contribution;
+  while (next && next.thing === contribution.thing) {
+    next = next.nextBySameArtist;
+  }
+
+  return {previous, next};
+}
+
 export default {
   contentDependencies: [
     'generateContributionTooltipChronologySection',
@@ -5,17 +38,50 @@ export default {
     'generateTooltip',
   ],
 
-  extraDependencies: ['html'],
+  extraDependencies: ['html', 'language'],
 
-  relations: (relation, contribution) => ({
+  query: (contribution) => ({
+    albumArtistContribution:
+      (contribution.thing.isTrack
+        ? contribution.thing.album.artistContribs
+            .find(artistContrib => artistContrib.artist === contribution.artist)
+        : null),
+  }),
+
+  relations: (relation, query, contribution) => ({
     tooltip:
       relation('generateTooltip'),
 
     externalLinkSection:
       relation('generateContributionTooltipExternalLinkSection', contribution),
 
-    chronologySection:
+    ownChronologySection:
       relation('generateContributionTooltipChronologySection', contribution),
+
+    artistReleaseChronologySection:
+      (query.albumArtistContribution
+        ? relation('generateContributionTooltipChronologySection',
+            query.albumArtistContribution)
+        : null),
+  }),
+
+  data: (query, contribution) => ({
+    artistName:
+      contribution.artist.name,
+
+    isAlbumArtistContribution:
+      contribution.thing.isAlbum &&
+      contribution.thingProperty === 'artistContribs',
+
+    isSingleTrackArtistContribution:
+      contribution.thing.isTrack &&
+      contribution.thingProperty === 'artistContribs' &&
+      contribution.thing.album.style === 'single',
+
+    artistReleaseChronologySectionDiffers:
+      (query.albumArtistContribution
+        ? !compareReleaseContributions(contribution, query.albumArtistContribution)
+        : null),
   }),
 
   slots: {
@@ -25,24 +91,64 @@ export default {
     chronologyKind: {type: 'string'},
   },
 
-  generate: (relations, slots, {html}) =>
-    relations.tooltip.slots({
-      attributes:
-        {class: 'contribution-tooltip'},
-
-      contentAttributes: {
-        [html.joinChildren]:
-          html.tag('span', {class: 'tooltip-divider'}),
-      },
-
-      content: [
-        slots.showExternalLinks &&
-          relations.externalLinkSection,
-
-        slots.showChronology &&
-          relations.chronologySection.slots({
-            kind: slots.chronologyKind,
-          }),
-      ],
-    }),
+  generate: (data, relations, slots, {html, language}) =>
+    language.encapsulate('misc.artistLink', capsule =>
+      relations.tooltip.slots({
+        attributes:
+          {class: 'contribution-tooltip'},
+
+        contentAttributes: {
+          [html.joinChildren]:
+            html.tag('span', {class: 'tooltip-divider'}),
+        },
+
+        content: [
+          slots.showExternalLinks &&
+            relations.externalLinkSection,
+
+          slots.showChronology &&
+            language.encapsulate(capsule, 'chronology', capsule => {
+              const chronologySections = [];
+
+              if (data.isAlbumArtistContribution) {
+                relations.ownChronologySection.setSlots({
+                  kind: 'release',
+                  heading:
+                    language.$(capsule, 'heading.artistReleases', {
+                      artist: data.artistName,
+                    }),
+                });
+              } else {
+                relations.ownChronologySection.setSlot('kind', slots.chronologyKind);
+              }
+
+              if (
+                data.isSingleTrackArtistContribution &&
+                !html.isBlank(relations.artistReleaseChronologySection)
+              ) {
+                relations.artistReleaseChronologySection.setSlot('kind', 'release');
+
+                relations.artistReleaseChronologySection.setSlot('heading',
+                  language.$(capsule, 'heading.artistReleases', {
+                    artist: data.artistName,
+                  }));
+
+                chronologySections.push(relations.artistReleaseChronologySection);
+
+                if (data.artistReleaseChronologySectionDiffers) {
+                  relations.ownChronologySection.setSlot('heading',
+                    language.$(capsule, 'heading.artistTracks', {
+                      artist: data.artistName,
+                    }));
+
+                  chronologySections.push(relations.ownChronologySection);
+                }
+              } else {
+                chronologySections.push(relations.ownChronologySection);
+              }
+
+              return chronologySections;
+            }),
+        ],
+      })),
 };
diff --git a/src/content/dependencies/generateContributionTooltipChronologySection.js b/src/content/dependencies/generateContributionTooltipChronologySection.js
index 378c0e1c..4ee9bb35 100644
--- a/src/content/dependencies/generateContributionTooltipChronologySection.js
+++ b/src/content/dependencies/generateContributionTooltipChronologySection.js
@@ -1,36 +1,36 @@
-import Thing from '#thing';
-
 function getName(thing) {
   if (!thing) {
     return null;
   }
 
-  const referenceType = thing.constructor[Thing.referenceType];
-
-  if (referenceType === 'artwork') {
+  if (thing.isArtwork) {
     return thing.thing.name;
   }
 
   return thing.name;
 }
 
+function getSiblings(contribution) {
+  let previous = contribution;
+  while (previous && previous.thing === contribution.thing) {
+    previous = previous.previousBySameArtist;
+  }
+
+  let next = contribution;
+  while (next && next.thing === contribution.thing) {
+    next = next.nextBySameArtist;
+  }
+
+  return {previous, next};
+}
+
 export default {
   contentDependencies: ['linkAnythingMan'],
   extraDependencies: ['html', 'language'],
 
-  query(contribution) {
-    let previous = contribution;
-    while (previous && previous.thing === contribution.thing) {
-      previous = previous.previousBySameArtist;
-    }
-
-    let next = contribution;
-    while (next && next.thing === contribution.thing) {
-      next = next.nextBySameArtist;
-    }
-
-    return {previous, next};
-  },
+  query: (contribution) => ({
+    ...getSiblings(contribution),
+  }),
 
   relations: (relation, query, _contribution) => ({
     previousLink:
@@ -53,23 +53,19 @@ export default {
   }),
 
   slots: {
-    kind: {
-      validate: v =>
-        v.is(
-          'album',
-          'bannerArt',
-          'coverArt',
-          'flash',
-          'track',
-          'trackArt',
-          'trackContribution',
-          'wallpaperArt'),
-    },
+    heading: {type: 'html', mutable: false},
+    kind: {type: 'string'},
   },
 
   generate: (data, relations, slots, {html, language}) =>
     language.encapsulate('misc.artistLink.chronology', capsule =>
       html.tags([
+        html.tag('span', {class: 'chronology-heading'},
+          {[html.onlyIfContent]: true},
+          {[html.onlyIfSiblings]: true},
+
+          slots.heading),
+
         html.tags([
           relations.previousLink?.slots({
             attributes: {class: 'chronology-link'},
diff --git a/src/content/dependencies/generateCoverArtwork.js b/src/content/dependencies/generateCoverArtwork.js
index c1a23bbd..78a6103b 100644
--- a/src/content/dependencies/generateCoverArtwork.js
+++ b/src/content/dependencies/generateCoverArtwork.js
@@ -1,5 +1,6 @@
 export default {
   contentDependencies: [
+    'generateColorStyleAttribute',
     'generateCoverArtworkArtTagDetails',
     'generateCoverArtworkArtistDetails',
     'generateCoverArtworkOriginDetails',
@@ -10,6 +11,9 @@ export default {
   extraDependencies: ['html'],
 
   relations: (relation, artwork) => ({
+    colorStyleAttribute:
+      relation('generateColorStyleAttribute'),
+
     image:
       relation('image', artwork),
 
@@ -46,7 +50,8 @@ export default {
     alt: {type: 'string'},
 
     color: {
-      validate: v => v.isColor,
+      validate: v => v.anyOf(v.isBoolean, v.isColor),
+      default: false,
     },
 
     mode: {
@@ -68,10 +73,7 @@ export default {
   generate(data, relations, slots, {html}) {
     const {image} = relations;
 
-    image.setSlots({
-      color: slots.color ?? data.color,
-      alt: slots.alt,
-    });
+    image.setSlot('alt', slots.alt);
 
     const square =
       (data.dimensions
@@ -84,6 +86,22 @@ export default {
       image.setSlot('dimensions', data.dimensions);
     }
 
+    const attributes = html.attributes();
+
+    let color = null;
+    if (typeof slots.color === 'boolean') {
+      if (slots.color) {
+        color = data.color;
+      }
+    } else if (slots.color) {
+      color = slots.color;
+    }
+
+    if (color) {
+      relations.colorStyleAttribute.setSlot('color', color);
+      attributes.add(relations.colorStyleAttribute);
+    }
+
     return html.tags([
       data.attachAbove &&
         html.tag('div', {class: 'cover-artwork-joiner'}),
@@ -96,6 +114,8 @@ export default {
         data.attachedArtworkIsMainArtwork &&
           {class: 'attached-artwork-is-main-artwork'},
 
+        attributes,
+
         (slots.mode === 'primary'
           ? [
               relations.image.slots({
diff --git a/src/content/dependencies/generateCoverArtworkOriginDetails.js b/src/content/dependencies/generateCoverArtworkOriginDetails.js
index 8628179e..ddd44286 100644
--- a/src/content/dependencies/generateCoverArtworkOriginDetails.js
+++ b/src/content/dependencies/generateCoverArtworkOriginDetails.js
@@ -1,5 +1,3 @@
-import Thing from '#thing';
-
 export default {
   contentDependencies: [
     'generateArtistCredit',
@@ -11,9 +9,6 @@ export default {
   extraDependencies: ['html', 'language', 'pagePath'],
 
   query: (artwork) => ({
-    artworkThingType:
-      artwork.thing.constructor[Thing.referenceType],
-
     attachedArtistContribs:
       (artwork.attachedArtwork
         ? artwork.attachedArtwork.artistContribs
@@ -33,7 +28,7 @@ export default {
       relation('transformContent', artwork.originDetails),
 
     albumLink:
-      (query.artworkThingType === 'album'
+      (artwork.thing.isAlbum
         ? relation('linkAlbum', artwork.thing)
         : null),
 
@@ -48,8 +43,12 @@ export default {
     label:
       artwork.label,
 
-    artworkThingType:
-      query.artworkThingType,
+    forAlbum:
+      artwork.thing.isAlbum,
+
+    forSingleStyleAlbum:
+      artwork.thing.isAlbum &&
+      artwork.thing.style === 'single',
   }),
 
   generate: (data, relations, {html, language, pagePath}) =>
@@ -97,7 +96,8 @@ export default {
 
           const trackArtFromAlbum =
             pagePath[0] === 'track' &&
-            data.artworkThingType === 'album' &&
+            data.forAlbum &&
+            !data.forSingleStyleAlbum &&
               language.$(capsule, 'trackArtFromAlbum', {
                 album:
                   relations.albumLink.slot('color', false),
diff --git a/src/content/dependencies/generateCoverGrid.js b/src/content/dependencies/generateCoverGrid.js
index e4dfd905..89371015 100644
--- a/src/content/dependencies/generateCoverGrid.js
+++ b/src/content/dependencies/generateCoverGrid.js
@@ -1,4 +1,4 @@
-import {stitchArrays} from '#sugar';
+import {empty, stitchArrays, unique} from '#sugar';
 
 export default {
   contentDependencies: ['generateGridActionLinks'],
@@ -11,10 +11,13 @@ export default {
   },
 
   slots: {
+    attributes: {type: 'attributes', mutable: false},
+
     images: {validate: v => v.strictArrayOf(v.isHTML)},
     links: {validate: v => v.strictArrayOf(v.isHTML)},
     names: {validate: v => v.strictArrayOf(v.isHTML)},
     info: {validate: v => v.strictArrayOf(v.isHTML)},
+    tab: {validate: v => v.strictArrayOf(v.isHTML)},
     notFromThisGroup: {validate: v => v.strictArrayOf(v.isBoolean)},
 
     // Differentiating from sparseArrayOf here - this list of classes should
@@ -30,37 +33,91 @@ export default {
               v.isString))),
     },
 
+    itemAttributes: {
+      validate: v =>
+        v.strictArrayOf(
+          v.optional(v.isAttributes)),
+    },
+
     lazy: {validate: v => v.anyOf(v.isWholeNumber, v.isBoolean)},
     actionLinks: {validate: v => v.sparseArrayOf(v.isHTML)},
+
+    revealAllWarnings: {
+      validate: v => v.looseArrayOf(v.isString),
+    },
   },
 
   generate: (relations, slots, {html, language}) =>
     html.tag('div', {class: 'grid-listing'},
+      slots.attributes,
       {[html.onlyIfContent]: true},
 
       [
+        !empty((slots.revealAllWarnings ?? []).filter(Boolean)) &&
+          language.encapsulate('misc.coverGrid.revealAll', capsule =>
+            html.tag('div', {class: 'reveal-all-container'},
+              ((slots.tab ?? [])
+                .slice(0, 4)
+                .some(tab => tab && !html.isBlank(tab))) &&
+
+                {class: 'has-nearby-tab'},
+
+              html.tag('p', {class: 'reveal-all'}, [
+                html.tag('a', {href: '#'}, [
+                  html.tag('span', {class: 'reveal-label'},
+                    language.$(capsule, 'reveal')),
+
+                  html.tag('span', {class: 'conceal-label'},
+                    {style: 'display: none'},
+                    language.$(capsule, 'conceal')),
+                ]),
+
+                html.tag('br'),
+
+                html.tag('span', {class: 'warnings'},
+                  language.$(capsule, 'warnings', {
+                    warnings:
+                      language.formatUnitList(
+                        unique(slots.revealAllWarnings.filter(Boolean))
+                          .sort()
+                          .map(warning => html.tag('b', warning))),
+                  })),
+              ]))),
+
         stitchArrays({
           classes: slots.classes,
+          attributes: slots.itemAttributes,
           image: slots.images,
           link: slots.links,
           name: slots.names,
           info: slots.info,
+          tab: slots.tab,
 
           notFromThisGroup:
             slots.notFromThisGroup ??
             Array.from(slots.links).fill(null)
         }).map(({
             classes,
+            attributes,
             image,
             link,
             name,
             info,
+            tab,
             notFromThisGroup,
           }, index) =>
             link.slots({
               attributes: [
+                link.getSlotValue('attributes'),
+
                 {class: ['grid-item', 'box']},
 
+                tab &&
+                !html.isBlank(tab) &&
+                  {class: 'has-tab'},
+
+                attributes,
+
                 (classes
                   ? {class: classes}
                   : null),
@@ -69,6 +126,11 @@ export default {
               colorContext: 'image-box',
 
               content: [
+                html.tag('span',
+                  {[html.onlyIfContent]: true},
+
+                  tab),
+
                 image.slots({
                   thumb: 'medium',
                   square: true,
diff --git a/src/content/dependencies/generateFlashInfoPage.js b/src/content/dependencies/generateFlashInfoPage.js
index cb652b1c..7f047cad 100644
--- a/src/content/dependencies/generateFlashInfoPage.js
+++ b/src/content/dependencies/generateFlashInfoPage.js
@@ -4,6 +4,8 @@ export default {
   contentDependencies: [
     'generateAdditionalNamesBox',
     'generateCommentaryEntry',
+    'generateCommentaryContentHeading',
+    'generateContentContentHeading',
     'generateContentHeading',
     'generateContributionList',
     'generateFlashActSidebar',
@@ -53,6 +55,12 @@ export default {
     contentHeading:
       relation('generateContentHeading'),
 
+    contentContentHeading:
+      relation('generateContentContentHeading', flash),
+
+    commentaryContentHeading:
+      relation('generateCommentaryContentHeading', flash),
+
     flashActLink:
       relation('linkFlashAct', flash.act),
 
@@ -168,20 +176,15 @@ export default {
           ]),
 
           html.tags([
-            relations.contentHeading.clone()
-              .slots({
-                attributes: {id: 'artist-commentary'},
-                title: language.$('misc.artistCommentary'),
-              }),
-
+            relations.commentaryContentHeading,
             relations.artistCommentaryEntries,
           ]),
 
           html.tags([
-            relations.contentHeading.clone()
+            relations.contentContentHeading.clone()
               .slots({
                 attributes: {id: 'crediting-sources'},
-                title: language.$('misc.creditingSources'),
+                string: 'misc.creditingSources',
               }),
 
             relations.creditSourceEntries,
diff --git a/src/content/dependencies/generateGroupGalleryPage.js b/src/content/dependencies/generateGroupGalleryPage.js
index dfdad0e8..8e11f9e5 100644
--- a/src/content/dependencies/generateGroupGalleryPage.js
+++ b/src/content/dependencies/generateGroupGalleryPage.js
@@ -183,7 +183,10 @@ export default {
                 }))),
           */
 
-          relations.albumsByDateView,
+          relations.albumsByDateView.slots({
+            showTitle:
+              !html.isBlank(relations.albumsBySeriesView),
+          }),
 
           relations.albumsBySeriesView.slots({
             attributes: [
diff --git a/src/content/dependencies/generateGroupGalleryPageAlbumGrid.js b/src/content/dependencies/generateGroupGalleryPageAlbumGrid.js
index 7d9aa2d2..7b90fd68 100644
--- a/src/content/dependencies/generateGroupGalleryPageAlbumGrid.js
+++ b/src/content/dependencies/generateGroupGalleryPageAlbumGrid.js
@@ -2,34 +2,60 @@ import {stitchArrays} from '#sugar';
 import {getTotalDuration} from '#wiki-data';
 
 export default {
-  contentDependencies: ['generateCoverGrid', 'image', 'linkAlbum'],
-  extraDependencies: ['language'],
+  contentDependencies: [
+    'generateCoverGrid',
+    'generateGroupGalleryPageAlbumGridTab',
+    'image',
+    'linkAlbum',
+  ],
 
-  relations: (relation, albums, _group) => ({
+  extraDependencies: ['language', 'wikiData'],
+
+  query: (albums, _group) => ({
+    artworks:
+      albums.map(album =>
+        (album.hasCoverArt
+          ? album.coverArtworks[0]
+          : null)),
+  }),
+
+  relations: (relation, query, albums, group) => ({
     coverGrid:
       relation('generateCoverGrid'),
 
     links:
-      albums.map(album =>
-        relation('linkAlbum', album)),
+      albums
+        .map(album => relation('linkAlbum', album)),
 
     images:
-      albums.map(album =>
-        (album.hasCoverArt
-          ? relation('image', album.coverArtworks[0])
-          : relation('image')))
+      query.artworks
+        .map(artwork => relation('image', artwork)),
+
+    tabs:
+      albums
+        .map(album =>
+          relation('generateGroupGalleryPageAlbumGridTab', album, group)),
   }),
 
-  data: (albums, group) => ({
+  data: (query, albums, group) => ({
     names:
       albums.map(album => album.name),
 
-    durations:
-      albums.map(album => getTotalDuration(album.tracks)),
+    styles:
+      albums.map(album => album.style),
 
     tracks:
       albums.map(album => album.tracks.length),
 
+    allWarnings:
+      query.artworks.flatMap(artwork => artwork?.contentWarnings),
+
+    durations:
+      albums.map(album =>
+        (album.hideDuration
+          ? null
+          : getTotalDuration(album.tracks))),
+
     notFromThisGroup:
       albums.map(album => !album.groups.includes(group)),
   }),
@@ -53,14 +79,28 @@ export default {
                   }),
               })),
 
+        itemAttributes:
+          data.styles.map(style => ({'data-style': style})),
+
+        tab: relations.tabs,
+
         info:
           stitchArrays({
+            style: data.styles,
             tracks: data.tracks,
             duration: data.durations,
-          }).map(({tracks, duration}) =>
-              language.$(capsule, 'details.albumLength', {
-                tracks: language.countTracks(tracks, {unit: true}),
-                time: language.formatDuration(duration),
-              })),
+          }).map(({style, tracks, duration}) =>
+              (style === 'single' && duration
+                ? language.$(capsule, 'details.albumLength.single', {
+                    time: language.formatDuration(duration),
+                  })
+             : duration
+                ? language.$(capsule, 'details.albumLength', {
+                    tracks: language.countTracks(tracks, {unit: true}),
+                    time: language.formatDuration(duration),
+                  })
+                : null)),
+
+        revealAllWarnings: data.allWarnings,
       })),
 };
diff --git a/src/content/dependencies/generateGroupGalleryPageAlbumGridTab.js b/src/content/dependencies/generateGroupGalleryPageAlbumGridTab.js
new file mode 100644
index 00000000..d86b61e1
--- /dev/null
+++ b/src/content/dependencies/generateGroupGalleryPageAlbumGridTab.js
@@ -0,0 +1,82 @@
+import {empty} from '#sugar';
+
+export default {
+  contentDependencies: ['generateArtistCredit'],
+  extraDependencies: ['language'],
+
+  query(album, group) {
+    if (album.groups.length > 1) {
+      const contextGroup = group;
+
+      const candidateGroupCategory =
+        album.groups
+          .filter(group => !group.excludeFromGalleryTabs)
+          .find(group => group.category !== contextGroup.category)
+          ?.category ??
+        null;
+
+      const candidateGroups =
+        album.groups
+          .filter(group => !group.excludeFromGalleryTabs)
+          .filter(group => group.category === candidateGroupCategory);
+
+      if (!empty(candidateGroups)) {
+        return {
+          mode: 'groups',
+          notedGroups: candidateGroups,
+        };
+      }
+    }
+
+    if (!empty(album.artistContribs)) {
+      if (
+        album.artistContribs.length === 1 &&
+        !empty(group.closelyLinkedArtists) &&
+        (album.artistContribs[0].artist.name ===
+         group.closelyLinkedArtists[0].artist.name)
+      ) {
+        return {mode: null};
+      }
+
+      return {
+        mode: 'artists',
+        notedArtistContribs: album.artistContribs,
+      };
+    }
+
+    return {mode: null};;
+  },
+
+  relations: (relation, query, _album, _group) => ({
+    artistCredit:
+      (query.mode === 'artists'
+        ? relation('generateArtistCredit', query.notedArtistContribs, [])
+        : null),
+  }),
+
+  data: (query, _album, _group) => ({
+    mode: query.mode,
+
+    groupNames:
+      (query.mode === 'groups'
+        ? query.notedGroups.map(group => group.name)
+        : null),
+  }),
+
+  generate: (data, relations, {language}) =>
+    language.encapsulate('misc.coverGrid.tab', capsule =>
+      (data.mode === 'groups'
+        ? language.$(capsule, 'groups', {
+            groups:
+              language.formatUnitList(data.groupNames),
+          })
+     : data.mode === 'artists'
+        ? relations.artistCredit.slots({
+            normalStringKey:
+              capsule + '.artists',
+
+            normalFeaturingStringKey:
+              capsule + '.artists.featuring',
+          })
+        : null)),
+};
diff --git a/src/content/dependencies/generateGroupGalleryPageAlbumsByDateView.js b/src/content/dependencies/generateGroupGalleryPageAlbumsByDateView.js
index b7d01eb5..58375f3e 100644
--- a/src/content/dependencies/generateGroupGalleryPageAlbumsByDateView.js
+++ b/src/content/dependencies/generateGroupGalleryPageAlbumsByDateView.js
@@ -1,7 +1,11 @@
 import {sortChronologically} from '#sort';
 
 export default {
-  contentDependencies: ['generateGroupGalleryPageAlbumGrid'],
+  contentDependencies: [
+    'generateGroupGalleryPageAlbumGrid',
+    'generateGroupGalleryPageStyleSelector',
+  ],
+
   extraDependencies: ['html', 'language'],
 
   query: (group) => ({
@@ -10,6 +14,11 @@ export default {
   }),
 
   relations: (relation, query, group) => ({
+    styleSelector:
+      (group.divideAlbumsByStyle
+        ? relation('generateGroupGalleryPageStyleSelector', group)
+        : null),
+
     albumGrid:
       relation('generateGroupGalleryPageAlbumGrid',
         query.albums,
@@ -17,6 +26,10 @@ export default {
   }),
 
   slots: {
+    showTitle: {
+      type: 'boolean',
+    },
+
     attributes: {
       type: 'attributes',
       mutable: false,
@@ -31,8 +44,11 @@ export default {
         {[html.onlyIfContent]: true},
 
         html.tag('section', [
-          html.tag('h2',
-            language.$(capsule, 'title')),
+          slots.showTitle &&
+            html.tag('h2',
+              language.$(capsule, 'title')),
+
+          relations.styleSelector,
 
           relations.albumGrid,
         ]))),
diff --git a/src/content/dependencies/generateGroupGalleryPageStyleSelector.js b/src/content/dependencies/generateGroupGalleryPageStyleSelector.js
new file mode 100644
index 00000000..4f9d02a9
--- /dev/null
+++ b/src/content/dependencies/generateGroupGalleryPageStyleSelector.js
@@ -0,0 +1,62 @@
+import {unique} from '#sugar';
+
+export default {
+  extraDependencies: ['html', 'language'],
+
+  query: (group) => ({
+    styles:
+      unique(group.albums.map(album => album.style)),
+  }),
+
+  data: (query, group) => ({
+    albums:
+      group.albums.length,
+
+    styles:
+      query.styles,
+  }),
+
+  generate: (data, {html, language}) =>
+    language.encapsulate('groupGalleryPage', pageCapsule =>
+      (data.styles.length <= 1
+        ? html.blank()
+        : html.tag('p', {class: 'gallery-style-selector'},
+            {class: ['drop', 'shiny']},
+
+            language.encapsulate(pageCapsule, 'albumStyleSwitcher', capsule => [
+              html.tag('span',
+                language.$(capsule)),
+
+              html.tag('br'),
+
+              html.tag('span', {class: 'styles'},
+                data.styles.map(style =>
+                  html.tag('label', {'data-style': style}, [
+                    html.tag('input', {type: 'checkbox'},
+                      {checked: true}),
+
+                    html.tag('span',
+                      language.$(capsule, style)),
+                  ]))),
+
+              html.tag('br'),
+
+              html.tag('span', {class: ['count', 'all']},
+                language.$(capsule, 'count.all', {
+                  total: data.albums,
+                })),
+
+              html.tag('span', {class: ['count', 'filtered']},
+                {style: 'display: none'},
+
+                language.$(capsule, 'count.filtered', {
+                  count: html.tag('span'),
+                  total: data.albums,
+                })),
+
+              html.tag('span', {class: ['count', 'none']},
+                {style: 'display: none'},
+
+                language.$(capsule, 'count.none')),
+            ])))),
+};
diff --git a/src/content/dependencies/generateGroupInfoPageAlbumsListItem.js b/src/content/dependencies/generateGroupInfoPageAlbumsListItem.js
index 4680cb46..cec18240 100644
--- a/src/content/dependencies/generateGroupInfoPageAlbumsListItem.js
+++ b/src/content/dependencies/generateGroupInfoPageAlbumsListItem.js
@@ -127,9 +127,7 @@ export default {
             workingCapsule += '.withArtists';
             workingOptions.by =
               html.tag('span', {class: 'by'},
-                // TODO: This is obviously evil.
-                html.metatag('chunkwrap', {split: /,| (?=and)/},
-                  html.resolve(artistCredit)));
+                artistCredit);
           }
 
           return language.$(workingCapsule, workingOptions);
diff --git a/src/content/dependencies/generateIntrapageDotSwitcher.js b/src/content/dependencies/generateIntrapageDotSwitcher.js
index 1d58367d..cd92b165 100644
--- a/src/content/dependencies/generateIntrapageDotSwitcher.js
+++ b/src/content/dependencies/generateIntrapageDotSwitcher.js
@@ -39,11 +39,32 @@ export default {
         stitchArrays({
           title: slots.titles,
           targetID: slots.targetIDs,
-        }).map(({title, targetID}) =>
-            html.tag('a', {href: '#'},
-              {'data-target-id': targetID},
-              {[html.onlyIfContent]: true},
+        }).map(({title, targetID}) => {
+            const {content} = html.smush(title);
 
-              language.sanitize(title))),
+            const customCue =
+              content.find(item =>
+                item?.tagName === 'span' &&
+                item.attributes.has('class', 'dot-switcher-interaction-cue'));
+
+            const cue =
+              (customCue && !html.isBlank(customCue)
+                ? customCue.content
+                : language.sanitize(title));
+
+            const a =
+              html.tag('a', {href: '#'},
+                {'data-target-id': targetID},
+                {[html.onlyIfContent]: true},
+
+                cue);
+
+            if (customCue) {
+              content.splice(content.indexOf(customCue), 1, a);
+              return html.tags(content, {[html.joinChildren]: ''});
+            } else {
+              return a;
+            }
+          }),
     }),
 };
diff --git a/src/content/dependencies/generateLyricsSection.js b/src/content/dependencies/generateLyricsSection.js
index f6b719a9..64676d3b 100644
--- a/src/content/dependencies/generateLyricsSection.js
+++ b/src/content/dependencies/generateLyricsSection.js
@@ -21,10 +21,10 @@ export default {
       entries
         .map(entry => relation('generateLyricsEntry', entry)),
 
-    annotations:
+    annotationParts:
       entries
-        .map(entry => entry.annotation)
-        .map(annotation => relation('transformContent', annotation)),
+        .map(entry => entry.annotationParts
+          .map(part => relation('transformContent', part))),
   }),
 
   data: (entries) => ({
@@ -54,11 +54,24 @@ export default {
                 initialOptionIndex: 0,
 
                 titles:
-                  relations.annotations.map(annotation =>
-                    annotation.slots({
-                      mode: 'inline',
-                      textOnly: true,
-                    })),
+                  relations.annotationParts
+                    .map(([first, ...rest]) =>
+                      language.formatUnitList([
+                        html.tag('span',
+                          {class: 'dot-switcher-interaction-cue'},
+                          {[html.onlyIfContent]: true},
+
+                          first?.slots({
+                            mode: 'inline',
+                            textOnly: true,
+                          })),
+
+                        ...rest.map(part =>
+                          part.slots({
+                            mode: 'inline',
+                            textOnly: true,
+                          })),
+                      ])),
 
                 targetIDs:
                   data.ids,
diff --git a/src/content/dependencies/generateReadCommentaryLine.js b/src/content/dependencies/generateReadCommentaryLine.js
new file mode 100644
index 00000000..a7a7a4da
--- /dev/null
+++ b/src/content/dependencies/generateReadCommentaryLine.js
@@ -0,0 +1,47 @@
+import {empty} from '#sugar';
+
+export default {
+  extraDependencies: ['html', 'language'],
+
+  query: (thing) => ({
+    entries:
+      (thing.isTrack
+        ? [...thing.commentary, ...thing.commentaryFromMainRelease]
+        : thing.commentary),
+  }),
+
+  data: (query, _thing) => ({
+    hasWikiEditorCommentary:
+      query.entries
+        .some(entry => entry.isWikiEditorCommentary),
+
+    onlyWikiEditorCommentary:
+      !empty(query.entries) &&
+      query.entries
+        .every(entry => entry.isWikiEditorCommentary),
+
+    hasAnyCommentary:
+      !empty(query.entries),
+  }),
+
+  generate: (data, {html, language}) =>
+    language.encapsulate('releaseInfo.readCommentary', capsule =>
+      language.$(capsule, {
+        [language.onlyIfOptions]: ['link'],
+
+        link:
+          html.tag('a',
+            {[html.onlyIfContent]: true},
+
+            {href: '#artist-commentary'},
+
+            language.encapsulate(capsule, 'link', capsule =>
+              (data.onlyWikiEditorCommentary
+                ? language.$(capsule, 'onlyWikiCommentary')
+             : data.hasWikiEditorCommentary
+                ? language.$(capsule, 'withWikiCommentary')
+             : data.hasAnyCommentary
+                ? language.$(capsule)
+                : html.blank()))),
+      })),
+};
diff --git a/src/content/dependencies/generateReleaseInfoListenLine.js b/src/content/dependencies/generateReleaseInfoListenLine.js
new file mode 100644
index 00000000..b02ff6f9
--- /dev/null
+++ b/src/content/dependencies/generateReleaseInfoListenLine.js
@@ -0,0 +1,159 @@
+import {isExternalLinkContext} from '#external-links';
+import {empty, stitchArrays, unique} from '#sugar';
+
+function getReleaseContext(urlString, {
+  _artistURLs,
+  albumArtistURLs,
+}) {
+  const composerBandcampDomains =
+    albumArtistURLs
+      .filter(url => url.hostname.endsWith('.bandcamp.com'))
+      .map(url => url.hostname);
+
+  const url = new URL(urlString);
+
+  if (url.hostname === 'homestuck.bandcamp.com') {
+    return 'officialRelease';
+  }
+
+  if (composerBandcampDomains.includes(url.hostname)) {
+    return 'composerRelease';
+  }
+
+  return null;
+}
+
+export default {
+  contentDependencies: ['linkExternal'],
+  extraDependencies: ['html', 'language'],
+
+  query(thing) {
+    const query = {};
+
+    query.album =
+      (thing.album
+        ? thing.album
+        : thing);
+
+    query.urls =
+      (!empty(thing.urls)
+        ? thing.urls
+     : thing.album &&
+       thing.album.style === 'single' &&
+       thing.album.tracks[0] === thing
+        ? thing.album.urls
+        : []);
+
+    query.artists =
+      thing.artistContribs
+        .map(contrib => contrib.artist);
+
+    query.artistGroups =
+      query.artists
+        .flatMap(artist => artist.closelyLinkedGroups)
+        .map(({group}) => group);
+
+    query.albumArtists =
+      query.album.artistContribs
+        .map(contrib => contrib.artist);
+
+    query.albumArtistGroups =
+      query.albumArtists
+        .flatMap(artist => artist.closelyLinkedGroups)
+        .map(({group}) => group);
+
+    return query;
+  },
+
+  relations: (relation, query, _thing) => ({
+    links:
+      query.urls.map(url => relation('linkExternal', url)),
+  }),
+
+  data(query, thing) {
+    const data = {};
+
+    data.name = thing.name;
+
+    const artistURLs =
+      unique([
+        ...query.artists.flatMap(artist => artist.urls),
+        ...query.artistGroups.flatMap(group => group.urls),
+      ]).map(url => new URL(url));
+
+    const albumArtistURLs =
+      unique([
+        ...query.albumArtists.flatMap(artist => artist.urls),
+        ...query.albumArtistGroups.flatMap(group => group.urls),
+      ]).map(url => new URL(url));
+
+    const boundGetReleaseContext = urlString =>
+      getReleaseContext(urlString, {
+        artistURLs,
+        albumArtistURLs,
+      });
+
+    let releaseContexts =
+      query.urls.map(boundGetReleaseContext);
+
+    const albumReleaseContexts =
+      query.album.urls.map(boundGetReleaseContext);
+
+    const presentReleaseContexts =
+      unique(releaseContexts.filter(Boolean));
+
+    const presentAlbumReleaseContexts =
+      unique(albumReleaseContexts.filter(Boolean));
+
+    if (
+      presentReleaseContexts.length <= 1 &&
+      presentAlbumReleaseContexts.length <= 1
+    ) {
+      releaseContexts =
+        query.urls.map(() => null);
+    }
+
+    data.releaseContexts = releaseContexts;
+
+    return data;
+  },
+
+  slots: {
+    visibleWithoutLinks: {
+      type: 'boolean',
+      default: false,
+    },
+
+    context: {
+      validate: () => isExternalLinkContext,
+      default: 'generic',
+    },
+  },
+
+  generate: (data, relations, slots, {html, language}) =>
+    language.encapsulate('releaseInfo.listenOn', capsule =>
+      (empty(relations.links) && slots.visibleWithoutLinks
+        ? language.$(capsule, 'noLinks', {
+            name:
+              html.tag('i', data.name),
+          })
+
+        : language.$('releaseInfo.listenOn', {
+            [language.onlyIfOptions]: ['links'],
+
+            links:
+              language.formatDisjunctionList(
+                stitchArrays({
+                  link: relations.links,
+                  releaseContext: data.releaseContexts,
+                }).map(({link, releaseContext}) =>
+                    link.slot('context', [
+                      ...
+                      (Array.isArray(slots.context)
+                        ? slots.context
+                        : [slots.context]),
+
+                      releaseContext,
+                    ]))),
+          }))),
+};
diff --git a/src/content/dependencies/generateTrackArtistCommentarySection.js b/src/content/dependencies/generateTrackArtistCommentarySection.js
index 6650ff2b..5ed24d6c 100644
--- a/src/content/dependencies/generateTrackArtistCommentarySection.js
+++ b/src/content/dependencies/generateTrackArtistCommentarySection.js
@@ -2,8 +2,8 @@ import {empty, stitchArrays} from '#sugar';
 
 export default {
   contentDependencies: [
+    'generateCommentaryContentHeading',
     'generateCommentaryEntry',
-    'generateContentHeading',
     'linkAlbum',
     'linkTrack',
   ],
@@ -18,8 +18,8 @@ export default {
   }),
 
   relations: (relation, query, track) => ({
-    contentHeading:
-      relation('generateContentHeading'),
+    commentaryContentHeading:
+      relation('generateCommentaryContentHeading', track),
 
     mainReleaseTrackLink:
       (track.isSecondaryRelease
@@ -28,7 +28,7 @@ export default {
 
     mainReleaseArtistCommentaryEntries:
       (track.isSecondaryRelease
-        ? track.mainReleaseTrack.commentary
+        ? track.commentaryFromMainRelease
             .map(entry => relation('generateCommentaryEntry', entry))
         : null),
 
@@ -78,42 +78,40 @@ export default {
   generate: (data, relations, {html, language}) =>
     language.encapsulate('misc.artistCommentary', capsule =>
       html.tags([
-        relations.contentHeading.clone()
-          .slots({
-            attributes: {id: 'artist-commentary'},
-            title: language.$('misc.artistCommentary'),
-          }),
-
+        relations.commentaryContentHeading,
         relations.artistCommentaryEntries,
 
         data.isSecondaryRelease &&
-          html.tags([
-            html.tag('p', {class: ['drop', 'commentary-drop']},
-              {[html.onlyIfSiblings]: true},
+          html.tag('div', {class: 'inherited-commentary-section'},
+            {[html.onlyIfContent]: true},
+
+            [
+              html.tag('p', {class: ['drop', 'commentary-drop']},
+                {[html.onlyIfSiblings]: true},
 
-              language.encapsulate(capsule, 'info.fromMainRelease', workingCapsule => {
-                const workingOptions = {};
+                language.encapsulate(capsule, 'info.fromMainRelease', workingCapsule => {
+                  const workingOptions = {};
 
-                workingOptions.album =
-                  relations.mainReleaseTrackLink.slots({
-                    content:
-                      data.mainReleaseAlbumName,
+                  workingOptions.album =
+                    relations.mainReleaseTrackLink.slots({
+                      content:
+                        data.mainReleaseAlbumName,
 
-                    color:
-                      data.mainReleaseAlbumColor,
-                  });
+                      color:
+                        data.mainReleaseAlbumColor,
+                    });
 
-                if (data.name !== data.mainReleaseName) {
-                  workingCapsule += '.namedDifferently';
-                  workingOptions.name =
-                    html.tag('i', data.mainReleaseName);
-                }
+                  if (data.name !== data.mainReleaseName) {
+                    workingCapsule += '.namedDifferently';
+                    workingOptions.name =
+                      html.tag('i', data.mainReleaseName);
+                  }
 
-                return language.$(workingCapsule, workingOptions);
-              })),
+                  return language.$(workingCapsule, workingOptions);
+                })),
 
-            relations.mainReleaseArtistCommentaryEntries,
-          ]),
+              relations.mainReleaseArtistCommentaryEntries,
+            ]),
 
         html.tag('p', {class: ['drop', 'commentary-drop']},
           {[html.onlyIfContent]: true},
diff --git a/src/content/dependencies/generateTrackInfoPage.js b/src/content/dependencies/generateTrackInfoPage.js
index 8d59f85f..071ccd45 100644
--- a/src/content/dependencies/generateTrackInfoPage.js
+++ b/src/content/dependencies/generateTrackInfoPage.js
@@ -2,15 +2,18 @@ export default {
   contentDependencies: [
     'generateAdditionalFilesList',
     'generateAdditionalNamesBox',
+    'generateAlbumArtworkColumn',
     'generateAlbumNavAccent',
     'generateAlbumSecondaryNav',
     'generateAlbumSidebar',
     'generateAlbumStyleTags',
     'generateCommentaryEntry',
+    'generateContentContentHeading',
     'generateContentHeading',
     'generateContributionList',
     'generateLyricsSection',
     'generatePageLayout',
+    'generateReadCommentaryLine',
     'generateTrackArtistCommentarySection',
     'generateTrackArtworkColumn',
     'generateTrackInfoPageFeaturedByFlashesList',
@@ -32,6 +35,14 @@ export default {
       (track.isMainRelease
         ? track
         : track.mainReleaseTrack),
+
+    singleTrackSingle:
+      track.album.style === 'single' &&
+      track.album.tracks.length === 1,
+
+    firstTrackInSingle:
+      track.album.style === 'single' &&
+      track === track.album.tracks[0],
   }),
 
   relations: (relation, query, track) => ({
@@ -47,6 +58,9 @@ export default {
     navLinks:
       relation('generateTrackNavLinks', track),
 
+    albumNavLink:
+      relation('linkAlbum', track.album),
+
     albumNavAccent:
       relation('generateAlbumNavAccent', track.album, track),
 
@@ -60,14 +74,22 @@ export default {
       relation('generateAdditionalNamesBox', track.additionalNames),
 
     artworkColumn:
-      relation('generateTrackArtworkColumn', track),
+      (query.firstTrackInSingle
+        ? relation('generateAlbumArtworkColumn', track.album)
+        : relation('generateTrackArtworkColumn', track)),
 
     contentHeading:
       relation('generateContentHeading'),
 
+    contentContentHeading:
+      relation('generateContentContentHeading', track),
+
     releaseInfo:
       relation('generateTrackReleaseInfo', track),
 
+    readCommentaryLine:
+      relation('generateReadCommentaryLine', track),
+
     otherReleasesList:
       relation('generateTrackInfoPageOtherReleasesList', track),
 
@@ -75,18 +97,20 @@ export default {
       relation('generateContributionList', track.contributorContribs),
 
     referencedTracksList:
-      relation('generateTrackList', track.referencedTracks),
+      relation('generateTrackList', track.referencedTracks, track),
 
     sampledTracksList:
-      relation('generateTrackList', track.sampledTracks),
+      relation('generateTrackList', track.sampledTracks, track),
 
     referencedByTracksList:
       relation('generateTrackListDividedByGroups',
-        query.mainReleaseTrack.referencedByTracks),
+        query.mainReleaseTrack.referencedByTracks,
+        track),
 
     sampledByTracksList:
       relation('generateTrackListDividedByGroups',
-        query.mainReleaseTrack.sampledByTracks),
+        query.mainReleaseTrack.sampledByTracks,
+        track),
 
     flashesThatFeatureList:
       relation('generateTrackInfoPageFeaturedByFlashesList', track),
@@ -115,12 +139,21 @@ export default {
         .map(entry => relation('generateCommentaryEntry', entry)),
   }),
 
-  data: (_query, track) => ({
+  data: (query, track) => ({
     name:
       track.name,
 
     color:
       track.color,
+
+    dateAlbumAddedToWiki:
+      track.album.dateAddedToWiki,
+
+    singleTrackSingle:
+      query.singleTrackSingle,
+
+    firstTrackInSingle:
+      query.firstTrackInSingle,
   }),
 
   generate: (data, relations, {html, language}) =>
@@ -176,14 +209,19 @@ export default {
                         language.$(capsule, 'link')),
                   })),
 
-              !html.isBlank(relations.artistCommentarySection) &&
-                language.encapsulate(capsule, 'readCommentary', capsule =>
-                  language.$(capsule, {
-                    link:
-                      html.tag('a',
-                        {href: '#artist-commentary'},
-                        language.$(capsule, 'link')),
-                  })),
+              (!html.isBlank(relations.additionalFilesList) ||
+               !html.isBlank(relations.contributorContributionList) ||
+               !html.isBlank(relations.creditingSourceEntries) ||
+               !html.isBlank(relations.flashesThatFeatureList) ||
+               !html.isBlank(relations.lyricsSection) ||
+               !html.isBlank(relations.midiProjectFilesList) ||
+               !html.isBlank(relations.referencedByTracksList) ||
+               !html.isBlank(relations.referencedTracksList) ||
+               !html.isBlank(relations.referencingSourceEntries) ||
+               !html.isBlank(relations.sampledByTracksList) ||
+               !html.isBlank(relations.sampledTracksList) ||
+               !html.isBlank(relations.sheetMusicFilesList)) &&
+                relations.readCommentaryLine,
 
               !html.isBlank(relations.creditingSourceEntries) &&
                 language.encapsulate(capsule, 'readCreditingSources', capsule =>
@@ -316,6 +354,22 @@ export default {
             relations.flashesThatFeatureList,
           ]),
 
+          data.firstTrackInSingle &&
+            html.tag('p',
+              {[html.onlyIfContent]: true},
+
+              language.$('releaseInfo.addedToWiki', {
+                [language.onlyIfOptions]: ['date'],
+                date: language.formatDate(data.dateAlbumAddedToWiki),
+              })),
+
+          data.firstTrackInSingle &&
+          (!html.isBlank(relations.lyricsSection) ||
+           !html.isBlank(relations.artistCommentaryEntries) ||
+           !html.isBlank(relations.creditingSourceEntries) ||
+           !html.isBlank(relations.referencingSourceEntries)) &&
+            html.tag('hr', {class: 'main-separator'}),
+
           relations.lyricsSection,
 
           html.tags([
@@ -351,20 +405,20 @@ export default {
           relations.artistCommentarySection,
 
           html.tags([
-            relations.contentHeading.clone()
+            relations.contentContentHeading.clone()
               .slots({
                 attributes: {id: 'crediting-sources'},
-                title: language.$('misc.creditingSources'),
+                string: 'misc.creditingSources',
               }),
 
             relations.creditingSourceEntries,
           ]),
 
           html.tags([
-            relations.contentHeading.clone()
+            relations.contentContentHeading.clone()
               .slots({
                 attributes: {id: 'referencing-sources'},
-                title: language.$('misc.referencingSources'),
+                string: 'misc.referencingSources',
               }),
 
             relations.referencingSourceEntries,
@@ -372,17 +426,28 @@ export default {
         ],
 
         navLinkStyle: 'hierarchical',
-        navLinks: html.resolve(relations.navLinks),
+        navLinks:
+          (data.singleTrackSingle
+            ? [
+                {auto: 'home'},
+                {
+                  html: relations.albumNavLink,
+                  accent: language.$(pageCapsule, 'nav.singleAccent'),
+                },
+              ]
+            : html.resolve(relations.navLinks)),
 
         navBottomRowContent:
-          relations.albumNavAccent.slots({
-            showTrackNavigation: true,
-            showExtraLinks: false,
-          }),
+          (data.singleTrackSingle
+            ? null
+            : relations.albumNavAccent.slots({
+                showTrackNavigation: true,
+                showExtraLinks: false,
+              })),
 
         secondaryNav:
           relations.secondaryNav
-            .slot('mode', 'track'),
+            .slot('mode', data.firstTrackInSingle ? 'album' : 'track'),
 
         leftSidebar: relations.sidebar,
 
diff --git a/src/content/dependencies/generateTrackList.js b/src/content/dependencies/generateTrackList.js
index 53a32536..ff7659b5 100644
--- a/src/content/dependencies/generateTrackList.js
+++ b/src/content/dependencies/generateTrackList.js
@@ -2,9 +2,18 @@ export default {
   contentDependencies: ['generateTrackListItem'],
   extraDependencies: ['html'],
 
-  relations: (relation, tracks) => ({
+  query: (tracks, contextTrack) => ({
+    presentedTracks:
+      (contextTrack
+        ? tracks.map(track =>
+            track.otherReleases.find(({album}) => album === contextTrack.album) ??
+            track)
+        : tracks),
+  }),
+
+  relations: (relation, query, _tracks, _contextTrack) => ({
     items:
-      tracks
+      query.presentedTracks
         .map(track => relation('generateTrackListItem', track, [])),
   }),
 
diff --git a/src/content/dependencies/generateTrackListDividedByGroups.js b/src/content/dependencies/generateTrackListDividedByGroups.js
index 230868d6..9deccc0c 100644
--- a/src/content/dependencies/generateTrackListDividedByGroups.js
+++ b/src/content/dependencies/generateTrackListDividedByGroups.js
@@ -14,7 +14,7 @@ export default {
       wikiInfo.divideTrackListsByGroups,
   }),
 
-  query(sprawl, tracks) {
+  query(sprawl, tracks, _contextTrack) {
     const dividingGroups = sprawl.divideTrackListsByGroups;
 
     const groupings = new Map();
@@ -50,10 +50,10 @@ export default {
     return {groups, groupedTracks, ungroupedTracks};
   },
 
-  relations: (relation, query, sprawl, tracks) => ({
+  relations: (relation, query, sprawl, tracks, contextTrack) => ({
     flatList:
       (empty(sprawl.divideTrackListsByGroups)
-        ? relation('generateTrackList', tracks)
+        ? relation('generateTrackList', tracks, contextTrack)
         : null),
 
     contentHeading:
@@ -65,12 +65,12 @@ export default {
 
     groupedTrackLists:
       query.groupedTracks
-        .map(tracks => relation('generateTrackList', tracks)),
+        .map(tracks => relation('generateTrackList', tracks, contextTrack)),
 
     ungroupedTrackList:
       (empty(query.ungroupedTracks)
         ? null
-        : relation('generateTrackList', query.ungroupedTracks)),
+        : relation('generateTrackList', query.ungroupedTracks, contextTrack)),
   }),
 
   data: (query, _sprawl, _tracks) => ({
diff --git a/src/content/dependencies/generateTrackListItem.js b/src/content/dependencies/generateTrackListItem.js
index 3c850a18..5678e240 100644
--- a/src/content/dependencies/generateTrackListItem.js
+++ b/src/content/dependencies/generateTrackListItem.js
@@ -97,9 +97,7 @@ export default {
             workingCapsule += '.withArtists';
             workingOptions.by =
               html.tag('span', {class: 'by'},
-                // TODO: This is obviously evil.
-                html.metatag('chunkwrap', {split: /,| (?=and)/},
-                  html.resolve(relations.credit)));
+                relations.credit);
           }
 
           return language.$(workingCapsule, workingOptions);
diff --git a/src/content/dependencies/generateTrackReleaseInfo.js b/src/content/dependencies/generateTrackReleaseInfo.js
index 54e462c7..3298dcc4 100644
--- a/src/content/dependencies/generateTrackReleaseInfo.js
+++ b/src/content/dependencies/generateTrackReleaseInfo.js
@@ -1,9 +1,7 @@
-import {empty} from '#sugar';
-
 export default {
   contentDependencies: [
     'generateReleaseInfoContributionsLine',
-    'linkExternal',
+    'generateReleaseInfoListenLine',
   ],
 
   extraDependencies: ['html', 'language'],
@@ -11,14 +9,11 @@ export default {
   relations(relation, track) {
     const relations = {};
 
-    relations.artistContributionLinks =
+    relations.artistContributionsLine =
       relation('generateReleaseInfoContributionsLine', track.artistContribs);
 
-    if (!empty(track.urls)) {
-      relations.externalLinks =
-        track.urls.map(url =>
-          relation('linkExternal', url));
-    }
+    relations.listenLine =
+      relation('generateReleaseInfoListenLine', track);
 
     return relations;
   },
@@ -48,7 +43,7 @@ export default {
           {[html.joinChildren]: html.tag('br')},
 
           [
-            relations.artistContributionLinks.slots({
+            relations.artistContributionsLine.slots({
               stringKey: capsule + '.by',
               featuringStringKey: capsule + '.by.featuring',
               chronologyKind: 'track',
@@ -66,17 +61,9 @@ export default {
           ]),
 
         html.tag('p',
-          language.encapsulate(capsule, 'listenOn', capsule =>
-            (relations.externalLinks
-              ? language.$(capsule, {
-                  links:
-                    language.formatDisjunctionList(
-                      relations.externalLinks
-                        .map(link => link.slot('context', 'track'))),
-                })
-              : language.$(capsule, 'noLinks', {
-                  name:
-                    html.tag('i', data.name),
-                })))),
+          relations.listenLine.slots({
+            visibleWithoutLinks: true,
+            context: ['track'],
+          })),
       ])),
 };
diff --git a/src/content/dependencies/linkAlbum.js b/src/content/dependencies/linkAlbum.js
index 36b0d13a..cdfe65d3 100644
--- a/src/content/dependencies/linkAlbum.js
+++ b/src/content/dependencies/linkAlbum.js
@@ -1,8 +1,12 @@
 export default {
-  contentDependencies: ['linkThing'],
+  contentDependencies: ['linkThing', 'linkTrack'],
 
-  relations: (relation, album) =>
-    ({link: relation('linkThing', 'localized.album', album)}),
+  relations: (relation, album) => ({
+    link:
+      (album.style === 'single'
+        ? relation('linkTrack', album.tracks[0])
+        : relation('linkThing', 'localized.album', album)),
+  }),
 
   generate: (relations) => relations.link,
 };
diff --git a/src/content/dependencies/linkAnythingMan.js b/src/content/dependencies/linkAnythingMan.js
index e408c1b2..10ce7762 100644
--- a/src/content/dependencies/linkAnythingMan.js
+++ b/src/content/dependencies/linkAnythingMan.js
@@ -6,19 +6,15 @@ export default {
     'linkTrack',
   ],
 
-  query: (thing) => ({
-    referenceType: thing.constructor[Symbol.for('Thing.referenceType')],
-  }),
-
-  relations: (relation, query, thing) => ({
+  relations: (relation, thing) => ({
     link:
-      (query.referenceType === 'album'
+      (thing.isAlbum
         ? relation('linkAlbum', thing)
-     : query.referenceType === 'artwork'
+     : thing.isArtwork
         ? relation('linkArtwork', thing)
-     : query.referenceType === 'flash'
+     : thing.isFlash
         ? relation('linkFlash', thing)
-     : query.referenceType === 'track'
+     : thing.isTrack
         ? relation('linkTrack', thing)
         : null),
   }),
diff --git a/src/content/dependencies/linkArtistRollingWindow.js b/src/content/dependencies/linkArtistRollingWindow.js
new file mode 100644
index 00000000..e94b8ec5
--- /dev/null
+++ b/src/content/dependencies/linkArtistRollingWindow.js
@@ -0,0 +1,8 @@
+export default {
+  contentDependencies: ['linkThing'],
+
+  relations: (relation, artist) =>
+    ({link: relation('linkThing', 'localized.artistRollingWindow', artist)}),
+
+  generate: (relations) => relations.link,
+};
diff --git a/src/content/dependencies/linkArtwork.js b/src/content/dependencies/linkArtwork.js
index 8cd6f359..c10150d1 100644
--- a/src/content/dependencies/linkArtwork.js
+++ b/src/content/dependencies/linkArtwork.js
@@ -1,16 +1,11 @@
 export default {
   contentDependencies: ['linkAlbum', 'linkTrack'],
 
-  query: (artwork) => ({
-    referenceType:
-      artwork.thing.constructor[Symbol.for('Thing.referenceType')],
-  }),
-
-  relations: (relation, query, artwork) => ({
+  relations: (relation, artwork) => ({
     link:
-      (query.referenceType === 'album'
+      (artwork.thing.isAlbum
         ? relation('linkAlbum', artwork.thing)
-     : query.referenceType === 'track'
+     : artwork.thing.isTrack
         ? relation('linkTrack', artwork.thing)
         : null),
   }),
diff --git a/src/content/dependencies/linkContribution.js b/src/content/dependencies/linkContribution.js
index c658d461..1db0373b 100644
--- a/src/content/dependencies/linkContribution.js
+++ b/src/content/dependencies/linkContribution.js
@@ -30,7 +30,7 @@ export default {
 
     trimAnnotation: {type: 'boolean', default: false},
 
-    preventWrapping: {type: 'boolean', default: true},
+    preventWrapping: {type: 'boolean', default: false},
     preventTooltip: {type: 'boolean', default: false},
 
     chronologyKind: {type: 'string'},
diff --git a/src/content/dependencies/linkReferencedArtworks.js b/src/content/dependencies/linkReferencedArtworks.js
index c456b808..f73a2ad3 100644
--- a/src/content/dependencies/linkReferencedArtworks.js
+++ b/src/content/dependencies/linkReferencedArtworks.js
@@ -1,21 +1,14 @@
-import Thing from '#thing';
-
 export default {
   contentDependencies: [
     'linkAlbumReferencedArtworks',
     'linkTrackReferencedArtworks',
   ],
 
-  query: (artwork) => ({
-    referenceType:
-      artwork.thing.constructor[Thing.referenceType],
-  }),
-
-  relations: (relation, query, artwork) => ({
+  relations: (relation, artwork) => ({
     link:
-      (query.referenceType === 'album'
+      (artwork.thing.isAlbum
         ? relation('linkAlbumReferencedArtworks', artwork.thing)
-     : query.referenceType === 'track'
+     : artwork.thing.isTrack
         ? relation('linkTrackReferencedArtworks', artwork.thing)
         : null),
   }),
diff --git a/src/content/dependencies/linkReferencingArtworks.js b/src/content/dependencies/linkReferencingArtworks.js
index 0cfca4db..6927f230 100644
--- a/src/content/dependencies/linkReferencingArtworks.js
+++ b/src/content/dependencies/linkReferencingArtworks.js
@@ -1,21 +1,14 @@
-import Thing from '#thing';
-
 export default {
   contentDependencies: [
     'linkAlbumReferencingArtworks',
     'linkTrackReferencingArtworks',
   ],
 
-  query: (artwork) => ({
-    referenceType:
-      artwork.thing.constructor[Thing.referenceType],
-  }),
-
-  relations: (relation, query, artwork) => ({
+  relations: (relation, artwork) => ({
     link:
-      (query.referenceType === 'album'
+      (artwork.thing.isAlbum
         ? relation('linkAlbumReferencingArtworks', artwork.thing)
-     : query.referenceType === 'track'
+     : artwork.thing.isTrack
         ? relation('linkTrackReferencingArtworks', artwork.thing)
         : null),
   }),
diff --git a/src/content/dependencies/listAlbumsByDuration.js b/src/content/dependencies/listAlbumsByDuration.js
index c60685ab..c28fd800 100644
--- a/src/content/dependencies/listAlbumsByDuration.js
+++ b/src/content/dependencies/listAlbumsByDuration.js
@@ -11,8 +11,12 @@ export default {
   },
 
   query({albumData}, spec) {
-    const albums = sortAlphabetically(albumData.slice());
-    const durations = albums.map(album => getTotalDuration(album.tracks));
+    const albums =
+      sortAlphabetically(
+        albumData.filter(album => !album.hideDuration));
+
+    const durations =
+      albums.map(album => getTotalDuration(album.tracks));
 
     filterByCount(albums, durations);
     sortByCount(albums, durations, {greatestFirst: true});
diff --git a/src/content/dependencies/listAlbumsByTracks.js b/src/content/dependencies/listAlbumsByTracks.js
index 798e6c2e..1f20401c 100644
--- a/src/content/dependencies/listAlbumsByTracks.js
+++ b/src/content/dependencies/listAlbumsByTracks.js
@@ -10,13 +10,20 @@ export default {
   },
 
   query({albumData}, spec) {
-    const albums = sortAlphabetically(albumData.slice());
-    const counts = albums.map(album => album.tracks.length);
+    const albums =
+      sortAlphabetically(
+        albumData.filter(album => !album.hideDuration));
+
+    const counts =
+      albums.map(album => album.tracks.length);
 
     filterByCount(albums, counts);
     sortByCount(albums, counts, {greatestFirst: true});
 
-    return {spec, albums, counts};
+    const styles =
+      albums.map(album => album.style);
+
+    return {spec, albums, counts, styles};
   },
 
   relations(relation, query) {
@@ -32,6 +39,7 @@ export default {
   data(query) {
     return {
       counts: query.counts,
+      styles: query.styles,
     };
   },
 
@@ -42,10 +50,19 @@ export default {
         stitchArrays({
           link: relations.albumLinks,
           count: data.counts,
-        }).map(({link, count}) => ({
-            album: link,
-            tracks: language.countTracks(count, {unit: true}),
-          })),
+          style: data.styles,
+        }).map(({link, count, style}) => {
+            const row = {
+              album: link,
+              tracks: language.countTracks(count, {unit: true}),
+            };
+
+            if (style === 'single') {
+              row.stringsKey = 'single';
+            }
+
+            return row;
+          }),
     });
   },
 };
diff --git a/src/content/dependencies/listArtistsByContributions.js b/src/content/dependencies/listArtistsByContributions.js
index 41944959..99f19764 100644
--- a/src/content/dependencies/listArtistsByContributions.js
+++ b/src/content/dependencies/listArtistsByContributions.js
@@ -1,13 +1,6 @@
 import {sortAlphabetically, sortByCount} from '#sort';
-
-import {
-  accumulateSum,
-  empty,
-  filterByCount,
-  filterMultipleArrays,
-  stitchArrays,
-  unique,
-} from '#sugar';
+import {empty, filterByCount, filterMultipleArrays, stitchArrays}
+  from '#sugar';
 
 export default {
   contentDependencies: ['generateListingPage', 'linkArtist'],
@@ -41,37 +34,46 @@ export default {
       query[countsKey] = counts;
     };
 
+    const countContributions = (artist, keys) => {
+      const contribs =
+        keys
+          .flatMap(key => artist[key])
+          .filter(contrib => contrib.countInContributionTotals);
+
+      const things =
+        new Set(contribs.map(contrib => contrib.thing));
+
+      return things.size;
+    };
+
     queryContributionInfo(
       'artistsByTrackContributions',
       'countsByTrackContributions',
       artist =>
-        (unique(
-          ([
-            artist.trackArtistContributions,
-            artist.trackContributorContributions,
-          ]).flat()
-            .map(({thing}) => thing)
-        )).length);
+        countContributions(artist, [
+          'trackArtistContributions',
+          'trackContributorContributions',
+        ]));
 
     queryContributionInfo(
       'artistsByArtworkContributions',
       'countsByArtworkContributions',
       artist =>
-        accumulateSum(
-          [
-            artist.albumCoverArtistContributions,
-            artist.albumWallpaperArtistContributions,
-            artist.albumBannerArtistContributions,
-            artist.trackCoverArtistContributions,
-          ],
-          contribs => contribs.length));
+        countContributions(artist, [
+          'albumCoverArtistContributions',
+          'albumWallpaperArtistContributions',
+          'albumBannerArtistContributions',
+          'trackCoverArtistContributions',
+        ]));
 
     if (sprawl.enableFlashesAndGames) {
       queryContributionInfo(
         'artistsByFlashContributions',
         'countsByFlashContributions',
         artist =>
-          artist.flashContributorContributions.length);
+          countContributions(artist, [
+            'flashContributorContributions',
+          ]));
     }
 
     return query;
diff --git a/src/content/dependencies/transformContent.js b/src/content/dependencies/transformContent.js
index 69ecf5a4..e9a75744 100644
--- a/src/content/dependencies/transformContent.js
+++ b/src/content/dependencies/transformContent.js
@@ -1,5 +1,6 @@
 import {basename} from 'node:path';
 
+import {logWarn} from '#cli';
 import {bindFind} from '#find';
 import {replacerSpec, parseContentNodes} from '#replacer';
 
@@ -62,20 +63,30 @@ export default {
       Object.values(replacerSpec)
         .map(description => description.link)
         .filter(Boolean)),
+
     'image',
     'generateTextWithTooltip',
     'generateTooltip',
     'linkExternal',
   ],
 
-  extraDependencies: ['html', 'language', 'to', 'wikiData'],
+  extraDependencies: [
+    'html',
+    'language',
+    'niceShowAggregate',
+    'to',
+    'wikiData',
+  ],
 
   sprawl(wikiData, content) {
-    const find = bindFind(wikiData);
+    const find = bindFind(wikiData, {mode: 'quiet'});
 
-    const parsedNodes = parseContentNodes(content ?? '');
+    const {result: parsedNodes, error} =
+      parseContentNodes(content ?? '', {errorMode: 'return'});
 
     return {
+      error,
+
       nodes: parsedNodes
         .map(node => {
           if (node.type !== 'tag') {
@@ -189,6 +200,9 @@ export default {
     return {
       content,
 
+      error:
+        sprawl.error,
+
       nodes:
         sprawl.nodes
           .map(node => {
@@ -301,7 +315,12 @@ export default {
     },
   },
 
-  generate(data, relations, slots, {html, language, to}) {
+  generate(data, relations, slots, {html, language, niceShowAggregate, to}) {
+    if (data.error) {
+      logWarn`Error in content text.`;
+      niceShowAggregate(data.error);
+    }
+
     let imageIndex = 0;
     let internalLinkIndex = 0;
     let externalLinkIndex = 0;
@@ -360,9 +379,8 @@ export default {
                   height && {height},
                   style && {style},
 
-                  align === 'center' &&
-                  !link &&
-                    {class: 'align-center'},
+                  align && !link &&
+                    {class: 'align-' + align},
 
                   pixelate &&
                     {class: 'pixelate'});
@@ -373,8 +391,8 @@ export default {
                     {href: link},
                     {target: '_blank'},
 
-                    align === 'center' &&
-                      {class: 'align-center'},
+                    align &&
+                      {class: 'align-' + align},
 
                     {title:
                       language.encapsulate('misc.external.opensInNewTab', capsule =>
@@ -424,8 +442,8 @@ export default {
               inline: false,
               data:
                 html.tag('div', {class: 'content-image-container'},
-                  align === 'center' &&
-                    {class: 'align-center'},
+                  align &&
+                    {class: 'align-' + align},
 
                   image),
             };
@@ -437,22 +455,31 @@ export default {
                 ? to('media.path', node.src.slice('media/'.length))
                 : node.src);
 
-            const {width, height, align, pixelate} = node;
+            const {width, height, align, inline, pixelate} = node;
 
-            const content =
-              html.tag('div', {class: 'content-video-container'},
-                align === 'center' &&
-                  {class: 'align-center'},
+            const video =
+              html.tag('video',
+                src && {src},
+                width && {width},
+                height && {height},
 
-                html.tag('video',
-                  src && {src},
-                  width && {width},
-                  height && {height},
+                {controls: true},
 
-                  {controls: true},
+                align && inline &&
+                  {class: 'align-' + align},
+
+                pixelate &&
+                  {class: 'pixelate'});
+
+            const content =
+              (inline
+                ? video
+                : html.tag('div', {class: 'content-video-container'},
+                    align &&
+                      {class: 'align-' + align},
+
+                    video));
 
-                  pixelate &&
-                    {class: 'pixelate'}));
 
             return {
               type: 'processed-video',
@@ -466,15 +493,14 @@ export default {
                 ? to('media.path', node.src.slice('media/'.length))
                 : node.src);
 
-            const {align, inline} = node;
+            const {align, inline, nameless} = node;
 
             const audio =
               html.tag('audio',
                 src && {src},
 
-                align === 'center' &&
-                inline &&
-                  {class: 'align-center'},
+                align && inline &&
+                  {class: 'align-' + align},
 
                 {controls: true});
 
@@ -482,13 +508,14 @@ export default {
               (inline
                 ? audio
                 : html.tag('div', {class: 'content-audio-container'},
-                    align === 'center' &&
-                      {class: 'align-center'},
+                    align &&
+                      {class: 'align-' + align},
 
                     [
-                      html.tag('a', {class: 'filename'},
-                        src && {href: src},
-                        language.sanitize(basename(node.src))),
+                      !nameless &&
+                        html.tag('a', {class: 'filename'},
+                          src && {href: src},
+                          language.sanitize(basename(node.src))),
 
                       audio,
                     ]));