From 8bfa3fc8bf641989298870fe71a6f01874f36ce8 Mon Sep 17 00:00:00 2001
From: Eryn Wells <eryn@erynwells.me>
Date: Thu, 31 Oct 2024 08:06:05 -0700
Subject: [PATCH] Add support for embedding videos in the figures/image
 shortcode

---
 layouts/shortcodes/figures/image.html | 54 ++++++++++++++-------------
 1 file changed, 29 insertions(+), 25 deletions(-)

diff --git a/layouts/shortcodes/figures/image.html b/layouts/shortcodes/figures/image.html
index ecf42c9..9372b06 100644
--- a/layouts/shortcodes/figures/image.html
+++ b/layouts/shortcodes/figures/image.html
@@ -17,31 +17,35 @@
   {{ errorf "No images found for name(s) parameter" }}
 {{- end -}}
 
-<figure class="figure  figure--image{{ with $class }}  {{ . }}{{ end }}">
-  <div class="figure__container">
-    {{ range $img := $imgs }}
-      {{- $linkedImg := $img -}}
-      {{- if not $img }}
-        {{ errorf "Found nil in images list for %s" $.Page.Permalink }}
-      {{ end -}}
+{{ with $item := index $imgs 0 }}
+  <figure class="figure  figure--{{ $item.ResourceType }}{{ with $class }}  {{ . }}{{ end }}">
+    <div class="figure__container">
+      {{ if eq $item.ResourceType "image" }}
+        {{- $processedImage := $item -}}
+        {{- if $shouldResize -}}
+          {{ $processedImage = $item.Fit "1280x1280" }}
+        {{- end -}}
 
-      {{- if $shouldResize -}}
-        {{ $linkedImg = $img.Fit "1280x1280" }}
+        {{- $altText := $item.Params.alt | default $item.Title -}}
+        <a href="{{ $item.RelPermalink }}">
+          <img src="{{ $processedImage.RelPermalink }}"
+            {{- with $altText }} alt="{{ . }}"{{- end }}
+            {{- with $item.Title }} title="{{ . }}"{{- end }}>
+        </a>
+      {{ else if eq $item.ResourceType "video" }}
+        <video controls width="100%">
+          <source src="{{ $item.RelPermalink }}" type="{{ $item.MediaType.Type }}">
+        </video>
+      {{- end }}
+    </div>
+    {{ if $shouldShowTitle -}}
+      {{- with $item -}}
+        {{- if gt (len .Title) 0 -}}
+          <figcaption>{{ .Title | markdownify }}</figcaption>
+        {{- end -}}
       {{- end -}}
-
-      {{- $altText := $img.Params.alt | default $img.Title -}}
-      <a href="{{ $img.RelPermalink }}">
-        <img src="{{ $linkedImg.RelPermalink }}"
-          {{- with $altText }} alt="{{ . }}"{{- end }}
-          {{- with $img.Title }} title="{{ . }}"{{- end }}>
-      </a>
     {{- end }}
-  </div>
-  {{ if $shouldShowTitle -}}
-    {{- range $imgs -}}
-      {{- if gt (len .Title) 0 -}}
-        <figcaption>{{ .Title }}</figcaption>
-      {{- end -}}
-    {{- end -}}
-  {{- end }}
-</figure>
+  </figure>
+{{ else }}
+  {{ errorf "Found nil in items list for %s" $.Page.Permalink }}
+{{ end }}