List and show Brutal legends (#19)

* Add album item view

* Add album styles

* Simplify album field selection

* Fetch album in item controller

* Use correct permalink

assets/app.css

@@ -199,3 +199,18 @@ section {
         margin-top: 3em;
     }
 }
+
+.brutal-legend {
+    display: flex;
+    gap: 1em;
+    flex-direction: row-reverse;
+
+    > p {
+        flex: 1;
+        margin: 0;
+    }
+
+    > img {
+        aspect-ratio: 1;
+    }
+}

lib/mse25/directus.ex

@@ -31,12 +31,7 @@ defmodule Mse25.Directus do
       :albums,
       externalId,
       [
-        "purchased_at",
+        "*",
-        "album",
-        "year",
-        "youtubeId",
-        "externalId",
-        "cover",
         "songs.title",
         "songs.artist.name"
       ]
@@ -51,24 +46,19 @@ defmodule Mse25.Directus do
         "fields=" <>
           Enum.join(
             [
-              "purchased_at",
+              "*",
-              "album",
-              "year",
-              "externalId",
-              "cover.filename_download",
-              "cover.width",
-              "cover.height",
               "songs.title",
               "songs.artist.name"
             ],
             ","
           )
       ]
+      |> annual?(:albums, options)
       |> query_params_string(options, :brutal_legends)
 
     get("/albums?" <> params)
-    |> Enum.map(fn m = %{"songs" => [%{"artist" => %{"name" => a}} | _]} ->
+    |> Enum.map(fn m = %{"songs" => [%{"artist" => %{"name" => a}} | _], "purchased_at" => pa} ->
-      Map.put(m, "artist", a)
+      m |> Map.put("artist", a) |> Map.put("purchase_year", String.slice(pa, 0..3))
     end)
   end
 

lib/mse25_web/controllers/item_controller.ex

@@ -34,6 +34,17 @@ defmodule Mse25Web.ItemController do
     end
   end
 
+  defp fetch([_year, album_id], :album) do
+    case Directus.get_album(album_id) do
+      {:ok, response} -> {:ok, :album, response}
+      not_found -> not_found
+    end
+  end
+
+  defp fetch([year, "brutal-legend-" <> external_id]) do
+    fetch([year, external_id], :album)
+  end
+
   defp fetch([year, slug]) do
     fetch([year, slug], :article)
   end
@@ -147,4 +158,26 @@ defmodule Mse25Web.ItemController do
       updated_at: String.slice(updated_at, 0..9)
     ]
   end
+
+  defp assigns(:album, %{
+         "year" => year,
+         "album" => album,
+         "contents" => contents,
+         "cover" => cover,
+         "purchased_at" => purchased_at,
+         "externalId" => count,
+         "songs" => songs
+       }) do
+    [
+      count: count,
+      page_title: album,
+      album: album,
+      cover: cover,
+      year: to_string(year),
+      purchase_year: String.slice(purchased_at, 0..3),
+      contents: Earmark.as_html!(contents),
+      songs: Enum.map(songs, fn %{"title" => name} -> "\"" <> name <> "\"" end),
+      artist: List.first(songs) |> Map.get("artist") |> Map.get("name")
+    ]
+  end
 end

lib/mse25_web/controllers/item_html/album.html.heex

@@ -0,0 +1,40 @@
+<article class="article">
+  <header>
+    <ol class="breadcrumbs" itemscope itemtype="https://schema.org/BreadcrumbList">
+      <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
+        <a href="/" rel="home">
+          <span itemprop="name">madr.se</span>
+        </a>
+        <meta itemprop="position" content="1" />
+      </li>
+      <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
+        <a href={"/" <> @purchase_year}>
+          <span itemprop="name"><%= @purchase_year %></span>
+        </a>
+        <meta itemprop="position" content="2" />
+      </li>
+    </ol>
+    <h1><%= @artist <> " - " <> @album <> " (" <> @year <> ")" %></h1>
+  </header>
+
+  <p>
+    Som jag tidigare skrivit om har jag ett roligt projekt pågående: att äga alla låtar i spelet Brütal Legend äldre än 1990 på vinyl, där det är möjligt.
+  </p>
+
+  <div class="brutal-legend">
+    <p>
+      #<%= @count %>: <%= @artist %> - <%= csl(@songs) %>, från <%= @album %> (<%= @year %>)
+    </p>
+    <%= if @cover do %>
+      <img
+        src={"https://n.madr.se/assets/" <> @cover <> "?key=rectangular"}
+        alt="Skivomslag"
+        loading="lazy"
+        height="75"
+        width="75"
+      />
+    <% end %>
+  </div>
+
+  <%= raw(@contents) %>
+</article>

lib/mse25_web/controllers/page_html/home.html.heex

@@ -42,7 +42,7 @@
     <%= for legend <- @brutal_legends do %>
       <div>
         Införskaffat (<%= legend["purchased_at"] %>):<br />
-        <a href={legend["externalId"]}>
+        <a href={"/" <> legend["purchase_year"] <> "/brutal-legend-" <> legend["externalId"]}>
           <%= legend["artist"] %> - <%= legend["album"] %> (<%= legend["year"] %>)
         </a>
       </div>