chore: lighter builds
This commit is contained in:
parent
e3cec3c374
commit
8b2648f23f
18 changed files with 84 additions and 408 deletions
|
|
@ -43,10 +43,6 @@ export default async function fetchMusicData() {
|
|||
monthArtists,
|
||||
monthAlbums,
|
||||
monthGenres,
|
||||
threeMonthTracks,
|
||||
threeMonthArtists,
|
||||
threeMonthAlbums,
|
||||
threeMonthGenres,
|
||||
] = await Promise.all([
|
||||
fetchDataFromView('recent_tracks'),
|
||||
fetchDataFromView('week_tracks'),
|
||||
|
|
@ -57,10 +53,6 @@ export default async function fetchMusicData() {
|
|||
fetchDataFromView('month_artists'),
|
||||
fetchDataFromView('month_albums'),
|
||||
fetchDataFromView('month_genres'),
|
||||
fetchDataFromView('three_month_tracks'),
|
||||
fetchDataFromView('three_month_artists'),
|
||||
fetchDataFromView('three_month_albums'),
|
||||
fetchDataFromView('three_month_genres'),
|
||||
])
|
||||
|
||||
return {
|
||||
|
|
@ -83,15 +75,6 @@ export default async function fetchMusicData() {
|
|||
.reduce((acc, track) => acc + track.plays, 0)
|
||||
.toLocaleString('en-US'),
|
||||
},
|
||||
threeMonth: {
|
||||
tracks: threeMonthTracks,
|
||||
artists: threeMonthArtists,
|
||||
albums: threeMonthAlbums,
|
||||
genres: threeMonthGenres,
|
||||
totalTracks: threeMonthTracks
|
||||
.reduce((acc, track) => acc + track.plays, 0)
|
||||
.toLocaleString('en-US'),
|
||||
},
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching and processing music data:', error)
|
||||
|
|
|
|||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Albums / 3 months
|
||||
description: All of the albums I've listened to over the last 3 months.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.threeMonth.albums
|
||||
size: 24
|
||||
permalink: "/music/albums/three-months/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.threeMonth.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.threeMonth.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.threeMonth.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.threeMonth.totalTracks }} tracks</strong> over the last 3 months. Most of that has been {{ music.threeMonth.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/three-months/">artists</a> or <a href="/music/tracks/three-months/">tracks</a> I've listened to over the last 3 months. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/this-month">this month</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Albums / This month
|
||||
description: All of the albums I've listened to over the past month.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.month.albums
|
||||
size: 24
|
||||
permalink: "/music/albums/this-month/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.month.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.month.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.month.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.month.totalTracks }} tracks</strong> this month. Most of that has been {{ music.month.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/this-month/">artists</a> or <a href="/music/tracks/this-month/">tracks</a> I've listened to this month. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Albums / This week
|
||||
description: All of the albums I've listened to this week.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.week.albums
|
||||
size: 24
|
||||
permalink: "/music/albums/this-week/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.week.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.week.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.week.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.week.totalTracks }} tracks</strong> this week. Most of that has been {{ music.week.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/this-week/">artists</a> or <a href="/music/tracks/this-week/">tracks</a> I've listened to this week. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Artists / 3 months
|
||||
description: All of the artists I've listened to over the last 3 months.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.threeMonth.artists
|
||||
size: 24
|
||||
permalink: "/music/artists/three-months/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.threeMonth.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.threeMonth.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.threeMonth.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.threeMonth.totalTracks }} tracks</strong> over the last 3 months. Most of that has been {{ music.threeMonth.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/albums/three-months/">albums</a> or <a href="/music/tracks/three-months/">tracks</a> I've listened to over the last 3 months. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/this-month">this month</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Artists / This month
|
||||
description: All of the artists I've listened to over the past month.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.month.artists
|
||||
size: 24
|
||||
permalink: "/music/artists/this-month/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.month.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.month.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.month.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.month.totalTracks }} tracks</strong> this month. Most of that has been {{ music.month.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/albums/this-month/">albums</a> or <a href="/music/tracks/this-month/">tracks</a> I've listened to this month. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Artists / This week
|
||||
description: All of the artists I've listened to this week.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.week.artists
|
||||
size: 24
|
||||
permalink: "/music/artists/this-week/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.week.artists[0].grid.image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.week.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.week.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.week.totalTracks }} tracks</strong> this week. Most of that has been {{ music.week.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/albums/this-week/">albums</a> or <a href="/music/tracks/this-week/">tracks</a> I've listened to this week. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination shape:"square" %}
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
---
|
||||
layout: default
|
||||
pagination:
|
||||
data: genres
|
||||
size: 1
|
||||
alias: genre
|
||||
permalink: "{{ genre.url }}/index.html"
|
||||
updated: "now"
|
||||
schema: genre
|
||||
---
|
||||
{% assign artistCount = genre.artists.size %}
|
||||
{%- capture connectingWords -%}
|
||||
{% if artistCount > 1 %}
|
||||
artists are
|
||||
{% else %}
|
||||
artist is
|
||||
{% endif %}
|
||||
{%- endcapture -%}
|
||||
{%- assign mediaLinks = genre.artists | mediaLinks: "artist", 5 -%}
|
||||
<noscript><style>[data-toggle-content].text-toggle-hidden {height: unset !important;overflow: unset !important;margin-bottom: unset !important;}[data-toggle-content].text-toggle-hidden::after {display: none !important;}</style></noscript>
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
<h2>{{ genre.name }}</h2>
|
||||
<article class="genre-focus">
|
||||
{%- if mediaLinks -%}
|
||||
<p>My top <strong class="highlight-text">{{ genre.name }}</strong> {{ connectingWords }} {{ mediaLinks }}. I've listened to <strong class="highlight-text">{{ genre.total_plays | formatNumber }}</strong> tracks form this genre.</p>
|
||||
<hr />
|
||||
{%- endif -%}
|
||||
{% render "partials/blocks/associated-media.liquid", posts:genre.posts %}
|
||||
{% render "partials/blocks/associated-media.liquid", books:genre.books %}
|
||||
{% render "partials/blocks/associated-media.liquid", movies:genre.movies %}
|
||||
{%- if genre.description -%}
|
||||
<h3>Overview</h3>
|
||||
<div data-toggle-content class="text-toggle-hidden">
|
||||
{{ genre.description | markdown }}
|
||||
<p><a href="{{ genre.wiki_link }}">Continue reading at Wikipedia.</a></p>
|
||||
<p><em>Wikipedia content provided under the terms of the <a href="https://creativecommons.org/licenses/by-sa/3.0/">Creative Commons BY-SA license</a></em></p>
|
||||
</div>
|
||||
<button data-toggle-button>Show more</button>
|
||||
{%- endif -%}
|
||||
</article>
|
||||
|
|
@ -8,29 +8,22 @@ schema: music-index
|
|||
---
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.week.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.week.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.week.totalTracks }} tracks</strong> this week. Most of that has been {{ music.week.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/this-week/">artists</a>, <a href="/music/albums/this-week/">albums</a> or <a href="/music/tracks/this-week/">tracks</a> I've listened to this week. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<p><strong class="highlight-text">Take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/concerts">check out the concerts I've been to.</a></p>
|
||||
{% render "partials/blocks/now-playing.liquid", music:music %}
|
||||
<hr />
|
||||
<h3 id="artists">
|
||||
<a class="icon-link" href="/music/artists/this-week">
|
||||
{% tablericon "microphone-2" %}
|
||||
Artists
|
||||
</a>
|
||||
{% tablericon "microphone-2" %}
|
||||
Artists
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.week.artists, shape:"square", count: 8, loading: "eager" %}
|
||||
<h3 id="albums">
|
||||
<a class="icon-link" href="/music/albums/this-week">
|
||||
{% tablericon "vinyl" %}
|
||||
Albums
|
||||
</a>
|
||||
{% tablericon "vinyl" %}
|
||||
Albums
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.week.albums, shape:"square", count: 8 %}
|
||||
<h3 id="tracks">
|
||||
<a class="icon-link" href="/music/tracks/this-week">
|
||||
{% tablericon "playlist" %}
|
||||
Tracks
|
||||
</a>
|
||||
{% tablericon "playlist" %}
|
||||
Tracks
|
||||
</h3>
|
||||
<div class="track-display">
|
||||
<input id="tracks-recent" name="track-options" type="radio" aria-hidden="true" checked />
|
||||
|
|
|
|||
|
|
@ -1,35 +0,0 @@
|
|||
---
|
||||
title: 3 months
|
||||
description: This is everything I've been listening to over the last 3 months — it's collected in a database as I listen to it and displayed here.
|
||||
layout: default
|
||||
permalink: "/music/three-months/index.html"
|
||||
updated: "now"
|
||||
image: music.threeMonth.artists[0].image
|
||||
schema: music-period
|
||||
---
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.threeMonth.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.threeMonth.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.threeMonth.totalTracks }} tracks</strong> over the last 3 months. Most of that has been {{ music.threeMonth.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/three-months/">artists</a>, <a href="/music/albums/three-months/">albums</a> or <a href="/music/tracks/three-months/">tracks</a> I've listened to over the last 3 months. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/this-month">this month</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
<h3 id="artists">
|
||||
<a class="icon-link" href="/music/artists/three-months">
|
||||
{% tablericon "microphone-2" %}
|
||||
Artists
|
||||
</a>
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.threeMonth.artists, shape:"square", count: 8, loading: "eager" %}
|
||||
<h3 id="albums">
|
||||
<a class="icon-link" href="/music/albums/three-months">
|
||||
{% tablericon "vinyl" %}
|
||||
Albums
|
||||
</a>
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.threeMonth.albums, shape:"square", count: 8 %}
|
||||
<h3 id="tracks">
|
||||
<a class="icon-link" href="/music/tracks/three-months">
|
||||
{% tablericon "playlist" %}
|
||||
Tracks
|
||||
</a>
|
||||
</h3>
|
||||
{% render "partials/media/music/chart.liquid", data:music.threeMonth.tracks, count: 10 %}
|
||||
|
|
@ -9,27 +9,20 @@ schema: music-period
|
|||
---
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.month.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.month.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.month.totalTracks }} tracks</strong> this month. Most of that has been {{ music.month.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/this-month/">artists</a>, <a href="/music/albums/this-month/">albums</a> or <a href="/music/tracks/this-month/">tracks</a> I've listened to this month. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<p><strong class="highlight-text">Take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/concerts">check out the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
<h3 id="artists">
|
||||
<a class="icon-link" href="/music/artists/this-month">
|
||||
{% tablericon "microphone-2" %}
|
||||
Artists
|
||||
</a>
|
||||
{% tablericon "microphone-2" %}
|
||||
Artists
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.month.artists, shape:"square", count: 8, loading: "eager" %}
|
||||
<h3 id="albums">
|
||||
<a class="icon-link" href="/music/albums/this-month">
|
||||
{% tablericon "vinyl" %}
|
||||
Albums
|
||||
</a>
|
||||
{% tablericon "vinyl" %}
|
||||
Albums
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:music.month.albums, shape:"square", count: 8 %}
|
||||
<h3 id="tracks">
|
||||
<a class="icon-link" href="/music/tracks/this-month">
|
||||
{% tablericon "playlist" %}
|
||||
Tracks
|
||||
</a>
|
||||
{% tablericon "playlist" %}
|
||||
Tracks
|
||||
</h3>
|
||||
{% render "partials/media/music/chart.liquid", data:music.month.tracks, count: 10 %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Tracks / 3 months
|
||||
description: All of the tracks I've listened to over the last 3 months.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.threeMonth.tracks
|
||||
size: 50
|
||||
permalink: "/music/tracks/three-months/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.threeMonth.artists[0].image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.threeMonth.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.threeMonth.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.threeMonth.totalTracks }} tracks</strong> over the last 3 months. Most of that has been {{ music.threeMonth.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/three-months/">artists</a> or <a href="/music/albums/three-months/">albums</a> I've listened to over the last 3 months. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/this-month">this month</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/music/chart.liquid" data:pagination.items, pagination:pagination %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Tracks / This month
|
||||
description: All of the tracks I've listened to over the past month.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.month.tracks
|
||||
size: 50
|
||||
permalink: "/music/tracks/this-month/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.month.artists[0].image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.month.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.month.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.month.totalTracks }} tracks</strong> this month. Most of that has been {{ music.month.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/this-month/">artists</a> or <a href="/music/albums/this-month/">albums</a> this month. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/music/chart.liquid" data:pagination.items, pagination:pagination %}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Tracks / This week
|
||||
description: All of the tracks I've listened to this week.
|
||||
layout: default
|
||||
pagination:
|
||||
data: music.week.tracks
|
||||
size: 50
|
||||
permalink: "/music/tracks/this-week/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
image: music.week.artists[0].image
|
||||
schema: music
|
||||
---
|
||||
<a class="icon-link" href="/music" title="Go back to the music index page">{% tablericon "arrow-left" %} Back to music</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2>{{ title }}</h2>
|
||||
<p>I've listened to <strong class="highlight-text">{{ music.week.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.week.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.week.totalTracks }} tracks</strong> this week. Most of that has been {{ music.week.genres | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See the</strong> <a href="/music/artists/this-week/">artists</a> or <a href="/music/albums/this-week/">albums</a> I've listened to this week. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<p><a href="/music/concerts">You can also take a look at the concerts I've been to.</a></p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/music/chart.liquid" data:pagination.items, pagination:pagination %}
|
||||
|
|
@ -13,17 +13,13 @@ schema: watching
|
|||
{% render "partials/blocks/banners/rss.liquid", url: "/feeds/movies", text: "Subscribe to my movies feed or follow along on this page" %}
|
||||
<hr />
|
||||
<h3 id="movies">
|
||||
<a class="icon-link" href="/watching/recent/movies">
|
||||
{% tablericon "movie" %}
|
||||
Recent movies
|
||||
</a>
|
||||
{% tablericon "movie" %}
|
||||
Recent movies
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:movies.recentlyWatched, shape:"vertical", count: 6 %}
|
||||
<h3 id="tv">
|
||||
<a class="icon-link" href="/watching/recent/shows">
|
||||
{% tablericon "device-tv-old" %}
|
||||
Recent shows
|
||||
</a>
|
||||
{% tablericon "device-tv-old" %}
|
||||
Recent shows
|
||||
</h3>
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:tv.recentlyWatched, shape:"vertical", count: 6 %}
|
||||
<h3 id="favorite-movies">
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
---
|
||||
title: Recent movies
|
||||
description: These are the movies I've watched recently. There are many like them, but these are mine.
|
||||
layout: default
|
||||
pagination:
|
||||
data: movies.recentlyWatched
|
||||
size: 24
|
||||
permalink: "/watching/recent/movies/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
schema: watching
|
||||
---
|
||||
<a class="icon-link" href="/watching" title="Go back to the watching index page">{% tablericon "arrow-left" %} Back to watching</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2 class="watching">{{ title }}</h2>
|
||||
<p>These are the movies I've watched recently. There are many like them, but these are mine. (Or well, all the movies I've watched — they're ordered latest watched, descending, hence the recent part).</p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination, shape:"poster" %}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
---
|
||||
title: Recent shows
|
||||
description: These are the shows I've watched recently. There are many like them, but these are mine.
|
||||
layout: default
|
||||
pagination:
|
||||
data: tv.recentlyWatched
|
||||
size: 24
|
||||
permalink: "/watching/recent/shows/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}/{% endif %}index.html"
|
||||
schema: watching-shows
|
||||
---
|
||||
<a class="icon-link" href="/watching" title="Go back to the watching index page">{% tablericon "arrow-left" %} Back to watching</a>
|
||||
{% if pagination.pageNumber == 0 %}
|
||||
<h2 class="watching">{{ title }}</h2>
|
||||
<p>These are the shows I've watched recently. There are many like them, but these are mine. (Or well, all the movies I've watched — they're ordered latest watched, descending, hence the recent part).</p>
|
||||
<hr />
|
||||
{% endif %}
|
||||
{% render "partials/media/grid.liquid", globals:globals, data:pagination.items, pagination:pagination, shape:"poster" %}
|
||||
|
|
@ -86,9 +86,9 @@ async function fetchGlobals(supabase) {
|
|||
|
||||
function generateMetadata(data, type, globals) {
|
||||
let title = globals['site_name']
|
||||
let description = data.description || globals.site_description
|
||||
const canonicalUrl = data.url ? `${globals.url}${data.url}` : globals.url
|
||||
const ogImage = `${globals['cdn_url']}${data.image || globals.avatar}?class=w800`
|
||||
let description = data['description'] || globals['site_description']
|
||||
const canonicalUrl = data['url'] ? `${globals['url']}${data['url']}` : globals['url']
|
||||
const ogImage = `${globals['cdn_url']}${data['image'] || globals['avatar']}?class=w800`
|
||||
|
||||
description = convert(truncateHtml(md.render(description), 100, {
|
||||
byWords: true,
|
||||
|
|
@ -140,14 +140,14 @@ function updateDynamicContent(html, metadata, mediaHtml) {
|
|||
const { document } = parseHTML(html)
|
||||
|
||||
const titleTag = document.querySelector('title[data-dynamic="title"]')
|
||||
if (titleTag) titleTag.textContent = metadata['title']
|
||||
if (titleTag) titleTag['textContent'] = metadata['title']
|
||||
|
||||
const dynamicMetaSelectors = [
|
||||
{ selector: 'meta[data-dynamic="description"]', attribute: 'content', value: metadata.description },
|
||||
{ selector: 'meta[data-dynamic="description"]', attribute: 'content', value: metadata['description'] },
|
||||
{ selector: 'meta[data-dynamic="og:title"]', attribute: 'content', value: metadata['og:title'] },
|
||||
{ selector: 'meta[data-dynamic="og:description"]', attribute: 'content', value: metadata['og:description'] },
|
||||
{ selector: 'meta[data-dynamic="og:image"]', attribute: 'content', value: metadata['og:image'] },
|
||||
{ selector: 'meta[data-dynamic="og:url"]', attribute: 'content', value: metadata.canonical },
|
||||
{ selector: 'meta[data-dynamic="og:url"]', attribute: 'content', value: metadata['canonical'] },
|
||||
]
|
||||
|
||||
dynamicMetaSelectors.forEach(({ selector, attribute, value }) => {
|
||||
|
|
@ -156,7 +156,7 @@ function updateDynamicContent(html, metadata, mediaHtml) {
|
|||
})
|
||||
|
||||
const canonicalLink = document.querySelector('link[rel="canonical"]')
|
||||
if (canonicalLink) canonicalLink.setAttribute('href', metadata.canonical)
|
||||
if (canonicalLink) canonicalLink.setAttribute('href', metadata['canonical'])
|
||||
|
||||
const pageElement = document.querySelector('[data-dynamic="page"]')
|
||||
if (pageElement) pageElement.innerHTML = mediaHtml
|
||||
|
|
@ -182,7 +182,7 @@ function generateAssociatedMediaHTML(data, isGenre = false) {
|
|||
data[key] && data[key].length
|
||||
? `<div class="associated-media">
|
||||
<p class="${category}">${ICON_MAP[icon]} ${title}</p>
|
||||
<ul>${data[key].map(item => `<li><a href="${item.url}">${item.name || item.title} ${item.year ? `(${item.year})` : ''}</a></li>`).join('')}</ul>
|
||||
<ul>${data[key].map(item => `<li><a href="${item['url']}">${item['name'] || item['title']} ${item['year'] ? `(${item['year']})` : ''}</a></li>`).join('')}</ul>
|
||||
</div>`
|
||||
: ''
|
||||
)
|
||||
|
|
@ -192,22 +192,22 @@ function generateAssociatedMediaHTML(data, isGenre = false) {
|
|||
function generateWatchingHTML(media, globals, type) {
|
||||
const isShow = type === 'show'
|
||||
const label = isShow ? 'show' : 'movie'
|
||||
const lastWatched = media.last_watched || (isShow && media.episode?.last_watched_at)
|
||||
const lastWatched = media['last_watched'] || (isShow && media['episode']?.['last_watched_at'])
|
||||
|
||||
return `
|
||||
<a class="icon-link" href="/watching">${ICON_MAP.arrowLeft} Back to watching</a>
|
||||
<article class="watching focus">
|
||||
<img
|
||||
srcset="
|
||||
${globals['cdn_url']}${media.backdrop}?class=bannersm&type=webp 256w,
|
||||
${globals['cdn_url']}${media.backdrop}?class=bannermd&type=webp 512w,
|
||||
${globals['cdn_url']}${media.backdrop}?class=bannerbase&type=webp 1024w
|
||||
${globals['cdn_url']}${media['backdrop']}?class=bannersm&type=webp 256w,
|
||||
${globals['cdn_url']}${media['backdrop']}?class=bannermd&type=webp 512w,
|
||||
${globals['cdn_url']}${media['backdrop']}?class=bannerbase&type=webp 1024w
|
||||
"
|
||||
sizes="(max-width: 450px) 256px,
|
||||
(max-width: 850px) 512px,
|
||||
1024px"
|
||||
src="${globals['cdn_url']}${media.backdrop}?class=bannersm&type=webp"
|
||||
alt="${media.title} / ${media.year}"
|
||||
src="${globals['cdn_url']}${media['backdrop']}?class=bannersm&type=webp"
|
||||
alt="${media['title']} / ${media['year']}"
|
||||
class="image-banner"
|
||||
loading="eager"
|
||||
decoding="async"
|
||||
|
|
@ -215,35 +215,35 @@ function generateWatchingHTML(media, globals, type) {
|
|||
height="180"
|
||||
/>
|
||||
<div class="meta">
|
||||
<p class="title"><strong>${media.title}</strong> (${media.year})</p>
|
||||
${media.favorite ? `<p class="sub-meta favorite">${ICON_MAP.heart} This is one of my favorite ${label}s!</p>` : ''}
|
||||
${media.tattoo ? `<p class="sub-meta tattoo">${ICON_MAP.needle} I have a tattoo inspired by this ${label}!</p>` : ''}
|
||||
${media.collected ? `<p class="sub-meta collected">${ICON_MAP.circleCheck} This ${label} is in my collection!</p>` : ''}
|
||||
<p class="title"><strong>${media['title']}</strong> (${media['year']})</p>
|
||||
${media['favorite'] ? `<p class="sub-meta favorite">${ICON_MAP['heart']} This is one of my favorite ${label}s!</p>` : ''}
|
||||
${media['tattoo'] ? `<p class="sub-meta tattoo">${ICON_MAP['needle']} I have a tattoo inspired by this ${label}!</p>` : ''}
|
||||
${media['collected'] ? `<p class="sub-meta collected">${ICON_MAP['circleCheck']} This ${label} is in my collection!</p>` : ''}
|
||||
${lastWatched ? `<p class="sub-meta">Last watched on <strong class="highlight-text">${formatDate(lastWatched)}</strong></p>` : ''}
|
||||
</div>
|
||||
${media.review ? `${warningBanner}<h2>My thoughts</h2><p>${md.render(media.review)}</p>` : ''}
|
||||
${media['review'] ? `${warningBanner}<h2>My thoughts</h2><p>${md.render(media['review'])}</p>` : ''}
|
||||
${generateAssociatedMediaHTML(media)}
|
||||
${media.description ? `<h2>Overview</h2><p>${md.render(media.description)}</p>` : ''}
|
||||
${media['description'] ? `<h2>Overview</h2><p>${md.render(media['description'])}</p>` : ''}
|
||||
</article>
|
||||
`
|
||||
}
|
||||
|
||||
function generateConcertModal(concert) {
|
||||
const venue = concert.venue_name
|
||||
? concert.venue_latitude && concert.venue_longitude
|
||||
? `<a href="https://www.openstreetmap.org/?mlat=${concert.venue_latitude}&mlon=${concert.venue_longitude}#map=18/${concert.venue_latitude}/${concert.venue_longitude}">${concert.venue_name_short}</a>`
|
||||
: concert.venue_name_short
|
||||
const venue = concert['venue_name']
|
||||
? concert['venue_latitude'] && concert['venue_longitude']
|
||||
? `<a href="https://www.openstreetmap.org/?mlat=${concert['venue_latitude']}&mlon=${concert['venue_longitude']}#map=18/${concert['venue_latitude']}/${concert['venue_longitude']}">${concert['venue_name_short']}</a>`
|
||||
: concert['venue_name_short']
|
||||
: ''
|
||||
|
||||
const notesModal = concert.notes
|
||||
? `<input class="modal-input" id="${concert.id}" type="checkbox" tabindex="0" />
|
||||
<label class="modal-toggle" for="${concert.id}">${ICON_MAP['infoCircle']}</label>
|
||||
const notesModal = concert['notes']
|
||||
? `<input class="modal-input" id="${concert['id']}" type="checkbox" tabindex="0" />
|
||||
<label class="modal-toggle" for="${concert['id']}">${ICON_MAP['infoCircle']}</label>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-body">
|
||||
<label class="modal-close" for="${concert.id}">${ICON_MAP['circleX']}</label>
|
||||
<label class="modal-close" for="${concert['id']}">${ICON_MAP['circleX']}</label>
|
||||
<div>
|
||||
<h3>Notes</h3>
|
||||
${md.render(concert.notes)}
|
||||
${md.render(concert['notes'])}
|
||||
</div>
|
||||
</div>
|
||||
</div>`
|
||||
|
|
@ -251,30 +251,30 @@ function generateConcertModal(concert) {
|
|||
|
||||
return `
|
||||
<li>
|
||||
<strong class="highlight-text">${formatDate(concert.date)}</strong> at ${venue}
|
||||
<strong class="highlight-text">${formatDate(concert['date'])}</strong> at ${venue}
|
||||
${notesModal}
|
||||
</li>
|
||||
`
|
||||
}
|
||||
|
||||
function generateArtistHTML(artist, globals) {
|
||||
const playLabel = artist?.total_plays === 1 ? 'play' : 'plays'
|
||||
const concertsList = artist.concerts?.length
|
||||
const playLabel = artist?.['total_plays'] === 1 ? 'play' : 'plays'
|
||||
const concertsList = artist['concerts']?.length
|
||||
? `<hr />
|
||||
<p id="concerts" class="concerts">
|
||||
${ICON_MAP['deviceSpeaker']}
|
||||
I've seen this artist live!
|
||||
</p>
|
||||
<ul>${artist.concerts.map(generateConcertModal).join('')}</ul>`
|
||||
<ul>${artist['concerts'].map(generateConcertModal).join('')}</ul>`
|
||||
: ''
|
||||
const albumsTable = artist.albums?.length
|
||||
const albumsTable = artist['albums']?.length
|
||||
? `<table>
|
||||
<tr><th>Album</th><th>Plays</th><th>Year</th></tr>
|
||||
${artist.albums.map(album => `
|
||||
${artist['albums'].map(album => `
|
||||
<tr>
|
||||
<td>${album.name}</td>
|
||||
<td>${album.total_plays || 0}</td>
|
||||
<td>${album.release_year}</td>
|
||||
<td>${album['name']}</td>
|
||||
<td>${album['total_plays'] || 0}</td>
|
||||
<td>${album['release_year']}</td>
|
||||
</tr>`).join('')}
|
||||
</table>
|
||||
<p><em>These are the albums by this artist that are in my collection, not necessarily a comprehensive discography.</em></p>
|
||||
|
|
@ -287,32 +287,32 @@ function generateArtistHTML(artist, globals) {
|
|||
<div class="artist-display">
|
||||
<img
|
||||
srcset="
|
||||
${globals['cdn_url']}${artist.image}?class=w200&type=webp 200w,
|
||||
${globals['cdn_url']}${artist.image}?class=w600&type=webp 400w,
|
||||
${globals['cdn_url']}${artist.image}?class=w800&type=webp 800w
|
||||
${globals['cdn_url']}${artist['image']}?class=w200&type=webp 200w,
|
||||
${globals['cdn_url']}${artist['image']}?class=w600&type=webp 400w,
|
||||
${globals['cdn_url']}${artist['image']}?class=w800&type=webp 800w
|
||||
"
|
||||
sizes="(max-width: 450px) 200px,
|
||||
(max-width: 850px) 400px,
|
||||
800px"
|
||||
src="${globals['cdn_url']}${artist.image}?class=w200&type=webp"
|
||||
alt="${artist.name} / ${artist.country}"
|
||||
src="${globals['cdn_url']}${artist['image']}?class=w200&type=webp"
|
||||
alt="${artist['name']} / ${artist['country']}"
|
||||
loading="eager"
|
||||
decoding="async"
|
||||
width="200"
|
||||
height="200"
|
||||
/>
|
||||
<div class="artist-meta">
|
||||
<p class="title"><strong>${artist.name}</strong></p>
|
||||
<p class="sub-meta country">${ICON_MAP['mapPin']} ${parseCountryField(artist.country)}</p>
|
||||
${artist.favorite ? `<p class="sub-meta favorite">${ICON_MAP['heart']} This is one of my favorite artists!</p>` : ''}
|
||||
${artist.tattoo ? `<p class="sub-meta tattoo">${ICON_MAP['needle']} I have a tattoo inspired by this artist!</p>` : ''}
|
||||
${artist.total_plays ? `<p class="sub-meta"><strong class="highlight-text">${artist.total_plays} ${playLabel}</strong></p>` : ''}
|
||||
<p class="sub-meta">${artist.genre ? `<a href="${artist.genre.url}">${artist.genre.name}</a>` : ''}</p>
|
||||
<p class="title"><strong>${artist['name']}</strong></p>
|
||||
<p class="sub-meta country">${ICON_MAP['mapPin']} ${parseCountryField(artist['country'])}</p>
|
||||
${artist['favorite'] ? `<p class="sub-meta favorite">${ICON_MAP['heart']} This is one of my favorite artists!</p>` : ''}
|
||||
${artist['tattoo'] ? `<p class="sub-meta tattoo">${ICON_MAP['needle']} I have a tattoo inspired by this artist!</p>` : ''}
|
||||
${artist['total_plays'] ? `<p class="sub-meta"><strong class="highlight-text">${artist['total_plays']} ${playLabel}</strong></p>` : ''}
|
||||
<p class="sub-meta">${artist['genre'] ? `<a href="${artist['genre']['url']}">${artist['genre']['name']}</a>` : ''}</p>
|
||||
</div>
|
||||
</div>
|
||||
${artist.description ? `
|
||||
${artist['description'] ? `
|
||||
<h2>Overview</h2>
|
||||
<div data-toggle-content class="text-toggle-hidden">${md.render(artist.description)}</div>
|
||||
<div data-toggle-content class="text-toggle-hidden">${md.render(artist['description'])}</div>
|
||||
<button data-toggle-button>Show more</button>` : ''
|
||||
}
|
||||
${concertsList}
|
||||
|
|
@ -351,40 +351,40 @@ function generateBookHTML(book, globals) {
|
|||
height="307"
|
||||
/>
|
||||
<div class="book-meta">
|
||||
<p class="title"><strong>${book.title}</strong></p>
|
||||
${book.rating ? `<p>${book.rating}</p>` : ''}
|
||||
${book.author ? `<p class="sub-meta">By ${book.author}</p>` : ''}
|
||||
${book.favorite ? `<p class="sub-meta favorite">${ICON_MAP.heart} This is one of my favorite books!</p>` : ''}
|
||||
${book.tattoo ? `<p class="sub-meta tattoo">${ICON_MAP.needle} I have a tattoo inspired by this book!</p>` : ''}
|
||||
<p class="title"><strong>${book['title']}</strong></p>
|
||||
${book['rating'] ? `<p>${book['rating']}</p>` : ''}
|
||||
${book['author'] ? `<p class="sub-meta">By ${book['author']}</p>` : ''}
|
||||
${book['favorite'] ? `<p class="sub-meta favorite">${ICON_MAP['heart']} This is one of my favorite books!</p>` : ''}
|
||||
${book['tattoo'] ? `<p class="sub-meta tattoo">${ICON_MAP['needle']} I have a tattoo inspired by this book!</p>` : ''}
|
||||
${status ? `<p class="sub-meta">${status}</p>` : ''}
|
||||
</div>
|
||||
</div>
|
||||
${book.review ? `${warningBanner}<h2>My thoughts</h2><p>${book.review}</p>` : ''}
|
||||
${book['review'] ? `${warningBanner}<h2>My thoughts</h2><p>${book['review']}</p>` : ''}
|
||||
${generateAssociatedMediaHTML(book)}
|
||||
<h2>Overview</h2>
|
||||
<p>${md.render(book.description)}</p>
|
||||
<p>${md.render(book['description'])}</p>
|
||||
</article>
|
||||
`
|
||||
}
|
||||
|
||||
function generateGenreHTML(genre) {
|
||||
const artistCount = genre.artists?.length || 0
|
||||
const artistCount = genre['artists']?.length || 0
|
||||
const connectingWords = artistCount > 1 ? 'artists are' : 'artist is'
|
||||
const mediaLinks = generateMediaLinks(genre.artists, 'artist', 5)
|
||||
const mediaLinks = generateMediaLinks(genre['artists'], 'artist', 5)
|
||||
|
||||
return `
|
||||
<a class="icon-link" href="/music">${ICON_MAP.arrowLeft} Back to music</a>
|
||||
<h2>${genre.name}</h2>
|
||||
<a class="icon-link" href="/music">${ICON_MAP['arrowLeft']} Back to music</a>
|
||||
<h2>${genre['name']}</h2>
|
||||
<article class="genre-focus">
|
||||
${mediaLinks ? `
|
||||
<p>My top <strong class="highlight-text">${genre.name}</strong> ${connectingWords} ${mediaLinks}. I've listened to <strong class="highlight-text">${genre.total_plays}</strong> tracks from this genre.</p>
|
||||
<p>My top <strong class="highlight-text">${genre['name']}</strong> ${connectingWords} ${mediaLinks}. I've listened to <strong class="highlight-text">${genre['total_plays']}</strong> tracks from this genre.</p>
|
||||
<hr />` : ''}
|
||||
${generateAssociatedMediaHTML(genre, true)}
|
||||
${genre.description ? `
|
||||
${genre['description'] ? `
|
||||
<h3>Overview</h3>
|
||||
<div data-toggle-content class="text-toggle-hidden">
|
||||
${md.render(genre.description)}
|
||||
<p><a href="${genre.wiki_link}">Continue reading at Wikipedia.</a></p>
|
||||
${md.render(genre['description'])}
|
||||
<p><a href="${genre['wiki_link']}">Continue reading at Wikipedia.</a></p>
|
||||
<p><em>Wikipedia content provided under the terms of the <a href="https://creativecommons.org/licenses/by-sa/3.0/">Creative Commons BY-SA license</a>.</em></p>
|
||||
</div>
|
||||
<button data-toggle-button>Show more</button>` : ''}
|
||||
|
|
|
|||
Reference in a new issue