chore: schemas, styles, cleanup

.eleventy.js

@@ -75,6 +75,7 @@ export default async function (eleventyConfig) {
   })
 
   eleventyConfig.addShortcode('appVersion', () => appVersion)
+  eleventyConfig.addShortcode('isProduction', () => process.env.ELEVENTY_PRODUCTION)
 
   // events
   if (process.env.ELEVENTY_PRODUCTION) eleventyConfig.on('afterBuild', copyErrorPages)

config/filters/media.js

@@ -1,11 +1,10 @@
 export default {
-  bookStatus: (books, status) => books.filter(book => book['status'] === status),
+  filterBooksByStatus: (books, status) => books.filter(book => book['status'] === status),
-  bookFavorites: (books) => books.filter(book => book.favorite === true),
+  findFavoriteBooks: (books) => books.filter(book => book['favorite'] === true),
   bookYearLinks: (years) => years
-      .sort((a, b) => b.value - a.value)
+      .sort((a, b) => b['value'] - a['value'])
-      .map((year, index) => `<a href="/books/years/${year.value}">${year.value}</a>${index < years.length - 1 ? ' / ' : ''}`)
+      .map((year, index) => `<a href="/books/years/${year['value']}">${year['value']}</a>${index < years.length - 1 ? ' / ' : ''}`)
       .join(''),
-  bookFinishedYear: (books, year) => books.filter(book => book.status === 'finished' && parseInt(book.year) === parseInt(year)),
   mediaLinks: (data, type, count = 10) => {
     if (!data || !type) return ''
 

src/assets/scripts/index.js

@@ -42,9 +42,7 @@ window.addEventListener('load', () => {
     const checkModals = () => {
       let isAnyModalOpen = false
       modalInputs.forEach((modalInput) => {
-        if (modalInput.checked) {
+        if (modalInput.checked) isAnyModalOpen = true
-          isAnyModalOpen = true
-        }
       })
       toggleBodyScroll(isAnyModalOpen)
     }
@@ -56,9 +54,7 @@ window.addEventListener('load', () => {
     document.addEventListener('keydown', (e) => {
       if (e.key === 'Escape') {
         modalInputs.forEach((modalInput) => {
-          if (modalInput.checked) {
+          if (modalInput.checked) modalInput.checked = false
-            modalInput.checked = false
-          }
         })
         toggleBodyScroll(false)
       }

src/assets/styles/components/badge-grid.css

@@ -1,10 +1,10 @@
 .badge-grid {
   display: grid;
   gap: var(--spacing-md);
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-columns: var(--grid-columns-three);
 
   @media screen and (min-width: 768px) {
-    grid-template-columns: repeat(4, 1fr);
+    grid-template-columns: var(--grid-columns-four);
   }
 
   & > * {

src/assets/styles/components/forms.css

@@ -35,6 +35,35 @@ select {
   padding: var(--spacing-xs) var(--spacing-sm);
 }
 
+fieldset {
+  border: var(--border-gray);
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-sm);
+
+  @media screen and (min-width: 768px) {
+    flex-direction: row;
+    gap: var(--spacing-lg);
+  }
+
+  & label {
+    display: flex;
+    align-items: center;
+    gap: var(--sizing-xs);
+  }
+
+  & input[type="checkbox"] {
+    margin: 0;
+  }
+
+  & legend {
+    color: var(--text-color-inverted);
+    background-color: var(--accent-color);
+    padding: var(--spacing-xs);
+    border-radius: var(--border-radius-slight);
+  }
+}
+
 .search__form {
   margin-top: 0;
 
@@ -52,6 +81,11 @@ select {
   & li {
     margin: var(--spacing-sm) 0;
 
+    &:not(:last-child) {
+      margin-bottom: var(--sizing-base);
+      border-bottom: var(--border-gray);
+    }
+
     & a {
       text-decoration: none;
     }

src/assets/styles/components/media-grid.css

@@ -10,18 +10,21 @@
     margin-top: var(--spacing-base);
   }
 
+  :is(&.poster, &.square, &.vertical) img {
+    border-radius: var(--border-radius-slight);
+    width: 100%;
+  }
+
+  :is(&.poster, &.vertical) img {
+    height: auto;
+  }
+
   &.poster {
     grid-template-columns: var(--grid-poster);
 
     & a {
       aspect-ratio: var(--aspect-ratio-banner);
     }
-
-    & img {
-      border-radius: var(--border-radius-slight);
-      width: 100%;
-      height: auto;
-    }
   }
 
   &.square {
@@ -32,9 +35,7 @@
     }
 
     & img {
-      width: 100%;
       height: 100%;
-      border-radius: var(--border-radius-slight);
     }
   }
 
@@ -44,12 +45,6 @@
     & a {
       aspect-ratio: var(--aspect-ratio-vertical);
     }
-
-    & img {
-      width: 100%;
-      height: auto;
-      border-radius: var(--border-radius-slight);
-    }
   }
 
   & .item {

src/data/books.js

@@ -42,8 +42,19 @@ const sortBooksByYear = (books) => {
   return Object.values(years).filter(year => year['value'] > 2017)
 }
 
+const currentYear = new Date().getFullYear()
+
 export default async function () {
   const books = await fetchAllBooks()
+  const sortedByYear = sortBooksByYear(books)
+  const booksForCurrentYear = sortedByYear.find(
+    yearGroup => yearGroup.value === currentYear
+  )?.data || []
 
-  return { all: books, years: sortBooksByYear(books), feed: books.filter(book => book['feed']) }
+  return {
+    all: books,
+    years: sortedByYear,
+    currentYear: booksForCurrentYear,
+    feed: books.filter(book => book['feed'])
+  }
 }

src/includes/base.liquid

@@ -70,10 +70,10 @@
     {%- assign featuredShow = tv.favorites | shuffleArray | first -%}
     {%- assign ogImage = globals.cdn_url | append: featuredShow.grid.backdrop -%}
   {%- when 'books' -%}
-    {%- assign featuredBook = books.all | bookStatus: 'started' | reverse | first -%}
+    {%- assign featuredBook = books.all | filterBooksByStatus: 'started' | reverse | first -%}
     {%- assign ogImage = globals.cdn_url | append: featuredBook.grid.image -%}
   {%- when 'books-year' -%}
-    {%- assign featuredBook = books.all | bookStatus: 'finished' | bookFinishedYear: year.value | first -%}
+    {%- assign featuredBook = books.currentYear | first -%}
     {%- assign ogImage = globals.cdn_url | append: featuredBook.grid.image -%}
   {%- when 'book' -%}
     {%- assign ogImage = globals.cdn_url | append: book.grid.image -%}
@@ -117,8 +117,10 @@
     <link rel="alternate" href="https://coryd.dev/feeds/album-releases" title="Album releases / {{ globals.site_name }}" type="application/rss+xml">
     <link rel="alternate" href="https://coryd.dev/feeds/all" title="All activity / {{ globals.site_name }}" type="application/rss+xml">
     <script defer src="/assets/scripts/index.js?v={% appVersion %}"></script>
-    <script defer data-domain="coryd.dev" src="/js/script.js"></script>
+    {%- if isProduction -%}
-    <script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>
+      <script defer data-domain="coryd.dev" src="/js/script.js"></script>
+      <script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>
+    {%- endif -%}
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",

src/includes/partials/home/intro.liquid

@@ -1,4 +1,6 @@
 <article>
   {{ intro }}
-  {% render "partials/blocks/now-playing.liquid", nowPlaying:nowPlaying %}
+  {%- if isProduction -%}
+    {% render "partials/blocks/now-playing.liquid", nowPlaying:nowPlaying %}
+  {%- endif -%}
 </article>

src/includes/partials/home/recent-activity.liquid

@@ -2,7 +2,7 @@
 {%- assign track = music.week.tracks | first -%}
 {%- assign show = tv.recentlyWatched | first -%}
 {%- assign movie = movies.recentlyWatched | first -%}
-{%- assign book = books | bookFinishedYear: currentYear | first -%}
+{%- assign book = books | first -%}
 {%- assign link = links | first -%}
 <article>
   <h2>

src/pages/dynamic/books/index.html

@@ -7,8 +7,8 @@ updated: "now"
 schema: books
 ---
 {%- assign currentYear = 'now' | date: "%Y" -%}
-{%- assign bookData = books.all | bookStatus: 'started' | reverse -%}
+{%- assign bookData = books.all | filterBooksByStatus: 'started' | reverse -%}
-{%- assign currentBookCount = books.all | bookFinishedYear: currentYear | size -%}
+{%- assign currentBookCount = books.currentYear | size -%}
 <h2>Currently reading</h2>
 <p>Here's what I'm reading at the moment. I've finished <strong class="highlight-text">{{ currentBookCount }} books</strong> this year.</p>
 <p>{{ books.years | bookYearLinks }}</p>

src/pages/dynamic/books/year.html

@@ -7,8 +7,8 @@ pagination:
 permalink: "/books/years/{{ year.value }}.html"
 schema: books-year
 ---
-{%- assign bookData = year.data | bookStatus: 'finished' -%}
+{%- assign bookData = year.data | filterBooksByStatus: 'finished' -%}
-{%- assign bookDataFavorites = bookData | bookFavorites -%}
+{%- assign bookDataFavorites = bookData | findFavoriteBooks -%}
 {%- capture favoriteBooks -%}{{ bookDataFavorites | shuffleArray | mediaLinks: "book", 5 }}{%- endcapture -%}
 {%- assign currentYear = 'now' | date: "%Y" -%}
 {%- assign yearString = year.value | append: '' -%}

src/pages/dynamic/index.html

@@ -3,5 +3,5 @@ layout: default
 permalink: /
 ---
 {% render "partials/home/intro.liquid" intro:globals.intro, nowPlaying:nowPlaying.content %}
-{% render "partials/home/recent-activity.liquid" music:music, books:books.all, tv:tv, movies:movies, links:links %}
+{% render "partials/home/recent-activity.liquid" music:music, books:books.currentYear, tv:tv, movies:movies, links:links %}
 {% render "partials/home/recent-posts.liquid" posts:posts %}

views/feeds/search.psql

@@ -1,102 +1,127 @@
 CREATE OR REPLACE VIEW optimized_search_index AS
 WITH search_data AS (
   SELECT
+      'post' AS type,
       CONCAT('📝 ', p.title) AS title,
       CONCAT('https://coryd.dev', p.url) AS url,
+      p.description AS description,
       p.tags,
       NULL AS genre_name,
-      NULL AS genre_url
+      NULL AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_posts p
 
   UNION ALL
 
   SELECT
+      'link' AS type,
       CONCAT('🔗 ', l.title, ' via ', l.name) AS title,
       l.link AS url,
+      l.description AS description,
       l.tags,
       NULL AS genre_name,
-      NULL AS genre_url
+      NULL AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_links l
 
   UNION ALL
 
   SELECT
+      'book' AS type,
       CASE
           WHEN b.rating IS NOT NULL THEN CONCAT('📖 ', b.title, ' (', b.rating, ')')
           ELSE CONCAT('📖 ', b.title)
       END AS title,
       CONCAT('https://coryd.dev', b.url) AS url,
+      b.description AS description,
       b.tags,
       NULL AS genre_name,
-      NULL AS genre_url
+      NULL AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_books b
   WHERE LOWER(b.status) = 'finished'
 
   UNION ALL
 
   SELECT
+      'movie' AS type,
       CASE
           WHEN m.rating IS NOT NULL THEN CONCAT('🎥 ', m.title, ' (', m.rating, ')')
           ELSE CONCAT('🎥 ', m.title)
       END AS title,
       CONCAT('https://coryd.dev', m.url) AS url,
+      m.description AS description,
       m.tags,
       NULL AS genre_name,
-      NULL AS genre_url
+      NULL AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_movies m
   WHERE m.last_watched IS NOT NULL
 
   UNION ALL
 
   SELECT
-      CONCAT('🎧 ', ar.name, ' - ', ar.genre_name) AS title,
+      'artist' AS type,
+      CONCAT(
+          COALESCE(ar.emoji, ar.genre_emoji, '🎧'), ' ', ar.name,
+          ' - ', ar.genre_name
+      ) AS title,
       CONCAT('https://coryd.dev', ar.url) AS url,
+      ar.description AS description,
       ARRAY[ar.genre_name] AS tags,
       ar.genre_name,
-      CONCAT('https://coryd.dev', ar.genre_slug) AS genre_url
+      CONCAT('https://coryd.dev', ar.genre_slug) AS genre_url,
+      ar.total_plays
   FROM optimized_artists ar
 
   UNION ALL
 
   SELECT
-      CONCAT('🎵 ', g.name) AS title,
+      'genre' AS type,
+      CONCAT(COALESCE(g.emoji, '🎵'), ' ', g.name) AS title,
       CONCAT('https://coryd.dev', g.url) AS url,
+      g.description AS description,
       NULL AS tags,
       g.name AS genre_name,
-      CONCAT('https://coryd.dev', g.url) AS genre_url
+      CONCAT('https://coryd.dev', g.url) AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_genres g
 
   UNION ALL
 
   SELECT
+      'show' AS type,
       CASE
           WHEN s.review IS NOT NULL THEN CONCAT('📺 ', s.title, ' (', s.year, ') - ', s.review)
           ELSE CONCAT('📺 ', s.title, ' (', s.year, ')')
       END AS title,
       CONCAT('https://coryd.dev', s.url) AS url,
+      s.description AS description,
       s.tags,
       NULL AS genre_name,
-      NULL AS genre_url
+      NULL AS genre_url,
+      NULL::integer AS total_plays
   FROM optimized_shows s
   WHERE s.last_watched_at IS NOT NULL
 ),
-
 search_data_with_id AS (
   SELECT
     ROW_NUMBER() OVER (ORDER BY url) AS id,
     search_data.*
   FROM search_data
 )
-
 SELECT
     json_agg(
       json_build_object(
         'id', search_data_with_id.id,
         'url', search_data_with_id.url,
         'title', search_data_with_id.title,
+        'description', search_data_with_id.description,
         'tags', search_data_with_id.tags,
         'genre_name', search_data_with_id.genre_name,
-        'genre_url', search_data_with_id.genre_url
+        'genre_url', search_data_with_id.genre_url,
+        'type', search_data_with_id.type,
+        'total_plays', search_data_with_id.total_plays
       )
     ) AS search_index
 FROM search_data_with_id;

views/feeds/syndication.psql

@@ -32,8 +32,8 @@ WITH syndication_data AS (
               CASE
                   WHEN l.mastodon IS NOT NULL THEN
                       ' via @' || split_part(l.mastodon, '@', 2) || '@' || split_part(split_part(l.mastodon, 'https://', 2), '/', 1)
-                  ELSE ''
+                  ELSE CONCAT(' via ', l.name)
-              END, CONCAT(' via ', l.name), (
+              END, ' ', (
                   SELECT array_to_string(
                       array_agg('#' || initcap(replace(t.name, ' ', ''))), ' '
                   )

views/media/music/artists.psql

@@ -9,10 +9,12 @@ SELECT
     ar.favorite,
     g.name AS genre_name,
     g.slug AS genre_slug,
+    g.emoji AS genre_emoji,
 
     json_build_object(
         'name', g.name,
-        'url', g.slug
+        'url', g.slug,
+        'emoji', g.emoji
     ) AS genre,
 
     ar.emoji,
@@ -113,4 +115,4 @@ LEFT JOIN
 LEFT JOIN
     genres g ON ar.genres = g.id
 GROUP BY
-    ar.id, df.filename_disk, g.name, g.slug;
+    ar.id, df.filename_disk, g.name, g.slug, g.emoji;

views/media/music/genres.psql

@@ -3,6 +3,7 @@ SELECT
     g.id,
     g.name,
     g.description,
+    g.emoji,
     g.total_plays,
     g.wiki_link,
     g.slug AS url,