content: generateAlbumSidebar: move group boxes into own function

This will make for cleaner dependencies and finer-grained refreshing.

1 files changed, 82 insertions, 0 deletions

diff --git a/src/content/dependencies/generateAlbumSidebarGroupBox.js b/src/content/dependencies/generateAlbumSidebarGroupBox.js
new file mode 100644
index 0000000..0679e8f
--- /dev/null
+++ b/src/content/dependencies/generateAlbumSidebarGroupBox.js
@@ -0,0 +1,82 @@
+import {empty} from '../../util/sugar.js';
+
+export default {
+  contentDependencies: ['linkAlbum', 'linkExternal', 'linkGroup'],
+  extraDependencies: ['html', 'language', 'transformMultiline'],
+
+  relations(relation, album, group) {
+    const relations = {};
+
+    relations.groupLink =
+      relation('linkGroup', group);
+
+    relations.externalLinks =
+      group.urls.map(url =>
+        relation('linkExternal', url));
+
+    const albums = group.albums.filter(album => album.date);
+    const index = albums.indexOf(album);
+    const previousAlbum = (index > 0) && albums[index - 1];
+    const nextAlbum = (index < albums.length - 1) && albums[index + 1];
+
+    if (previousAlbum) {
+      relations.previousAlbumLink =
+        relation('linkAlbum', previousAlbum);
+    }
+
+    if (nextAlbum) {
+      relations.nextAlbumLink =
+        relation('linkAlbum', nextAlbum);
+    }
+
+    return relations;
+  },
+
+  data(album, group) {
+    return {
+      description: group.descriptionShort,
+    };
+  },
+
+  generate(data, relations, {html, language, transformMultiline}) {
+    return html.template({
+      annotation: `generateAlbumSidebarGroupBox`,
+
+      slots: {
+        isAlbumPage: {type: 'boolean', default: false},
+      },
+
+      content(slots) {
+        return html.tags([
+          html.tag('h1',
+            language.$('albumSidebar.groupBox.title', {
+              group: relations.groupLink,
+            })),
+
+          slots.isAlbumPage &&
+            transformMultiline(data.description),
+
+          !empty(relations.externalLinks) &&
+            html.tag('p',
+              language.$('releaseInfo.visitOn', {
+                links: language.formatDisjunctionList(relations.externalLinks),
+              })),
+
+          slots.isAlbumPage &&
+          relations.nextAlbumLink &&
+            html.tag('p', {class: 'group-chronology-link'},
+              language.$('albumSidebar.groupBox.next', {
+                album: relations.nextAlbumLink,
+              })),
+
+          slots.isAlbumPage &&
+          relations.previousAlbumLink &&
+            html.tag('p', {class: 'group-chronology-link'},
+              language.$('albumSidebar.groupBox.previous', {
+                album: relations.previousAlbumLink,
+              })),
+        ]);
+      },
+    });
+  },
+};