Add ability to give episodes their own cover art

lib/changelog/files/cover.ex

@@ -1,14 +1,18 @@
 defmodule Changelog.Files.Cover do
   use Changelog.File, [:jpg, :png]
 
-  alias Changelog.Podcast
+  alias Changelog.{Episode, Podcast}
   alias ChangelogWeb.PodcastView
 
   @versions [:original, :medium, :small]
 
   def storage_dir(_, _), do: "uploads/covers"
 
-  def filename(version, {_, %{name: _} = scope}) do
+  def filename(version, {_file, %Episode{} = scope}) do
+    "episode-#{scope.id}-#{version}"
+  end
+
+  def filename(version, {_file, %Podcast{} = scope}) do
     name = if Podcast.is_interviews(scope) do
       "changelog-interviews"
     else

lib/changelog/kits/mp3_kit.ex

@@ -1,6 +1,6 @@
 defmodule Changelog.Mp3Kit do
   alias Changelog.{FileKit, UrlKit}
-  alias ChangelogWeb.{PodcastView}
+  alias ChangelogWeb.{EpisodeView}
   alias Id3vx.Tag
 
   @text_frames %{
@@ -16,8 +16,8 @@ defmodule Changelog.Mp3Kit do
   }
 
   def tag(file_path, episode, chapters) do
-    cover_path = PodcastView.cover_path(episode.podcast, :original)
-    cover_file = UrlKit.get_tempfile(cover_path)
+    cover_url = EpisodeView.cover_url(episode.podcast, :original)
+    cover_file = UrlKit.get_tempfile(cover_url)
     tagged_file_path = file_path <> "-tagged"
 
     new_tag =

lib/changelog/schema/episode/episode.ex

@@ -46,6 +46,8 @@ defmodule Changelog.Episode do
     field :recorded_live, :boolean, default: false
     field :youtube_id, :string
 
+    field :cover, Files.Cover.Type
+
     field :audio_file, Files.Audio.Type
     field :audio_bytes, :integer
     field :audio_duration, :integer
@@ -209,7 +211,7 @@ defmodule Changelog.Episode do
       email_subject email_teaser email_content recorded_live youtube_id guid type)a)
     |> prep_audio_file(attrs)
     |> prep_plusplus_file(attrs)
-    |> cast_attachments(attrs, [:audio_file, :plusplus_file])
+    |> cast_attachments(attrs, [:audio_file, :plusplus_file, :cover])
     |> cast_embed(:audio_chapters)
     |> cast_embed(:plusplus_chapters)
     |> validate_required([:slug, :title, :published, :featured])

lib/changelog_web/templates/admin/episode/_form.html.eex

@@ -46,20 +46,46 @@
 <% end %>
 
   <div class="fields">
-    <div class="field <%= AdminHelpers.error_class(f, :featured) %>">
-      <label>Recommended <%= AdminHelpers.help_icon("Episode will appear in recommended list. Limit to 10% of show's total episodes, max.") %></label>
+    <div class="three wide field <%= AdminHelpers.error_class(f, :featured) %>">
+      <label>Recommend <%= AdminHelpers.help_icon("Episode will appear in recommended list. Limit to 10% of show's total episodes, max.") %></label>
       <div class="ui fitted toggle checkbox">
         <%= checkbox(f, :featured, class: "hidden") %>
         <%= AdminHelpers.error_message(f, :featured) %>
       </div>
     </div>
 
-    <div class="field">
+    <div class="three wide field">
       <label>Requested</label>
       <div class="ui fitted toggle checkbox">
         <%= checkbox(f, :requested, class: "hidden", value: !!f.data.request_id) %>
       </div>
     </div>
+
+    <div class="eight wide field">
+      <label for="cover">
+        Cover Art
+        <%= AdminHelpers.help_icon("Ideal size is 3000px by 3000px") %>
+        <%= AdminHelpers.file_toggle_buttons() %>
+      </label>
+      <%= file_input(f, :cover) %>
+      <%= AdminHelpers.error_message(f, :cover) %>
+    </div>
+
+    <div class="two wide field">
+      <%= if AdminHelpers.is_persisted(f.data) do %>
+        <img
+          src="<%= EpisodeView.cover_url(f.data, :small) %>"
+          data-popup=true
+          width=66
+          height=66
+        <%= if !f.data.cover do %>
+          data-content="Using the podcast cover"
+        <% else %>
+          data-content="Using the uploaded file"
+        <% end %>
+        >
+      <% end %>
+    </div>
   </div>
 
   <div class="field <%= AdminHelpers.error_class(f, :request_id) %> <%= AdminHelpers.hidden_class(!f.data.request_id) %>">

lib/changelog_web/templates/episode/_item.html.eex

@@ -5,7 +5,7 @@
       <%= link to: ~p"/#{slug}",
         title: @episode.podcast.name,
         class: "news_item-source-image news_item-source-image--episode" do %>
-        <%= SharedHelpers.lazy_image(PodcastView.cover_url(@episode.podcast, :small), @episode.podcast.name, width: 70, height: 70, style: "background-color: #121921") %>
+        <%= SharedHelpers.lazy_image(cover_url(@episode, :small), @episode.podcast.name, width: 70, height: 70, style: "background-color: #121921") %>
       <% end %>
 
       <%= link(podcast_name_and_number(@episode),

lib/changelog_web/templates/episode/embed.html.eex

@@ -67,7 +67,7 @@
           <ul class="episode_player-nav-list">
             <li class="episode_player-nav-list-item episode_player-nav-list-item--show">
               <%= link to: Routes.podcast_url(@conn, :show, @podcast.slug), title: "#{@podcast.name} on Changelog.com", alt: "#{@podcast.name} Podcast" do %>
-                <img src="<%= PodcastView.cover_url(@podcast, :small) %>" alt="<%= @podcast.name %>" width="75" height="75">
+                <img src="<%= cover_url(@episode, :small) %>" alt="<%= @podcast.name %>" width="75" height="75">
               <% end %>
             </li>
             <li class="episode_player-nav-list-item">

lib/changelog_web/templates/feed/plusplus.xml.eex

@@ -38,7 +38,7 @@
       <%= if episode.type == :full do %>
         <itunes:episode><%= EpisodeView.number(episode) %></itunes:episode>
       <% end %>
-        <itunes:image href="<%= PodcastView.cover_url(episode.podcast) %>"/>
+        <itunes:image href="<%= EpisodeView.cover_url(episode) %>"/>
         <itunes:duration><%= TimeView.duration(duration) %></itunes:duration>
         <itunes:explicit>no</itunes:explicit>
         <itunes:subtitle><%= escaped(episode.subtitle) %></itunes:subtitle>

lib/changelog_web/templates/feed/podcast.xml.eex

@@ -55,7 +55,7 @@
       <content:encoded><%= render("_show_notes.xml", episode: episode, plusplus: false) %></content:encoded>
 
       <itunes:episodeType><%= episode.type %></itunes:episodeType>
-      <itunes:image href="<%= PodcastView.cover_url(episode.podcast) %>"/>
+      <itunes:image href="<%= EpisodeView.cover_url(episode) %>"/>
       <itunes:duration><%= TimeView.duration(episode.audio_duration) %></itunes:duration>
       <itunes:explicit>no</itunes:explicit>
       <itunes:keywords><%= episode.podcast.keywords %></itunes:keywords>

lib/changelog_web/views/episode_view.ex

@@ -12,6 +12,8 @@ defmodule ChangelogWeb.EpisodeView do
     UrlKit
   }
 
+  alias Changelog.Files.Cover
+
   alias ChangelogWeb.{
     Endpoint,
     LayoutView,
@@ -70,6 +72,14 @@ defmodule ChangelogWeb.EpisodeView do
 
   defp get_down_with_op3(url, _mode), do: String.replace_prefix(url, "", "https://op3.dev/e/")
 
+  def cover_url(episode, version \\ :original) do
+    if episode.cover do
+      Cover.url({episode.cover, episode}, version)
+    else
+      PodcastView.cover_url(episode.podcast, version)
+    end
+  end
+
   # simplest case, no ++
   def plusplus_cta(%{plusplus_file: pp}) when is_nil(pp), do: fallback_cta()
 

lib/changelog_web/views/podcast_view.ex

@@ -27,28 +27,28 @@ defmodule ChangelogWeb.PodcastView do
     end
   end
 
-  def cover_path(%{slug: "master"}, version) do
+  def cover_url(podcast, version \\ :original)
+
+  # Special cases for Master, The Changelog & ++
+  def cover_url(%{slug: "master"}, version) do
     image = "master-#{version}.png"
     url(~p"/images/podcasts/#{image}")
   end
 
-  def cover_path(%{slug: "podcast", is_meta: true}, version) do
+  def cover_url(%{slug: "podcast", is_meta: true}, version) do
     image = "podcast-#{version}.png"
     url(~p"/images/podcasts/#{image}")
   end
 
-  def cover_path(%{slug: "plusplus"}, version) do
+  def cover_url(%{slug: "plusplus"}, version) do
     image = "plusplus-#{version}.png"
     url(~p"/images/podcasts/#{image}")
   end
 
-  def cover_path(podcast, version), do: Cover.url({podcast.cover, podcast}, version)
-
-  def cover_url(podcast), do: cover_url(podcast, :original)
-
+  # Standard case
   def cover_url(podcast, version) do
     if podcast.cover do
-      cover_path(podcast, version)
+      Cover.url({podcast.cover, podcast}, version)
     else
       url(~p"/images/defaults/black.png")
     end

priv/repo/migrations/20240109164004_add_cover_to_episodes.exs

@@ -0,0 +1,9 @@
+defmodule Changelog.Repo.Migrations.AddCoverFieldsToEpisodes do
+  use Ecto.Migration
+
+  def change do
+    alter table(:episodes) do
+      add :cover, :string
+    end
+  end
+end