chore: cleanup

.eleventy.js

@@ -12,7 +12,7 @@ import filters from './config/filters/index.js'
 import { slugifyString } from './config/utils/index.js'
 import { svgToJpeg } from './config/events/index.js'
 import { minifyJsComponents } from './config/events/index.js'
-import { searchIndex, tagList, tagMap, postStats, tagsSortedByCount } from './config/collections/index.js'
+import { searchIndex, tagList, tagMap, postStats, tagsSortedByCount, artistsIndex, albumsIndex } from './config/collections/index.js'
 import { img } from './config/shortcodes/index.js'
 
 // load .env
@@ -93,6 +93,8 @@ export default async function (eleventyConfig) {
   eleventyConfig.addCollection('tagMap', tagMap)
   eleventyConfig.addCollection('postStats', postStats)
   eleventyConfig.addCollection('tagsSortedByCount', tagsSortedByCount)
+  eleventyConfig.addCollection('artistsIndex', artistsIndex)
+  eleventyConfig.addCollection('albumsIndex', albumsIndex)
 
   const md = markdownIt({ html: true, linkify: true })
   md.use(markdownItAnchor, {

_redirects

@@ -102,7 +102,7 @@ https://cdme.netlify.app https://coryd.dev 301!
 /follow.json https://feedpress.me/coryd-follow.json
 
 # media
-/media/* https://f001.backblazeb2.com/file/coryd-dev-images/:splat
+/media/* https://f001.backblazeb2.com/file/coryd-dev-images/:splat 200
 
 # analytics
 /23af0256fe76a.js http://static.getclicky.com/js?in=/2842c5ddc46e5 200

api/scrobble.js

@@ -1,7 +1,7 @@
 import { getStore } from '@netlify/blobs'
 import { DateTime } from 'luxon'
 
-const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '').replace(/A©|é/g, 'e');
+const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '')
 
 const weekKey = () => {
   const currentDate = DateTime.now();

config/collections/index.js

@@ -34,6 +34,10 @@ export const searchIndex = (collection) => {
   return searchIndex
 }
 
+export const artistsIndex = (collection) => collection.getAll()[0].data.musicCharts.year.artists
+
+export const albumsIndex = (collection) => collection.getAll()[0].data.musicCharts.year.albums
+
 export const tagList = (collection) => {
   const tagsSet = new Set()
   collection.getAll().forEach((item) => {

package-lock.json

@@ -43,6 +43,7 @@
         "markdown-it-footnote": "^4.0.0",
         "sanitize-html": "^2.13.0",
         "slugify": "^1.6.6",
+        "string-sanitizer": "^2.0.2",
         "terser": "^5.30.1",
         "writing-stats": "^1.0.6"
       }
@@ -6901,6 +6902,12 @@
         "safe-buffer": "~5.2.0"
       }
     },
+    "node_modules/string-sanitizer": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/string-sanitizer/-/string-sanitizer-2.0.2.tgz",
+      "integrity": "sha512-zECtWmUawolaVbUOdDRdhAM4jN7wl1sB4indjTmHpUFavzFSeYEDSVF85dZPPyDKoMRTJbrz+Tp0SjPPCWxscA==",
+      "dev": true
+    },
     "node_modules/strip-bom-string": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom-string/-/strip-bom-string-1.0.0.tgz",

package.json

@@ -53,6 +53,7 @@
     "markdown-it-footnote": "^4.0.0",
     "sanitize-html": "^2.13.0",
     "slugify": "^1.6.6",
+    "string-sanitizer": "^2.0.2",
     "terser": "^5.30.1",
     "writing-stats": "^1.0.6"
   }

src/_data/helpers/music.js

@@ -2,7 +2,7 @@ import artistCapitalizationPatches from '../json/artist-capitalization-patches.j
 
 export const artistCapitalization = (artist) => artistCapitalizationPatches[artist?.toLowerCase()] || artist
 
-const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '').replace(/A©|é/g, 'e');
+const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '')
 const artistSanitizedKey = (artist) => `${sanitizeMediaString(artist).replace(/\s+/g, '-').toLowerCase()}`
 const albumSanitizedKey = (album) => `${sanitizeMediaString(album).replace(/\s+/g, '-').toLowerCase()}-${sanitizeMediaString(album.replace(/[:\/\\,'']+/g
       , '').replace(/\s+/g, '-').toLowerCase())}`

src/_includes/partials/now/track-chart.liquid

@@ -1,5 +1,5 @@
 {% if data.size > 0 %}
-<div class="track__chart">
+<div class="music-chart">
   {% for item in data limit: 10 %}
   {%- assign percentage = item.plays | calculatePlayPercentage: mostPlayed -%}
   <div class="item">
@@ -7,7 +7,7 @@
       <div class="count">{{ forloop.index }}.</div>
       <div class="info">
         <div class="title">{{ item.title }}</div>
-        <div class="artists">
+        <div class="subtext">
           <a href="{{ item.url }}">{{ item.artist }}</a> • {{ item.plays }} plays
         </div>
       </div>

src/_includes/partials/now/tracks-recent.liquid

@@ -1,5 +1,5 @@
 {% if data.size > 0 %}
-<div class="track__chart">
+<div class="music-chart">
   {% for item in data limit: 10 %}
   {% capture alt %}{{ item.track }} by {{ item.track }}{% endcapture %}
     <div class="item">
@@ -7,7 +7,7 @@
         {% image item.image, alt, '', 'lazy' %}
         <div class="meta-text">
           <div class="title">{{ item.track }}</div>
-          <div class="artists">
+          <div class="subtext">
             <a href="{{ item.url }}">{{ item.artist }}</a>
           </div>
         </div>

src/_includes/partials/paginator.liquid

@@ -1,5 +1,5 @@
 <script type="module" src="/assets/scripts/components/select-pagination.js"></script>
-<nav aria-label="Blog pagination" class="pagination flex-centered">
+<nav aria-label="Pagination" class="pagination flex-centered">
   {% if pagination.href.previous %}
     <a href="{{ pagination.href.previous }}" aria-label="Previous page">
       {% tablericon "arrow-left" "Previous" %}

src/assets/styles/components/music-chart.css

@@ -1,4 +1,4 @@
-.track__chart {
+.music-chart {
   & .item {
     justify-content: space-between;
 
@@ -40,13 +40,13 @@
     }
 
     & .title,
-    & .artists {
+    & .subtext {
       white-space: nowrap;
       text-overflow: ellipsis;
       overflow: hidden;
     }
 
-    & .artists,
+    & .subtext,
     & .timestamp {
       font-size: var(--font-size-sm);
       line-height: var(--line-height-sm);
@@ -82,7 +82,7 @@
 }
 
 @media screen and (min-width: 768px) {
-  .track__chart .item .meta-text {
+  .music-chart .item .meta-text {
     max-width: 85%;
   }
 }

src/assets/styles/index.css

@@ -38,4 +38,4 @@
 @import url('./components/progress-bar.css') layer(components.media);
 @import url('./components/share-button.css') layer(components);
 @import url('./components/theme-toggle.css') layer(components);
-@import url('./components/track-chart.css') layer(components.media);
+@import url('./components/music-chart.css') layer(components.media);

src/posts/2024/building-a-scrobbler-using-plex-webhooks-edge-functions-and-blob-storage.md

@@ -16,7 +16,7 @@ What I've long wanted is something that sits on infrastructure I control, stores
 Next, I went to work developing the edge function that would receive and deal with the data. I'm leveraging `luxon` for dealing with dates and [Netlify Blobs](https://docs.netlify.com/blobs/overview/) for persistence. I have a few different helper functions on hand as well:
 
 ```javascript
-const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '').replace(/A©|é/g, 'e');
+const sanitizeMediaString = (string) => string.normalize('NFD').replace(/[\u0300-\u036f\u2010—\.\?\(\)\[\]\{\}]/g, '').replace(/\.{3}/g, '')
 
 const weekKey = () => {
   const currentDate = DateTime.now();