content: generateAlbumSidebar: move track sections into own function

For cleaner dependencies and finer-grained refreshing.

1 files changed, 12 insertions, 111 deletions

diff --git a/src/content/dependencies/generateAlbumSidebar.js b/src/content/dependencies/generateAlbumSidebar.js
index 36785f23..ab659b99 100644
--- a/src/content/dependencies/generateAlbumSidebar.js
+++ b/src/content/dependencies/generateAlbumSidebar.js
@@ -1,139 +1,40 @@
 export default {
   contentDependencies: [
     'generateAlbumSidebarGroupBox',
+    'generateAlbumSidebarTrackSection',
     'linkAlbum',
-    'linkTrack',
   ],
 
-  extraDependencies: [
-    'getColors',
-    'html',
-    'language',
-  ],
+  extraDependencies: ['html'],
+
 
-  relations(relation, album, _track) {
+  relations(relation, album, track) {
     const relations = {};
 
     relations.albumLink =
       relation('linkAlbum', album);
 
-    relations.trackLinks =
-      album.trackSections.map(trackSection =>
-        trackSection.tracks.map(track =>
-          relation('linkTrack', track)));
-
     relations.groupBoxes =
       album.groups.map(group =>
         relation('generateAlbumSidebarGroupBox', album, group));
 
+    relations.trackSections =
+      album.trackSections.map(trackSection =>
+        relation('generateAlbumSidebarTrackSection', album, track, trackSection));
+
     return relations;
   },
 
   data(album, track) {
-    const data = {};
-
-    data.isAlbumPage = !track;
-    data.isTrackPage = !!track;
-
-    data.hasTrackNumbers = album.hasTrackNumbers;
-
-    data.trackSectionInfo =
-      album.trackSections.map(trackSection => ({
-        name: trackSection.name,
-        color: trackSection.color,
-        isDefaultTrackSection: trackSection.isDefaultTrackSection,
-
-        firstTrackNumber: trackSection.startIndex + 1,
-        lastTrackNumber: trackSection.startIndex + trackSection.tracks.length,
-
-        includesCurrentTrack: track && trackSection.tracks.includes(track),
-        currentTrackIndex: trackSection.tracks.indexOf(track),
-      }));
-
-    return data;
+    return {isAlbumPage: !track};
   },
 
-  generate(data, relations, {
-    getColors,
-    html,
-    language,
-  }) {
-    const {isTrackPage, isAlbumPage} = data;
+  generate(data, relations, {html}) {
+    const {isAlbumPage} = data;
 
     const trackListPart = html.tags([
       html.tag('h1', relations.albumLink),
-      data.trackSectionInfo.map(
-        ({
-          name,
-          color,
-          isDefaultTrackSection,
-
-          firstTrackNumber,
-          lastTrackNumber,
-
-          includesCurrentTrack,
-          currentTrackIndex,
-        }, index) => {
-          const trackLinks = relations.trackLinks[index];
-
-          const sectionName =
-            html.tag('span', {class: 'group-name'},
-              (isDefaultTrackSection
-                ? language.$('albumSidebar.trackList.fallbackSectionName')
-                : name));
-
-          let style;
-          if (color) {
-            const {primary} = getColors(color);
-            style = `--primary-color: ${primary}`;
-          }
-
-          const trackListItems =
-            trackLinks.map((trackLink, index) =>
-              html.tag('li',
-                {
-                  class:
-                    includesCurrentTrack &&
-                    index === currentTrackIndex &&
-                    'current',
-                },
-                language.$('albumSidebar.trackList.item', {
-                  track: trackLink,
-                })));
-
-          return html.tag('details',
-            {
-              class: includesCurrentTrack && 'current',
-
-              open: (
-                // Leave sidebar track sections collapsed on album info page,
-                // since there's already a view of the full track listing
-                // in the main content area.
-                isTrackPage &&
-
-                // Only expand the track section which includes the track
-                // currently being viewed by default.
-                includesCurrentTrack),
-            },
-            [
-              html.tag('summary', {style},
-                html.tag('span',
-                  (data.hasTrackNumbers
-                    ? language.$('albumSidebar.trackList.group.withRange', {
-                        group: sectionName,
-                        range: `${firstTrackNumber}–${lastTrackNumber}`
-                      })
-                    : language.$('albumSidebar.trackList.group', {
-                        group: sectionName,
-                      })))),
-
-              (data.hasTrackNumbers
-                ? html.tag('ol',
-                    {start: firstTrackNumber},
-                    trackListItems)
-                : html.tag('ul', trackListItems)),
-            ]);
-        }),
+      relations.trackSections,
     ]);
 
     if (isAlbumPage) {