Prepare thumbnails of all images in the photo post
Add <img> tags for all thumbnails to the photos list entry. I'm hoping with lazy loading and some JavaScript this will not be terrible! Break the logic for preparing a thumbnail into a separate helper partial template so it can be reused.
This commit is contained in:
parent
da994bd6b7
commit
afb59e7862
3 changed files with 85 additions and 6 deletions
28
layouts/partials/photos/thumbnail_for_list.html
Normal file
28
layouts/partials/photos/thumbnail_for_list.html
Normal file
|
@ -0,0 +1,28 @@
|
|||
{{ $thumbnailResource := .Image }}
|
||||
|
||||
{{ $orientation := partial "images/orientation_angle.html" $thumbnailResource }}
|
||||
|
||||
{{ $targetWidth := 0 }}
|
||||
{{ if isset . "Width" }}
|
||||
{{ $targetWidth = .Width }}
|
||||
{{ else }}
|
||||
{{ $targetWidth = $thumbnailResource.Width }}
|
||||
{{ end }}
|
||||
|
||||
{{ $targetHeight := 0 }}
|
||||
{{ if isset . "Height" }}
|
||||
{{ $targetHeight = .Height }}
|
||||
{{ else }}
|
||||
{{ $targetHeight = $thumbnailResource.Height }}
|
||||
{{ end }}
|
||||
|
||||
{{ $thumbnail := false }}
|
||||
{{ if not (and (eq $orientation 0)
|
||||
(eq $targetWidth $thumbnailResource.Width)
|
||||
(eq $targetHeight $thumbnailResource.Height)) }}
|
||||
{{ $thumbnail = $thumbnailResource.Fit (printf "%dx%d r%d" $targetWidth $targetHeight (sub 360 $orientation)) }}
|
||||
{{ else }}
|
||||
{{ $thumbnail = $thumbnailResource }}
|
||||
{{ end }}
|
||||
|
||||
{{ return $thumbnail }}
|
51
layouts/partials/photos/thumbnails.html
Normal file
51
layouts/partials/photos/thumbnails.html
Normal file
|
@ -0,0 +1,51 @@
|
|||
{{ $page := .Page }}
|
||||
|
||||
{{ $thumbnails := slice }}
|
||||
{{ with $thumbnailNamesList := $page.Params "thumbnails" }}
|
||||
{{/* Specify a list of thumbnails to use with the page "thumbnails" param */}}
|
||||
{{ range $thumbnailNamesList }}
|
||||
{{ with $page.Resources.GetMatch . }}
|
||||
{{ $thumbnails = $thumbnails | append . }}
|
||||
{{ else }}
|
||||
{{ errorf "No image resources available for %s from thumbnails param" . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
{{/* Get a list of all the image resources and see if any of them specify
|
||||
thumbnails for themselves. If they do, use those, otherwise use the image
|
||||
resource itself. */}}
|
||||
{{ range $img := $page.Resources.ByType "image" }}
|
||||
{{ with $thumbnailResourceName := $img.params.thumbnail }}
|
||||
{{ with $page.Resources.GetMatch $thumbnailResourceName }}
|
||||
{{ $thumbnails = $thumbnails | append . }}
|
||||
{{ else }}
|
||||
{{ errorf "No image resources available for '%s' from thumbnail param for image resources %s"
|
||||
$thumbnailResourceName
|
||||
$img.Name }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
{{/* TODO: Look for a named image that indicates it's a thumbnail of
|
||||
another resources. Something like ${imgBasename}_thumbnail.${ext}.
|
||||
I don't know how easy Hugo makes filename processing, so this could
|
||||
be painful. */}}
|
||||
{{ $thumbnails = $thumbnails | append $img }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
{{ if eq (len $thumbnails) 0 }}
|
||||
{{ errorf "Couldn't find any thumbnails for %s" $page.Permalink }}
|
||||
{{ end }}
|
||||
|
||||
{{ $thumbnailOptions := dict }}
|
||||
{{ if isset . "Width" }}{{ $thumbnailOptions = $thumbnailOptions | merge (dict "Width" .Width) }}{{ end }}
|
||||
{{ if isset . "Height" }}{{ $thumbnailOptions = $thumbnailOptions | merge (dict "Height" .Height) }}{{ end }}
|
||||
|
||||
{{ $processedThumbnails := slice }}
|
||||
{{ range $thumbnails }}
|
||||
{{ $options := $thumbnailOptions | merge "Image" . }}
|
||||
{{ $processedThumbnail := partial "photos/thumbnail_for_list.html" $options }}
|
||||
{{ $processedThumbnails = $processedThumbnails | append $processedThumbnail }}
|
||||
{{ end }}
|
||||
|
||||
{{ return $processedThumbnails }}
|
Loading…
Add table
Add a link
Reference in a new issue