content: generate{Album,Track,}ReferencingArtworksPage

4 files changed, 249 insertions, 1 deletions

diff --git a/src/content/dependencies/generateAlbumReferencingArtworksPage.js b/src/content/dependencies/generateAlbumReferencingArtworksPage.js
new file mode 100644
index 00000000..8f2349f9
--- /dev/null
+++ b/src/content/dependencies/generateAlbumReferencingArtworksPage.js
@@ -0,0 +1,68 @@
+export default {
+  contentDependencies: [
+    'generateAlbumCoverArtwork',
+    'generateAlbumStyleRules',
+    'generateBackToAlbumLink',
+    'generateReferencingArtworksPage',
+    'linkAlbum',
+  ],
+
+  extraDependencies: ['html', 'language'],
+
+  relations: (relation, album) => ({
+    page:
+      relation('generateReferencingArtworksPage', album.referencedByArtworks),
+
+    albumStyleRules:
+      relation('generateAlbumStyleRules', album, null),
+
+    albumLink:
+      relation('linkAlbum', album),
+
+    backToAlbumLink:
+      relation('generateBackToAlbumLink', album),
+
+    cover:
+      relation('generateAlbumCoverArtwork', album),
+  }),
+
+  data: (album) => ({
+    name:
+      album.name,
+
+    color:
+      album.color,
+  }),
+
+  generate: (data, relations, {html, language}) =>
+    relations.page.slots({
+      title:
+        language.$('albumPage.title', {
+          album:
+            data.name,
+        }),
+
+      color: data.color,
+      styleRules: [relations.albumStyleRules],
+
+      cover: relations.cover,
+
+      navLinks: [
+        {auto: 'home'},
+
+        {
+          html:
+            relations.albumLink
+              .slot('attributes', {class: 'current'}),
+
+          accent:
+            html.tag('a', {href: ''},
+              {class: 'current'},
+
+              language.$('referencingArtworksPage.subtitle')),
+        },
+      ],
+
+      navBottomRowContent: relations.backToAlbumLink,
+    }),
+};
diff --git a/src/content/dependencies/generateReferencingArtworksPage.js b/src/content/dependencies/generateReferencingArtworksPage.js
new file mode 100644
index 00000000..468d5f78
--- /dev/null
+++ b/src/content/dependencies/generateReferencingArtworksPage.js
@@ -0,0 +1,121 @@
+import {stitchArrays} from '#sugar';
+
+export default {
+  contentDependencies: [
+    'generateCoverGrid',
+    'generatePageLayout',
+    'image',
+    'linkAlbum',
+    'linkTrack',
+  ],
+
+  extraDependencies: ['html', 'language'],
+
+  relations: (relation, referencedArtworks) => ({
+    layout:
+      relation('generatePageLayout'),
+
+    coverGrid:
+      relation('generateCoverGrid'),
+
+    links:
+      referencedArtworks.map(({thing}) =>
+        (thing.album
+          ? relation('linkTrack', thing)
+          : relation('linkAlbum', thing))),
+
+    images:
+      referencedArtworks.map(({thing}) =>
+        relation('image', thing.artTags)),
+  }),
+
+  data: (referencedArtworks) => ({
+    count:
+      referencedArtworks.length,
+
+    names:
+      referencedArtworks
+        .map(({thing}) => thing.name),
+
+    paths:
+      referencedArtworks
+        .map(({thing}) =>
+          (thing.album
+            ? ['media.trackCover', thing.album.directory, thing.directory, thing.coverArtFileExtension]
+            : ['media.albumCover', thing.directory, thing.coverArtFileExtension])),
+
+    dimensions:
+      referencedArtworks
+        .map(({thing}) => thing.coverArtDimensions),
+
+    coverArtistNames:
+      referencedArtworks
+        .map(({thing}) =>
+          thing.coverArtistContribs
+            .map(contrib => contrib.artist.name)),
+  }),
+
+  slots: {
+    color: {validate: v => v.isColor},
+
+    styleRules: {type: 'html', mutable: false},
+
+    title: {type: 'html', mutable: false},
+    cover: {type: 'html', mutable: true},
+
+    navLinks: {validate: v => v.isArray},
+    navBottomRowContent: {type: 'html', mutable: false},
+  },
+
+  generate: (data, relations, slots, {html, language}) =>
+    language.encapsulate('referencingArtworksPage', pageCapsule =>
+      relations.layout.slots({
+        title: slots.title,
+        subtitle: language.$(pageCapsule, 'subtitle'),
+
+        color: slots.color,
+        styleRules: slots.styleRules,
+
+        cover:
+          slots.cover
+            .slot('mode', 'primary-artists'),
+
+        mainClasses: ['top-index'],
+        mainContent: [
+          html.tag('p', {class: 'quick-info'},
+            language.$(pageCapsule, 'statsLine', {
+              artworks:
+                language.countArtworks(data.count, {
+                  unit: true,
+                }),
+            })),
+
+          relations.coverGrid.slots({
+            links: relations.links,
+            names: data.names,
+
+            images:
+              stitchArrays({
+                image: relations.images,
+                path: data.paths,
+                dimensions: data.dimensions,
+              }).map(({image, path, dimensions}) =>
+                  image.slots({
+                    path,
+                    dimensions,
+                  })),
+
+            info:
+              data.coverArtistNames.map(names =>
+                language.$('misc.coverGrid.details.coverArtists', {
+                  artists:
+                    language.formatUnitList(names),
+                })),
+          }),
+        ],
+
+        navLinkStyle: 'hierarchical',
+        navLinks: slots.navLinks,
+        navBottomRowContent: slots.navBottomRowContent,
+      })),
+};
diff --git a/src/content/dependencies/generateTrackNavLinks.js b/src/content/dependencies/generateTrackNavLinks.js
index 2d4ad378..e01653f0 100644
--- a/src/content/dependencies/generateTrackNavLinks.js
+++ b/src/content/dependencies/generateTrackNavLinks.js
@@ -20,7 +20,7 @@ export default {
 
   slots: {
     currentExtra: {
-      validate: v => v.is('referenced-art'),
+      validate: v => v.is('referenced-art', 'referencing-art'),
     },
   },
 
@@ -56,6 +56,8 @@ export default {
 
             (slots.currentExtra === 'referenced-art'
               ? language.$('referencedArtworksPage.subtitle')
+           : slots.currentExtra === 'referencing-art'
+              ? language.$('referencingArtworksPage.subtitle')
               : null)),
       },
     ]),
diff --git a/src/content/dependencies/generateTrackReferencingArtworksPage.js b/src/content/dependencies/generateTrackReferencingArtworksPage.js
new file mode 100644
index 00000000..097ee929
--- /dev/null
+++ b/src/content/dependencies/generateTrackReferencingArtworksPage.js
@@ -0,0 +1,57 @@
+export default {
+  contentDependencies: [
+    'generateAlbumStyleRules',
+    'generateBackToTrackLink',
+    'generateReferencingArtworksPage',
+    'generateTrackCoverArtwork',
+    'generateTrackNavLinks',
+  ],
+
+  extraDependencies: ['html', 'language'],
+
+  relations: (relation, track) => ({
+    page:
+      relation('generateReferencingArtworksPage', track.referencedByArtworks),
+
+    albumStyleRules:
+      relation('generateAlbumStyleRules', track.album, track),
+
+    navLinks:
+      relation('generateTrackNavLinks', track),
+
+    backToTrackLink:
+      relation('generateBackToTrackLink', track),
+
+    cover:
+      relation('generateTrackCoverArtwork', track),
+  }),
+
+  data: (track) => ({
+    name:
+      track.name,
+
+    color:
+      track.color,
+  }),
+
+  generate: (data, relations, {html, language}) =>
+    relations.page.slots({
+      title:
+        language.$('trackPage.title', {
+          track:
+            data.name,
+        }),
+
+      color: data.color,
+      styleRules: [relations.albumStyleRules],
+
+      cover: relations.cover,
+
+      navLinks:
+        html.resolve(
+          relations.navLinks
+            .slot('currentExtra', 'referencing-art')),
+
+      navBottomRowContent: relations.backToTrackLink,
+    }),
+};