« get me outta code hell

hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/content/dependencies/generateContentContentHeading.js3
-rw-r--r--src/content/dependencies/generateCoverArtwork.js14
-rw-r--r--src/content/dependencies/generateCoverCarousel.js1
-rw-r--r--src/content/dependencies/generateCoverGrid.js1
-rw-r--r--src/content/dependencies/generatePageLayout.js11
-rw-r--r--src/content/dependencies/generateRelationsContentHeading.js3
-rw-r--r--src/content/dependencies/generateTrackInfoPage.js7
-rw-r--r--src/content/dependencies/image.js22
-rw-r--r--src/data/things/Track.js1
-rw-r--r--src/data/things/album/Album.js15
-rw-r--r--src/static/css/features.css19
-rw-r--r--src/static/css/miscellany.css21
-rw-r--r--src/static/css/page.css13
-rw-r--r--src/static/js/client/css-compatibility-assistant.js28
-rw-r--r--src/static/js/client/index.js2
-rw-r--r--src/strings-default.yaml3
16 files changed, 53 insertions, 111 deletions
diff --git a/src/content/dependencies/generateContentContentHeading.js b/src/content/dependencies/generateContentContentHeading.js
index 3281caba..b311890b 100644
--- a/src/content/dependencies/generateContentContentHeading.js
+++ b/src/content/dependencies/generateContentContentHeading.js
@@ -46,7 +46,8 @@ export default {
 
           const name =
             (data.nameStyle === 'utility' ||
-             data.nameStyle === 'unofficial'
+             data.nameStyle === 'unofficial' ||
+             data.nameStyle === 'unofficial localization'
               ? null
               : data.name);
 
diff --git a/src/content/dependencies/generateCoverArtwork.js b/src/content/dependencies/generateCoverArtwork.js
index 616b3c95..008af70d 100644
--- a/src/content/dependencies/generateCoverArtwork.js
+++ b/src/content/dependencies/generateCoverArtwork.js
@@ -31,9 +31,6 @@ export default {
     color:
       artwork.thing.color ?? null,
 
-    dimensions:
-      artwork.dimensions,
-
     style:
       artwork.style,
   }),
@@ -75,17 +72,6 @@ export default {
 
     image.setSlot('alt', slots.alt);
 
-    const square =
-      (data.dimensions
-        ? data.dimensions[0] === data.dimensions[1]
-        : true);
-
-    if (square) {
-      image.setSlot('square', true);
-    } else {
-      image.setSlot('dimensions', data.dimensions);
-    }
-
     const attributes = html.attributes();
 
     let color = null;
diff --git a/src/content/dependencies/generateCoverCarousel.js b/src/content/dependencies/generateCoverCarousel.js
index 1ffeff8e..8232a842 100644
--- a/src/content/dependencies/generateCoverCarousel.js
+++ b/src/content/dependencies/generateCoverCarousel.js
@@ -38,7 +38,6 @@ export default {
                   content:
                     image.slots({
                       thumb: 'small',
-                      square: true,
                       lazy:
                         (typeof slots.lazy === 'number'
                           ? index >= slots.lazy
diff --git a/src/content/dependencies/generateCoverGrid.js b/src/content/dependencies/generateCoverGrid.js
index 6f87b54c..b3cdac96 100644
--- a/src/content/dependencies/generateCoverGrid.js
+++ b/src/content/dependencies/generateCoverGrid.js
@@ -143,7 +143,6 @@ export default {
 
                 image.slots({
                   thumb: 'medium',
-                  square: true,
                   lazy:
                     (typeof slots.lazy === 'number'
                       ? index >= slots.lazy
diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js
index 00e6422b..e49075a1 100644
--- a/src/content/dependencies/generatePageLayout.js
+++ b/src/content/dependencies/generatePageLayout.js
@@ -307,15 +307,18 @@ export default {
             [language.onlyIfOptions]: ['title'],
           };
 
-          workingOptions.title = headingNamePart;
+          workingOptions.title =
+            html.tag('span', {class: 'title-part'},
+              headingNamePart);
 
           if (!html.isBlank(slots.titleDetail)) {
             workingCapsule += '.withDetail';
             workingOptions.detailAccent =
               html.tag('span', {class: 'name-detail'},
-                language.$(capsule, 'withDetail.accent', {
-                  detail: slots.titleDetail,
-                }));
+                html.metatag('chunkwrap', {split: ':'},
+                  language.$(capsule, 'withDetail.accent', {
+                    detail: slots.titleDetail,
+                  })));
           }
 
           return language.$(workingCapsule, workingOptions);
diff --git a/src/content/dependencies/generateRelationsContentHeading.js b/src/content/dependencies/generateRelationsContentHeading.js
index f4fd6ad4..60d90424 100644
--- a/src/content/dependencies/generateRelationsContentHeading.js
+++ b/src/content/dependencies/generateRelationsContentHeading.js
@@ -19,7 +19,8 @@ export default {
   generate(data, relations, slots, {html, language}) {
     const namePart =
       (data.nameStyle === 'utility' ||
-       data.nameStyle === 'unofficial'
+       data.nameStyle === 'unofficial' ||
+       data.nameStyle === 'unofficial localization'
         ? null
         : html.tag('i', data.name));
 
diff --git a/src/content/dependencies/generateTrackInfoPage.js b/src/content/dependencies/generateTrackInfoPage.js
index 08217561..ac96e072 100644
--- a/src/content/dependencies/generateTrackInfoPage.js
+++ b/src/content/dependencies/generateTrackInfoPage.js
@@ -194,6 +194,13 @@ export default {
                   name: data.name,
                 }))),
 
+          data.nameStyle === 'unofficial localization' &&
+            html.tag('p',
+              html.tag('i',
+                language.$('releaseInfo.unofficialLocalization', {
+                  name: data.name,
+                }))),
+
           relations.releaseInfo,
 
           html.tag('p',
diff --git a/src/content/dependencies/image.js b/src/content/dependencies/image.js
index af4b7fdd..4c945a20 100644
--- a/src/content/dependencies/image.js
+++ b/src/content/dependencies/image.js
@@ -19,11 +19,6 @@ export default {
             .filter(artTag => artTag.isContentWarning)
             .map(artTag => artTag.name)
         : null),
-
-    dimensions:
-      (artwork
-        ? artwork.dimensions
-        : null),
   }),
 
   slots: {
@@ -33,7 +28,6 @@ export default {
 
     reveal: {type: 'boolean', default: true},
     lazy: {type: 'boolean', default: false},
-    square: {type: 'boolean', default: false},
 
     link: {
       validate: v => v.anyOf(v.isBoolean, v.isString),
@@ -72,15 +66,15 @@ export default {
       mutable: false,
     },
 
+    dimensions: {
+      validate: v => v.isDimensions,
+    },
+
     // These will also be used from the artwork if not specified as slots.
 
     warnings: {
       validate: v => v.looseArrayOf(v.isString),
     },
-
-    dimensions: {
-      validate: v => v.isDimensions,
-    },
   },
 
   generate(data, relations, slots, {
@@ -123,7 +117,7 @@ export default {
       (typeof slots.link === 'string' || slots.link);
 
     const warnings = slots.warnings ?? data.warnings;
-    const dimensions = slots.dimensions ?? data.dimensions;
+    const dimensions = slots.dimensions;
 
     const willReveal =
       slots.reveal &&
@@ -352,16 +346,10 @@ export default {
 
       wrapped =
         html.tag('div', {class: 'image-outer-area'},
-          slots.square &&
-            {class: 'square-content'},
-
           wrapped);
 
       wrapped =
         html.tag('div', {class: 'image-container'},
-          slots.square &&
-            {class: 'square'},
-
           typeof slots.link === 'string' &&
             {class: 'no-image-preview'},
 
diff --git a/src/data/things/Track.js b/src/data/things/Track.js
index a368a15b..1fb2071f 100644
--- a/src/data/things/Track.js
+++ b/src/data/things/Track.js
@@ -152,6 +152,7 @@ export class Track extends Thing {
           'normal',
           'utility',
           'unofficial',
+          'unofficial localization',
         ])),
       }),
 
diff --git a/src/data/things/album/Album.js b/src/data/things/album/Album.js
index b89770aa..4f3dd770 100644
--- a/src/data/things/album/Album.js
+++ b/src/data/things/album/Album.js
@@ -285,7 +285,20 @@ export class Album extends Thing {
     showAlbumInTracksWithoutArtists: flag(V(false)),
     showTrackSectionInNavBar: flag(V(false)),
     showArtistsInTrackList: flag(V(true)),
-    hideDuration: flag(V(false)),
+
+    hideDuration: [
+      exposeUpdateValueOrContinue({
+        validate: input.value(isBoolean),
+      }),
+
+      {
+        dependencies: ['style'],
+        compute: ({style}) =>
+          (style === 'in-game vgm'
+            ? true
+            : false),
+      },
+    ],
 
     // > Update & expose - General metadata
 
diff --git a/src/static/css/features.css b/src/static/css/features.css
index f5842704..c25f669c 100644
--- a/src/static/css/features.css
+++ b/src/static/css/features.css
@@ -629,8 +629,7 @@
     border-radius: 0 0 4px 4px;
   }
 
-  .cover-artwork:has(.image-details),
-  .cover-artwork.has-image-details {
+  .cover-artwork:has(.image-details) {
     border-radius: 0 0 6px 6px;
   }
 
@@ -664,8 +663,7 @@
     border-color: var(--dim-color);
   }
 
-  .cover-artwork:not(:has(.image-details)),
-  .cover-artwork:not(.has-image-details) {
+  .cover-artwork:not(:has(.image-details)) {
     /* Hacky: `overflow: hidden` hides tag tooltips, so it can't be applied
      * if we've got tags/details visible. But it's okay, because we only
      * need to apply it if it *doesn't* - that's when the rounded border
@@ -1035,6 +1033,7 @@
 
   .grid-item .image-container {
     width: 100%;
+    aspect-ratio: 1 / 1;
   }
 
   .grid-item .image {
@@ -1316,11 +1315,6 @@
     overflow: hidden;
   }
 
-  .square .image-link {
-    width: 100%;
-    height: 100%;
-  }
-
   .image-inner-area {
     position: relative;
     width: 100%;
@@ -1340,11 +1334,6 @@
     object-fit: cover;
   }
 
-  .square .image {
-    width: 100%;
-    height: 100%;
-  }
-
   .image-link .image {
     display: block;
     max-width: 100%;
@@ -1633,7 +1622,7 @@
   }
 
   #image-overlay-image-layout {
-    display: block;
+    display: flex;
     position: relative;
     max-height: 100%;
     margin: 4px 3px;
diff --git a/src/static/css/miscellany.css b/src/static/css/miscellany.css
index 6f60767d..9eb44004 100644
--- a/src/static/css/miscellany.css
+++ b/src/static/css/miscellany.css
@@ -1,24 +1,3 @@
-/* Squares */
-
-@layer layout {
-  .square {
-    position: relative;
-    width: 100%;
-  }
-
-  .square::after {
-    content: "";
-    display: block;
-    padding-bottom: 100%;
-  }
-
-  .square-content {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-  }
-}
-
 /* Utility spans */
 
 @layer print {
diff --git a/src/static/css/page.css b/src/static/css/page.css
index 353ae873..8929dc72 100644
--- a/src/static/css/page.css
+++ b/src/static/css/page.css
@@ -810,12 +810,15 @@
 
   #content h1 {
     font-size: 1.5em;
-  }
 
-  #content h1 .name-detail {
-    opacity: 0.8;
-    margin-left: 0.5ch;
-    font-weight: inherit;
+    .title-part:has(+ .name-detail) {
+      margin-right: 0.5ch;
+    }
+
+    .name-detail {
+      opacity: 0.8;
+      font-weight: inherit;
+    }
   }
 
   #content li {
diff --git a/src/static/js/client/css-compatibility-assistant.js b/src/static/js/client/css-compatibility-assistant.js
deleted file mode 100644
index 37b0645a..00000000
--- a/src/static/js/client/css-compatibility-assistant.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import {stitchArrays} from '../../shared-util/sugar.js';
-
-export const info = {
-  id: 'cssCompatibilityAssistantInfo',
-
-  coverArtworks: null,
-  coverArtworkImageDetails: null,
-};
-
-export function getPageReferences() {
-  info.coverArtworks =
-    Array.from(document.querySelectorAll('.cover-artwork'));
-
-  info.coverArtworkImageDetails =
-    info.coverArtworks
-      .map(artwork => artwork.querySelector('.image-details'));
-}
-
-export function mutatePageContent() {
-  stitchArrays({
-    coverArtwork: info.coverArtworks,
-    imageDetails: info.coverArtworkImageDetails,
-  }).forEach(({coverArtwork, imageDetails}) => {
-      if (imageDetails) {
-        coverArtwork.classList.add('has-image-details');
-      }
-    });
-}
diff --git a/src/static/js/client/index.js b/src/static/js/client/index.js
index 6862b4ad..65254b10 100644
--- a/src/static/js/client/index.js
+++ b/src/static/js/client/index.js
@@ -6,7 +6,6 @@ import * as artTagGalleryFilterModule from './art-tag-gallery-filter.js';
 import * as artTagNetworkModule from './art-tag-network.js';
 import * as artistExternalLinkTooltipModule from './artist-external-link-tooltip.js';
 import * as artistRollingWindowModule from './artist-rolling-window.js';
-import * as cssCompatibilityAssistantModule from './css-compatibility-assistant.js';
 import * as datetimestampTooltipModule from './datetimestamp-tooltip.js';
 import * as draggedLinkModule from './dragged-link.js';
 import * as expandableGridSectionModule from './expandable-grid-section.js';
@@ -32,7 +31,6 @@ export const modules = [
   artTagNetworkModule,
   artistExternalLinkTooltipModule,
   artistRollingWindowModule,
-  cssCompatibilityAssistantModule,
   datetimestampTooltipModule,
   draggedLinkModule,
   expandableGridSectionModule,
diff --git a/src/strings-default.yaml b/src/strings-default.yaml
index ee7dff25..cadd2f02 100644
--- a/src/strings-default.yaml
+++ b/src/strings-default.yaml
@@ -302,6 +302,9 @@ releaseInfo:
   unofficialName: >-
     "{NAME}" is marked, on this wiki, as an unofficial name.
 
+  unofficialLocalization: >-
+    "{NAME}" is marked, on this wiki, as an unofficial localization.
+
   duration: "Duration: {DURATION}."
 
   contributors: "Contributors:"
generated by cgit-pink 1.3.0-6-gf8a5 (git 2.35.1) at 2026-06-08 00:33:56 +0000