hermit-V2/layouts/shortcodes/figure.html

104 lines
4.2 KiB
HTML
Raw Permalink Normal View History

2023-11-16 11:57:38 -05:00
{{/* Extending upon [https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/shortcodes/figure.html] */}}
{{/* Help from [https://discourse.gohugo.io/t/has-anyone-a-webp-shortcode/35391] */}}
{{- $path := .Get "src" -}}
{{- $link := .Get "link" -}}
{{- $target := .Get "target" -}}
{{- $rel := .Get "rel" -}}
{{- $class := .Get "class" -}}
{{- $alt := .Get "alt" -}}
{{- $attr := .Get "attr" -}}
{{- $attrlink := .Get "attrlink" -}}
{{- $title := .Get "title" -}}
{{- $width := .Get "width" -}}
{{- $height := .Get "height" -}}
{{- $caption := .Get "caption" -}}
{{- $loading := .Get "loading" -}}
{{- $jpg := "" -}}
{{- $webp := "" -}}
{{- $fitOptionstojpg := printf "%vx%v jpg" $width $height -}}
{{- $fitOptionstowebp := printf "%vx%v webp" $width $height -}}
{{- $msg1 := "The %q shortcode requires a parameter named %q. See %s" -}}
{{- $msg2 := "The resource %q passed to the %q shortcode is not an image. See %s" -}}
{{- $msg3 := "The resource %q passed to the %q shortcode could not be found. See %s" -}}
{{- if not (findRE `http[s]{0,1}://` $path 1) -}}
{{ if not $path }}
{{ errorf $msg1 .Name "path" .Position }}
{{ end }}
{{- with $i := resources.Get $path -}}
{{- if eq $i.MediaType.MainType "image" -}}
{{- if not $width -}}{{- $width = $i.Width -}}{{- end -}}
{{- if not $height -}}{{- $height = $i.Height -}}{{- end -}}
{{- if eq $i.MediaType "image/webp" -}}
{{- $jpg = $i.Fit $fitOptionstojpg -}}
{{- $webp = $i -}}
{{- else if eq $i.MediaType "image/jpeg" -}}
{{- $webp = $i.Fit $fitOptionstowebp -}}
{{- $jpg = $i -}}
{{- else -}}
{{- $fitOptions := printf "%vx%v jpg" $width $height -}}{{- $jpg = $i.Fit $fitOptions -}}
{{- $fitOptions = printf "%vx%v webp" $width $height -}}{{- $webp = $i.Fit $fitOptions -}}
{{- end -}}
<figure{{ with $class }} class="{{ . }}" {{ end }}>
{{- if $link -}}
<a href="{{ $link }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>
{{- end -}}
<picture>
<source srcset="{{ $webp.RelPermalink }}" type="image/webp">
<source srcset="{{ $jpg.RelPermalink }}" type="image/jpeg">
<img src="{{ $webp.RelPermalink }}"
{{- if or $alt $caption -}} alt="{{ with $alt }}{{ . }}{{ else }}{{ $caption | markdownify| plainify }}{{ end }}" {{- end -}}
{{- with $jpg.Width }} width="{{ . }}" {{ end -}}
{{- with $jpg.Height }} height="{{ . }}" {{ end -}}
{{- with $loading }} loading="{{ . }}" {{ end -}} />
</picture>
{{- if $link }}</a>{{ end -}}
{{- if or (or $title $caption) $attr -}}
<figcaption>
{{ with $title -}}<h4>{{ . }}</h4>{{- end -}}
{{- if or $caption $attr -}}<p>
{{- $caption | markdownify -}}
{{- with $attrlink }}<a href="{{ . }}">{{- end -}}
{{- $attr | markdownify -}}
{{- if $attrlink }}</a>{{ end }}</p>
2023-08-06 09:16:12 -04:00
{{- end }}
2023-11-16 11:57:38 -05:00
</figcaption>
{{- end -}}
</figure>
{{- else -}}
{{- errorf $msg2 $path $.Name $.Position -}}
{{- end -}}
{{- else -}}
{{- errorf $msg3 $path .Name .Position -}}
{{- end -}}
{{- else -}}
<figure{{ with $class }} class="{{ . }}" {{ end }}>
{{- if $link -}}<a href="{{ $link }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{- end -}}
<img src="{{ $path }}"
{{- if or $alt $caption -}} alt="{{ with $alt }}{{ . }}{{ else }}{{ $caption | markdownify| plainify }}{{ end }}" {{- end -}}
{{- with $width }} width="{{ . }}" {{ end -}}
{{- with $height }} height="{{ . }}" {{ end -}}
{{- with $loading }} loading="{{ . }}" {{ end -}} />
{{- if $link }}</a>{{ end -}}
{{- if or (or $title $caption) $attr -}}
<figcaption>
{{ with $title -}}<h4>{{ . }}</h4>{{- end -}}
{{- if or $caption $attr -}}<p>
{{- $caption | markdownify -}}
{{- with $attrlink }}<a href="{{ . }}">{{- end -}}
{{- $attr | markdownify -}}
{{- if $attrlink }}</a>{{ end }}</p>
{{- end }}
</figcaption>
{{- end -}}
</figure>
{{- end -}}