From 0b793af465849d4ade5f4793b3a8b80d4b6ea7cb Mon Sep 17 00:00:00 2001
From: "(quasar) nebula" <qznebula@protonmail.com>
Date: Mon, 5 Jun 2023 18:02:50 -0300
Subject: content: generateAlbumGalleryPage

---
 .../dependencies/generateAlbumGalleryInfoLine.js   |  38 +++++++
 .../dependencies/generateAlbumGalleryPage.js       | 120 +++++++++++++++++++++
 src/page/album.js                                  |   2 +-
 3 files changed, 159 insertions(+), 1 deletion(-)
 create mode 100644 src/content/dependencies/generateAlbumGalleryInfoLine.js
 create mode 100644 src/content/dependencies/generateAlbumGalleryPage.js

diff --git a/src/content/dependencies/generateAlbumGalleryInfoLine.js b/src/content/dependencies/generateAlbumGalleryInfoLine.js
new file mode 100644
index 00000000..d4bd4d75
--- /dev/null
+++ b/src/content/dependencies/generateAlbumGalleryInfoLine.js
@@ -0,0 +1,38 @@
+import {getTotalDuration} from '../../util/wiki-data.js';
+
+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.infoLine'];
+    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.join('.'), options)));
+  },
+};
diff --git a/src/content/dependencies/generateAlbumGalleryPage.js b/src/content/dependencies/generateAlbumGalleryPage.js
new file mode 100644
index 00000000..354c8401
--- /dev/null
+++ b/src/content/dependencies/generateAlbumGalleryPage.js
@@ -0,0 +1,120 @@
+export default {
+  contentDependencies: [
+    'generateAlbumGalleryInfoLine',
+    'generateAlbumNavAccent',
+    'generateAlbumStyleRules',
+    'generateColorStyleRules',
+    'generateCoverGrid',
+    'generatePageLayout',
+    'image',
+    'linkAlbum',
+    'linkTrack',
+  ],
+
+  extraDependencies: ['html', 'language'],
+
+  relations(relation, album) {
+    const relations = {};
+
+    relations.layout =
+      relation('generatePageLayout');
+
+    relations.albumStyleRules =
+      relation('generateAlbumStyleRules', album);
+
+    relations.colorStyleRules =
+      relation('generateColorStyleRules', album.color);
+
+    relations.albumLink =
+      relation('linkAlbum', album);
+
+    relations.albumNavAccent =
+      relation('generateAlbumNavAccent', album, null);
+
+    relations.infoLine =
+      relation('generateAlbumGalleryInfoLine', album);
+
+    relations.coverGrid =
+      relation('generateCoverGrid');
+
+    relations.links =
+      album.tracks.map(track =>
+        relation('linkTrack', track));
+
+    relations.images =
+      album.tracks.map(track =>
+        (track.hasUniqueCoverArt
+          ? relation('image', track.artTags)
+          : relation('image')));
+
+    return relations;
+  },
+
+  data(album) {
+    const data = {};
+
+    data.name = album.name;
+
+    data.names =
+      album.tracks.map(track => track.name);
+
+    data.paths =
+      album.tracks.map(track =>
+        (track.hasUniqueCoverArt
+          ? ['media.trackCover', track.album.directory, track.directory, track.coverArtFileExtension]
+          : null));
+
+    return data;
+  },
+
+  generate(data, relations, {language}) {
+    return relations.layout
+      .slots({
+        title:
+          language.$('albumGalleryPage.title', {
+            album: data.name,
+          }),
+
+        headingMode: 'static',
+
+        colorStyleRules: [relations.colorStyleRules],
+        additionalStyleRules: [relations.albumStyleRules],
+
+        mainClasses: ['top-index'],
+        mainContent: [
+          relations.infoLine,
+
+          relations.coverGrid
+            .slots({
+              links: relations.links,
+              names: data.names,
+              images:
+                relations.images.map((image, i) =>
+                  image.slots({
+                    path: data.paths[i],
+                    missingSourceContent:
+                      language.$('misc.albumGalleryGrid.noCoverArt', {
+                        name: data.names[i],
+                      }),
+                  })),
+            }),
+        ],
+
+        navLinkStyle: 'hierarchical',
+        navLinks: [
+          {auto: 'home'},
+          {
+            html:
+              relations.albumLink
+                .slot('attributes', {class: 'current'}),
+            accent:
+              relations.albumNavAccent.slots({
+                showTrackNavigation: false,
+                showExtraLinks: true,
+                currentExtra: 'gallery',
+              }),
+          },
+        ],
+      });
+  },
+};
diff --git a/src/page/album.js b/src/page/album.js
index 111cab82..390a57c2 100644
--- a/src/page/album.js
+++ b/src/page/album.js
@@ -21,7 +21,6 @@ export function pathsForTarget(album) {
       },
     },
 
-    /*
     hasGalleryPage && {
       type: 'page',
       path: ['albumGallery', album.directory],
@@ -32,6 +31,7 @@ export function pathsForTarget(album) {
       },
     },
 
+    /*
     hasCommentaryPage && {
       type: 'page',
       path: ['albumCommentary', album.directory],
-- 
cgit 1.3.0-6-gf8a5