make optimize-image more function-like

....instead of relying on $.Scratch
2025-07-17 16:05:33 -04:00 · 2020-01-15 10:30:01 -05:00
parent 827ffd20e3
commit f51e912632
7 changed files with 48 additions and 46 deletions
--- a/layouts/partials/functions/optimize-image.html
+++ b/layouts/partials/functions/optimize-image.html
@@ -1,25 +1,25 @@
-{{- /* Automatic resizing for HiDPI/retina images */ -}}
+{{/* Automatic resizing for HiDPI/retina images */}}

-{{- $original := .Page.Resources.GetMatch (.Get "src") -}}
-{{- .Scratch.Set "image" $original -}}
+{{ $original := .Page.Resources.GetMatch (.Get "src") }}
+{{ .Scratch.Set "image" $original }}

-{{- $setWidth := 910 -}}
+{{ $setWidth := 910 }}

-{{- if .Get "width" -}}
-  {{- $setWidth = (int (.Get "width")) -}}
-{{- end -}}
+{{ if .Get "width" }}
+  {{ $setWidth = (int (.Get "width")) }}
+{{ end }}

-{{- $retinaWidth := (mul $setWidth 2) -}}
+{{ $retinaWidth := (mul $setWidth 2) }}

-{{- if gt $original.Width $retinaWidth -}}
-  {{- $finalWidth := (printf "%dx" $retinaWidth) -}}
-  {{- .Scratch.Set "image" ($original.Resize $finalWidth) -}}
-{{- end -}}
+{{ if gt $original.Width $retinaWidth -}}
+  {{ $finalWidth := (printf "%dx" $retinaWidth) }}
+  {{ .Scratch.Set "image" ($original.Resize $finalWidth) }}
+{{ end }}

-{{- $image := .Scratch.Get "image" -}}
+{{ $image := .Scratch.Get "image" }}

-{{- $origRatio := (div (float $image.Height) $image.Width) -}}
-{{- .Scratch.Set "displayWidth" $setWidth -}}
-{{- .Scratch.Set "displayHeight" (math.Ceil (mul $origRatio $setWidth)) -}}
+{{ $origRatio := (div (float $image.Height) $image.Width) }}
+{{ $displayWidth := $setWidth }}
+{{ $displayHeight := (math.Ceil (mul $origRatio $setWidth)) }}

-{{- return $image -}}
+{{ return (dict "Permalink" $image.Permalink "Width" $displayWidth "Height" $displayHeight) }}
--- a/layouts/partials/head/favicons.html
+++ b/layouts/partials/head/favicons.html
@@ -5,4 +5,6 @@
 <link rel="icon" href="{{ (printf "favicon-%v.png" .) | absURL }}" sizes="{{ . }}x{{ . }}">
 {{ end -}}

-<link rel="shortcut icon" href="{{ "favicon.ico" | absURL }}" sizes="{{ .ico_sizes }}">
+{{ $s := slice -}}
+{{ range (split .ico_sizes " ") }}{{ $s = $s | append (printf "%vx%v" . .) }}{{ end -}}
+<link rel="shortcut icon" href="{{ "favicon.ico" | absURL }}" sizes="{{ delimit $s " " }}">
--- a/layouts/partials/head/head.html
+++ b/layouts/partials/head/head.html
@@ -1,22 +1,22 @@
-{{ partial "head/meta" . }}
-{{ partial "head/social-images" . }}
-{{ partial "head/open-graph" . }}
+{{ partial "head/meta" . -}}
+{{ partial "head/social-images" . -}}
+{{ partial "head/open-graph" . -}}
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="default">
 <meta name="apple-mobile-web-app-title" content="{{ .Site.Title }}">
 <meta name="theme-color" content="#0e6dc2">
-{{ partialCached "head/preload" . }}
-{{ partialCached "head/styles" . }}
-{{ partialCached "head/favicons" (dict "png_sizes" "192 48 32 16" "ico_sizes" "16x16 32x32 48x48") }}
+{{ partialCached "head/preload" . -}}
+{{ partialCached "head/styles" . -}}
+{{ partialCached "head/favicons" (dict "png_sizes" "192 48 32 16" "ico_sizes" "16 32 48") -}}
 <link rel="canonical" href="{{ .Permalink }}">
 <link rel="alternate" type="application/rss+xml" href="{{ "feed.xml" | absURL }}" title="{{ .Site.Title }} (RSS)">
 <link rel="author" href="{{ "humans.txt" | absURL }}">
 {{ if and .IsPage (eq .Type "notes") }}
-  {{ with .OutputFormats.Get "amp" }}
+  {{- with .OutputFormats.Get "amp" -}}
  <link rel="amphtml" href="{{ .Permalink }}">
-  {{ end }}
+  {{- end }}
  {{ partial "head/schema-person" . }}
  {{ partial "head/schema-article" . }}
 {{ else }}
  {{ partial "head/schema-person" . }}
-{{ end }}
+{{ end -}}
--- a/layouts/partials/head/social-images.html
+++ b/layouts/partials/head/social-images.html
@@ -1,12 +1,12 @@
-{{- /* Default image */ -}}
+{{/* Default image */}}
 {{- $defaultImagePath := (path.Join "content" $.Site.Params.defaultimage) }}
-{{- $.Scratch.Set "defaultImage_url" (replace $defaultImagePath "content/" $.Site.BaseURL) }}
-{{- with (imageConfig $defaultImagePath) }}
+{{ $.Scratch.Set "defaultImage_url" (replace $defaultImagePath "content/" $.Site.BaseURL) }}
+{{ with (imageConfig $defaultImagePath) }}
  {{- $.Scratch.Set "defaultImage_width" .Width }}
  {{- $.Scratch.Set "defaultImage_height" .Height }}
-{{- end }}
+{{ end -}}

-{{- /* Article image (with fallback to default image */ -}}
+{{/* Article image (with fallback to default image */}}
 {{- with .Params.image }}
  {{- $imagePath := (path.Join "content" $.File.Dir "images/" .) }}

@@ -15,18 +15,18 @@
    {{- $.Scratch.Set "socialImage_width" .Width }}
    {{- $.Scratch.Set "socialImage_height" .Height }}
  {{- end }}
-{{- else }}
+{{ else }}
  {{- $.Scratch.Set "socialImage_url" (replace $defaultImagePath "content/" $.Site.BaseURL) }}
  {{- with (imageConfig $defaultImagePath) }}
    {{- $.Scratch.Set "socialImage_width" .Width }}
    {{- $.Scratch.Set "socialImage_height" .Height }}
  {{- end }}
-{{- end }}
+{{ end -}}

-{{- /* Site logo */ -}}
+{{/* Site logo */}}
 {{- $logoImagePath := (path.Join "content" "logo.png") }}
-{{- $.Scratch.Set "logoImage_url" (replace $logoImagePath "content/" $.Site.BaseURL) }}
-{{- with (imageConfig $logoImagePath) }}
+{{ $.Scratch.Set "logoImage_url" (replace $logoImagePath "content/" $.Site.BaseURL) }}
+{{ with (imageConfig $logoImagePath) }}
  {{- $.Scratch.Set "logoImage_width" .Width }}
  {{- $.Scratch.Set "logoImage_height" .Height }}
-{{- end }}
+{{ end -}}
--- a/layouts/shortcodes/image.amp.html
+++ b/layouts/shortcodes/image.amp.html
@@ -3,10 +3,10 @@
 <p class="image">
  <amp-img
    {{- with .Get "alt" }} alt="{{ . | safeHTML }}" title="{{ . | safeHTML }}"{{ else }}
-    {{- with .Inner }} alt="{{ . | markdownify | plainify | safeHTML }}" title="{{ . | markdownify | plainify | safeHTML }}"{{ end }}{{ end }}
+    {{- with .Inner }} alt="{{ . | $.Page.RenderString | plainify | safeHTML }}" title="{{ . | $.Page.RenderString | plainify | safeHTML }}"{{ end }}{{ end }}
    src="{{ $optimized.Permalink }}"
-    width="{{ .Scratch.Get "displayWidth" }}"
-    height="{{ .Scratch.Get "displayHeight" }}"
+    width="{{ $optimized.Width }}"
+    height="{{ $optimized.Height }}"
    layout="intrinsic">
  </amp-img>
 </p>
--- a/layouts/shortcodes/image.html
+++ b/layouts/shortcodes/image.html
@@ -3,12 +3,12 @@
 {{- with .Inner }}
 <figure>
  <picture>
-    <img src="{{ $optimized.Permalink }}" width="{{ $.Scratch.Get "displayWidth" }}" height="{{ $.Scratch.Get "displayHeight" }}"
-         alt="{{ . | markdownify | plainify | safeHTML }}" title="{{ . | markdownify | plainify | safeHTML }}">
+    <img src="{{ $optimized.Permalink }}" width="{{ $optimized.Width }}" height="{{ $optimized.Height }}"
+         alt="{{ . | $.Page.RenderString | plainify | safeHTML }}" title="{{ . | $.Page.RenderString | plainify | safeHTML }}">
  </picture>
  <figcaption>{{ . | $.Page.RenderString | safeHTML }}</figcaption>
 </figure>
 {{- else -}}
-<p><img src="{{ $optimized.Permalink }}" width="{{ $.Scratch.Get "displayWidth" }}" height="{{ $.Scratch.Get "displayHeight" }}"
+<p><img src="{{ $optimized.Permalink }}" width="{{ $optimized.Width }}" height="{{ $optimized.Height }}"
     {{- with .Get "alt" }} alt="{{ . | safeHTML }}" title="{{ . | safeHTML }}"{{ end }}></p>
 {{- end }}
--- a/layouts/shortcodes/image.rss.xml
+++ b/layouts/shortcodes/image.rss.xml
@@ -1,8 +1,8 @@
 {{- $optimized := partial "functions/optimize-image" . -}}

 <p style="text-align: center;">
-<img src="{{ $optimized.Permalink }}" width="{{ .Scratch.Get "displayWidth" }}" height="{{ .Scratch.Get "displayHeight" }}"
+<img src="{{ $optimized.Permalink }}" width="{{ $optimized.Width }}" height="{{ $optimized.Height }}"
     {{- with .Get "alt" }} alt="{{ . | safeHTML }}" title="{{ . | safeHTML }}"{{ end }}
-     {{- with .Inner }} alt="{{ . | markdownify | plainify | safeHTML }}" title="{{ . | markdownify | plainify | safeHTML }}"{{ end }}>
+     {{- with .Inner }} alt="{{ . | $.Page.RenderString | plainify | safeHTML }}" title="{{ . | $.Page.RenderString | plainify | safeHTML }}"{{ end }}>
 {{ with .Inner }}<br>{{ . | $.Page.RenderString | safeHTML }}{{ end -}}
 </p>