fix(metadata/index.liquid): corrects 403s in open graph images

src/includes/metadata/index.liquid

@@ -1,5 +1,7 @@
 {%- assign fullUrl = globals.url | append: page.url -%}
 {%- assign oembedUrl = globals.url | append: "/oembed" | append: page.url -%}
+{%- capture appVersionString -%}{% appVersion %}{%- endcapture -%}
+{%- assign ogImageBaseUrl = globals.url | append: "/og/w800/" | append: appVersionString -%}
 {%- capture pageTitle -%}
   {%- if page.title -%}
     {{ page.title | append: ' • ' | append: globals.site_name }}
@@ -18,7 +20,7 @@
     {{ globals.site_description }}
   {%- endif -%}
 {%- endcapture -%}
-{%- assign ogImage = globals.cdn_url | append: globals.avatar -%}
+{%- assign ogImage = ogImageBaseUrl | append: globals.avatar -%}
 {%- case schema -%}
   {%- when 'artist' -%}
     {% render "fetchers/artist.php.liquid" %}
@@ -35,20 +37,20 @@
   {%- when 'blog' -%}
     {%- assign pageTitle = post.title -%}
     {%- assign pageDescription = post.description -%}
-    {%- assign ogImage = globals.cdn_url | append: post.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: post.image -%}
   {%- when 'music-index', 'music-week-artists' -%}
-    {%- assign ogImage = globals.cdn_url | append: music.week.artists[0].grid.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: music.week.artists[0].grid.image -%}
   {%- when 'music-week-albums', 'music-week-tracks' -%}
-    {%- assign ogImage = globals.cdn_url | append: music.week.albums[0].grid.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: music.week.albums[0].grid.image -%}
   {%- when 'music-month-artists' -%}
-    {%- assign ogImage = globals.cdn_url | append: music.month.artists[0].grid.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: music.month.artists[0].grid.image -%}
   {%- when 'music-month-albums' -%}
-    {%- assign ogImage = globals.cdn_url | append: music.month.albums[0].grid.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: music.month.albums[0].grid.image -%}
   {%- when 'music-releases' -%}
-    {%- assign ogImage = globals.cdn_url | append: albumReleases.upcoming[0].grid.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: albumReleases.upcoming[0].grid.image -%}
   {%- when 'books' -%}
     {%- assign overviewBook = books.all | filterBooksByStatus: 'started' | reverse | first %}
-    {%- assign ogImage = globals.cdn_url | append: overviewBook.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: overviewBook.image -%}
   {%- when 'books-year' -%}
     {%- assign pageTitle = 'Books' | append: ' • ' | append: year.value | append: ' • ' | append: globals.site_name -%}
     {%- capture pageDescription -%}
@@ -56,19 +58,21 @@
     {%- endcapture -%}
     {%- assign bookData = year.data | filterBooksByStatus: 'finished' -%}
     {%- assign bookYear = bookData | shuffleArray | first -%}
-    {%- assign ogImage = globals.cdn_url | append: bookYear.image -%}
+    {%- assign ogImage = ogImageBaseUrl | append: bookYear.image -%}
   {%- when 'favorite-movies' -%}
     {%- assign favoriteMovie = movies.favorites | shuffleArray | first %}
-    {%- assign ogImage = globals.cdn_url | append: favoriteMovie.backdrop -%}
+    {%- assign ogImage = ogImageBaseUrl | append: favoriteMovie.backdrop -%}
   {%- when 'favorite-shows' -%}
     {%- assign favoriteShow = tv.favorites | shuffleArray | first %}
-    {%- assign ogImage = globals.cdn_url | append: favoriteShow.backdrop -%}
+    {%- assign ogImage = ogImageBaseUrl | append: favoriteShow.backdrop -%}
   {%- when 'watching' -%}
-    {%- assign overviewMovie = movies.recentlyWatched | first %}
-    {%- assign ogImage = globals.cdn_url | append: overviewMovie.backdrop -%}
+    {%- assign mergedMovies = movies.recentlyWatched | mergeArray: movies.favorites %}
+    {%- assign mergedShows = tv.recentlyWatched | mergeArray: tv.favorites %}
+    {%- assign overviewWatched = mergedMovies | mergeArray: mergedShows | shuffleArray | first -%}
+    {%- assign ogImage = ogImageBaseUrl | append: overviewWatched.backdrop -%}
   {%- when 'upcoming-shows' -%}
     {%- assign upcomingShow = upcomingShows.watching | shuffleArray | first %}
-    {%- assign ogImage = globals.cdn_url | append: upcomingShow.backdrop -%}
+    {%- assign ogImage = ogImageBaseUrl | append: upcomingShow.backdrop -%}
   {%- when 'page' -%}
     {%- assign pageDescription = page.description -%}
 {% endcase %}

src/includes/metadata/static.liquid

@@ -7,4 +7,4 @@
 <meta property="og:url" content="{{ fullUrl }}" />
 <link rel="alternate" type="application/json+oembed" href="{{ oembedUrl }}" title="{{ pageTitle }}">
 <link rel="canonical" href="{{ fullUrl }}" />
-<meta property="og:image" content="{{ globals.url }}/og/w800/{% appVersion %}{{ globals.avatar }}" />
+<meta property="og:image" content="{{ ogImage }}" />

src/pages/media/watching/index.html

@@ -5,11 +5,13 @@ permalink: "/watching/index.html"
 schema: watching
 updated: "now"
 ---
-{%- assign featuredMovie = movies.recentlyWatched | shuffleArray | first -%}
+{%- assign mergedMovies = movies.recentlyWatched | mergeArray: movies.favorites %}
+{%- assign mergedShows = tv.recentlyWatched | mergeArray: tv.favorites %}
+{%- assign overviewWatched = mergedMovies | mergeArray: mergedShows | shuffleArray | first -%}
 <h2 class="page-title">{{ title }}</h2>
 {% render "media/watching/hero.liquid",
   globals:globals,
-  movie:featuredMovie
+  movie:overviewWatched
 %}
 <p>Here's all of the TV and movies I've been watching presented in what is (hopefully) an organized fashion.</p>
 <p><a href="/watching/shows/upcoming">You can see all of the shows I've got queued up here.</a></p>