« get me outta code hell

support albums without cover art - hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
diff options
context:
space:
mode:
author(quasar) nebula <qznebula@protonmail.com>2022-05-05 19:33:01 -0300
committer(quasar) nebula <qznebula@protonmail.com>2022-05-05 19:33:01 -0300
commit8fd50d6f0ba8dcfcfe34eb1321dc0bdd307b8c6a (patch)
treeb7bed8c523dcdfaa4eec7c89e311457400530807
parente943484cf46cfe509b8d68fada06a760ae05545f (diff)
support albums without cover art
-rw-r--r--src/data/things.js1
-rw-r--r--src/data/yaml.js1
-rw-r--r--src/misc-templates.js9
-rw-r--r--src/page/album.js6
-rw-r--r--src/page/track.js5
-rw-r--r--src/static/site.css31
-rw-r--r--src/strings-default.json3
-rwxr-xr-xsrc/upd8.js12
-rw-r--r--src/util/wiki-data.js13
9 files changed, 65 insertions, 16 deletions
diff --git a/src/data/things.js b/src/data/things.js
index 4cc5d06..b225143 100644
--- a/src/data/things.js
+++ b/src/data/things.js
@@ -474,6 +474,7 @@ Album.propertyDescriptors = {
         update: {validate: isDimensions}
     },
 
+    hasCoverArt: Thing.common.flag(true),
     hasTrackArt: Thing.common.flag(true),
     isMajorRelease: Thing.common.flag(false),
     isListedOnHomepage: Thing.common.flag(true),
diff --git a/src/data/yaml.js b/src/data/yaml.js
index fdb7d9c..2e0e985 100644
--- a/src/data/yaml.js
+++ b/src/data/yaml.js
@@ -219,6 +219,7 @@ export const processAlbumDocument = makeProcessDocument(Album, {
         coverArtDate: 'Cover Art Date',
         dateAddedToWiki: 'Date Added',
 
+        hasCoverArt: 'Has Cover Art',
         hasTrackArt: 'Has Track Art',
         isMajorRelease: 'Major Release',
         isListedOnHomepage: 'Listed on Homepage',
diff --git a/src/misc-templates.js b/src/misc-templates.js
index 306063b..995aaa2 100644
--- a/src/misc-templates.js
+++ b/src/misc-templates.js
@@ -277,6 +277,7 @@ export function getGridHTML({
     entries,
     srcFn,
     linkFn,
+    noSrcTextFn = () => '',
     altFn = () => '',
     detailsFn = null,
     lazy = true
@@ -291,7 +292,8 @@ export function getGridHTML({
                     thumb: 'small',
                     lazy: (typeof lazy === 'number' ? i >= lazy : lazy),
                     square: true,
-                    reveal: getRevealStringFromTags(item.artTags, {strings})
+                    reveal: getRevealStringFromTags(item.artTags, {strings}),
+                    noSrcText: noSrcTextFn(item)
                 })}
                 <span>${item.name}</span>
                 ${detailsFn && `<span>${detailsFn(item)}</span>`}
@@ -307,10 +309,13 @@ export function getAlbumGridHTML({
     return getGridHTML({
         srcFn: getAlbumCover,
         linkFn: link.album,
-        detailsFn: details && (album => strings('misc.albumGridDetails', {
+        detailsFn: details && (album => strings('misc.albumGrid.details', {
             tracks: strings.count.tracks(album.tracks.length, {unit: true}),
             time: strings.count.duration(getTotalDuration(album.tracks))
         })),
+        noSrcTextFn: album => strings('misc.albumGrid.noCoverArt', {
+            album: album.name
+        }),
         ...props
     });
 }
diff --git a/src/page/album.js b/src/page/album.js
index 70320b2..eac0a9f 100644
--- a/src/page/album.js
+++ b/src/page/album.js
@@ -118,6 +118,8 @@ export function write(album, {wikiData}) {
                 strings
             });
 
+            const cover = getAlbumCover(album);
+
             return {
                 title: strings('albumPage.title', {album: album.name}),
                 stylesheet: getAlbumStylesheet(album),
@@ -134,8 +136,8 @@ export function write(album, {wikiData}) {
 
                 main: {
                     content: fixWS`
-                        ${generateCoverLink({
-                            src: getAlbumCover(album),
+                        ${cover && generateCoverLink({
+                            src: cover,
                             alt: strings('misc.alt.albumCover'),
                             tags: album.artTags
                         })}
diff --git a/src/page/track.js b/src/page/track.js
index 17e7585..960f00c 100644
--- a/src/page/track.js
+++ b/src/page/track.js
@@ -138,6 +138,7 @@ export function write(track, {wikiData}) {
             to
         }) => {
             const generateTrackList = bindOpts(unbound_generateTrackList, {getArtistString, link, strings});
+            const cover = getTrackCover(track);
 
             return {
                 title: strings('trackPage.title', {track: track.name}),
@@ -160,8 +161,8 @@ export function write(track, {wikiData}) {
 
                 main: {
                     content: fixWS`
-                        ${generateCoverLink({
-                            src: getTrackCover(track),
+                        ${cover && generateCoverLink({
+                            src: cover,
                             alt: strings('misc.alt.trackCover'),
                             tags: track.artTags
                         })}
diff --git a/src/static/site.css b/src/static/site.css
index c88343e..5122f3f 100644
--- a/src/static/site.css
+++ b/src/static/site.css
@@ -439,6 +439,26 @@ footer > :last-child {
     overflow: hidden;
     width: 100%;
     height: 100%;
+    position: relative;
+}
+
+.image-text-area {
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 5px 15px;
+    background: rgba(0, 0, 0, 0.65);
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) inset;
+    line-height: 1.35em;
+    color: var(--primary-color);
+    font-style: oblique;
+    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.75);
 }
 
 img {
@@ -520,11 +540,18 @@ h1 {
     text-decoration: underline;
 }
 
-.grid-item > span:first-of-type {
-    margin-top: 0.45em;
+.grid-item > span {
     display: block;
 }
 
+.grid-item > span:not(:first-child) {
+    margin-top: 2px;
+}
+
+.grid-item > span:first-of-type {
+    margin-top: 6px;
+}
+
 .grid-item:hover > span:first-of-type {
     text-decoration: underline;
 }
diff --git a/src/strings-default.json b/src/strings-default.json
index 86fb73f..1fc6d8a 100644
--- a/src/strings-default.json
+++ b/src/strings-default.json
@@ -148,7 +148,8 @@
     "misc.jumpTo.withLinks": "Jump to: {LINKS}.",
     "misc.contentWarnings": "cw: {WARNINGS}",
     "misc.contentWarnings.reveal": "click to show",
-    "misc.albumGridDetails": "({TRACKS}, {TIME})",
+    "misc.albumGrid.details": "({TRACKS}, {TIME})",
+    "misc.albumGrid.noCoverArt": "{ALBUM}",
     "misc.uiLanguage": "UI Language: {LANGUAGES}",
     "homepage.title": "{TITLE}",
     "homepage.news.title": "News",
diff --git a/src/upd8.js b/src/upd8.js
index 1447118..13cf2e7 100755
--- a/src/upd8.js
+++ b/src/upd8.js
@@ -606,6 +606,7 @@ function stringifyThings(thingData) {
 function img({
     src,
     alt,
+    noSrcText = '',
     thumb: thumbKey,
     reveal,
     id,
@@ -620,7 +621,7 @@ function img({
     const willLink = typeof link === 'string' || link;
 
     const originalSrc = src;
-    const thumbSrc = thumbKey ? thumb[thumbKey](src) : src;
+    const thumbSrc = src && (thumbKey ? thumb[thumbKey](src) : src);
 
     const imgAttributes = html.attributes({
         id: link ? '' : id,
@@ -630,10 +631,13 @@ function img({
         height
     });
 
-    const nonlazyHTML = wrap(`<img src="${thumbSrc}" ${imgAttributes}>`);
-    const lazyHTML = lazy && wrap(`<img class="lazy" data-original="${thumbSrc}" ${imgAttributes}>`, true);
+    const noSrcHTML = !src && wrap(`<div class="image-text-area">${noSrcText}</div>`);
+    const nonlazyHTML = src && wrap(`<img src="${thumbSrc}" ${imgAttributes}>`);
+    const lazyHTML = src && lazy && wrap(`<img class="lazy" data-original="${thumbSrc}" ${imgAttributes}>`, true);
 
-    if (lazy) {
+    if (!src) {
+        return noSrcHTML;
+    } else if (lazy) {
         return fixWS`
             <noscript>${nonlazyHTML}</noscript>
             ${lazyHTML}
diff --git a/src/util/wiki-data.js b/src/util/wiki-data.js
index 545e21e..c0c6dc3 100644
--- a/src/util/wiki-data.js
+++ b/src/util/wiki-data.js
@@ -98,7 +98,12 @@ export function filterAlbumsByCommentary(albums) {
 }
 
 export function getAlbumCover(album, {to}) {
-    return to('media.albumCover', album.directory, album.coverArtFileExtension);
+    // Some albums don't have art! This function returns null in that case.
+    if (album.hasCoverArt) {
+        return to('media.albumCover', album.directory, album.coverArtFileExtension);
+    } else {
+        return null;
+    }
 }
 
 export function getAlbumListTag(album) {
@@ -155,8 +160,10 @@ export function getTotalDuration(tracks) {
 }
 
 export function getTrackCover(track, {to}) {
-    // Some al8ums don't have any track art at all, and in those, every track
-    // just inherits the al8um's own cover art.
+    // Some albums don't have any track art at all, and in those, every track
+    // just inherits the album's own cover art. Note that since cover art isn't
+    // guaranteed on albums either, it's possible that this function returns
+    // null!
     if (!track.hasCoverArt) {
         return getAlbumCover(track.album, {to});
     } else {