From 0b343e4599d419f46cde3866f6f3cbdc819181a9 Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Sun, 14 Oct 2018 00:29:46 +0100
Subject: [PATCH] Add featured image to detailed layout of pub/talk widgets

Close #708
---
 .../content/post/getting-started/index.md     |  9 +++++++-
 layouts/partials/publication_li_detailed.html | 21 +++++++------------
 layouts/partials/talk_li_detailed.html        | 21 +++++++------------
 3 files changed, 22 insertions(+), 29 deletions(-)

diff --git a/exampleSite/content/post/getting-started/index.md b/exampleSite/content/post/getting-started/index.md
index 47e7e461..f72ef382 100644
--- a/exampleSite/content/post/getting-started/index.md
+++ b/exampleSite/content/post/getting-started/index.md
@@ -12,8 +12,15 @@ authors = []
 tags = ["Academic"]
 summary = "Create a beautifully simple website or blog in under 10 minutes."
 
+# Featured image
+# To use, add an image named `featured.jpg/png` to your project's folder. 
 [image]
-caption = "Image credit: [**Unsplash**](https://unsplash.com/photos/CpkOjOcXdUY)"
+  # Caption (optional)
+  caption = "Image credit: [**Unsplash**](https://unsplash.com/photos/CpkOjOcXdUY)"
+
+  # Focal point (optional)
+  # Options: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight
+  focal_point = ""
 
 [[gallery_item]]
 album = "1"
diff --git a/layouts/partials/publication_li_detailed.html b/layouts/partials/publication_li_detailed.html
index 30c260b6..6739561f 100644
--- a/layouts/partials/publication_li_detailed.html
+++ b/layouts/partials/publication_li_detailed.html
@@ -1,22 +1,15 @@
 <div class="pub-list-item card-simple" itemscope itemtype="http://schema.org/CreativeWork">
 
-  {{ if .Params.image_preview }}
-    {{ .Scratch.Set "image" .Params.image_preview }}
-  {{ else if .Params.header.image }}
-    {{ .Scratch.Set "image" .Params.header.image }}
-  {{ end }}
-  {{ if .Scratch.Get "image" }}
+  {{ $resource := (.Resources.ByType "image").GetMatch "*featured*" }}
+  {{ $anchor := .Params.image.focal_point | default "Smart" }}
+  {{ with $resource }}
+  {{ $image := .Fill (printf "918x517 q90 %s" $anchor) }}
   <div>
-    <a href="{{ .RelPermalink }}">
-      {{ $img_src := urls.Parse (.Scratch.Get "image") }}
-      {{ if $img_src.Scheme }}
-        <img src="{{ .Scratch.Get "image" }}" class="article-banner" itemprop="image">
-      {{ else }}
-        <img src="{{ "/img/" | relURL }}{{ .Scratch.Get "image" }}" class="article-banner" itemprop="image">
-      {{ end }}
+    <a href="{{ $.RelPermalink }}">
+      <img src="{{ $image.RelPermalink }}" class="article-banner" itemprop="image" alt="">
     </a>
   </div>
-  {{ end }}
+  {{end}}
 
   <h3 class="article-title" itemprop="name">
     <a href="{{ .RelPermalink }}" itemprop="url">{{ .Title }}</a>
diff --git a/layouts/partials/talk_li_detailed.html b/layouts/partials/talk_li_detailed.html
index 1c065310..5128df3b 100644
--- a/layouts/partials/talk_li_detailed.html
+++ b/layouts/partials/talk_li_detailed.html
@@ -1,22 +1,15 @@
 <div class="card-simple" itemscope itemtype="http://schema.org/Event">
 
-  {{ if .Params.image_preview }}
-    {{ .Scratch.Set "image" .Params.image_preview }}
-  {{ else if .Params.header.image }}
-    {{ .Scratch.Set "image" .Params.header.image }}
-  {{ end }}
-  {{ if .Scratch.Get "image" }}
+  {{ $resource := (.Resources.ByType "image").GetMatch "*featured*" }}
+  {{ $anchor := .Params.image.focal_point | default "Smart" }}
+  {{ with $resource }}
+  {{ $image := .Fill (printf "918x517 q90 %s" $anchor) }}
   <div>
-    <a href="{{ .RelPermalink }}">
-      {{ $img_src := urls.Parse (.Scratch.Get "image") }}
-      {{ if $img_src.Scheme }}
-        <img src="{{ .Scratch.Get "image" }}" class="article-banner" itemprop="image">
-      {{ else }}
-        <img src="{{ "/img/" | relURL }}{{ .Scratch.Get "image" }}" class="article-banner" itemprop="image">
-      {{ end }}
+    <a href="{{ $.RelPermalink }}">
+      <img src="{{ $image.RelPermalink }}" class="article-banner" itemprop="image" alt="">
     </a>
   </div>
-  {{ end }}
+  {{end}}
 
   <h3 class="article-title" itemprop="name">
     <a href="{{ .RelPermalink }}" itemprop="url">{{ .Title }}</a>