♻️ refactor: encapsulates functions in render-image.html

This commit is contained in:
ZhenShuo Leo
2025-05-25 23:29:48 +08:00
parent 4688d1e8c4
commit 6ab1964e22

View File

@@ -1,49 +1,50 @@
{{ define "inline-image-simple" -}}
<img class="my-0 rounded-md" loading="lazy" alt="{{ .alt }}" src="{{ .src }}" />
{{- end }}
{{ define "inline-image-responsive" -}}
<img
class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="low" alt="{{ .alt }}"
srcset="
{{ (.resource.Resize "330x").RelPermalink }} 330w,
{{ (.resource.Resize "660x").RelPermalink }} 660w,
{{ (.resource.Resize "1280x").RelPermalink }} 1280w"
data-zoom-src="{{ .resource.RelPermalink }}"
src="{{ .resource.RelPermalink }}"
/>
{{- end }}
{{ define "inline-image-caption" -}}
{{- with .caption }}
<figcaption>{{ . | markdownify }}</figcaption>
{{- end }}
{{- end }}
{{- $disableImageOptimization := .Page.Site.Params.disableImageOptimization | default false }}
{{- $url := urls.Parse .Destination }}
{{- $altText := .Text }}
{{- $caption := .Title }}
{{- if findRE "^https?" $url.Scheme }}
<figure>
<img class="my-0 rounded-md" loading="lazy" src="{{ $url.String }}" alt="{{ $altText }}" />
{{ with $caption }}<figcaption>{{ . | markdownify }}</figcaption>{{ end }}
</figure>
{{- else }}
{{- $resource := "" }}
{{- if $.Page.Resources.GetMatch ($url.String) }}
{{- $resource = $.Page.Resources.GetMatch ($url.String) }}
{{- else if resources.GetMatch ($url.String) }}
{{- $resource = resources.Get ($url.String) }}
{{- end }}
{{- with $resource }}
<figure>
{{- if or $disableImageOptimization (eq .MediaType.SubType "svg")}}
<img
class="my-0 rounded-md"
loading="lazy"
src="{{ .RelPermalink }}"
alt="{{ $altText }}"
/>
{{- else }}
<img
class="my-0 rounded-md"
loading="lazy"
decoding="async"
fetchpriority="low"
srcset="
{{ (.Resize "330x").RelPermalink }} 330w,
{{ (.Resize "660x").RelPermalink }} 660w,
{{ (.Resize "1280x").RelPermalink }} 1280w"
data-zoom-src="{{ .RelPermalink }}"
src="{{ .RelPermalink }}"
alt="{{ $altText }}"
/>
{{- end }}
{{ with $caption }}<figcaption>{{ . | markdownify }}</figcaption>{{ end }}
</figure>
{{- else }}
<figure>
<img class="my-0 rounded-md" loading="lazy" src="{{ $url.String }}" alt="{{ $altText }}" />
{{ with $caption }}<figcaption>{{ . | markdownify }}</figcaption>{{ end }}
</figure>
{{- end }}
{{- $isRemote := findRE "^https?" $url.Scheme }}
{{- $resource := "" }}
{{- if not $isRemote }}
{{- $resource = or ($.Page.Resources.GetMatch $url.String) (resources.Get $url.String) }}
{{- end }}
<figure>
{{- if $isRemote }}
{{ template "inline-image-simple" (dict "src" $url.String "alt" $altText) }}
{{- else if $resource }}
{{- $isSVG := eq $resource.MediaType.SubType "svg" }}
{{- $shouldOptimize := and (not $disableImageOptimization) (not $isSVG) }}
{{- if $shouldOptimize }}
{{ template "inline-image-responsive" (dict "resource" $resource "alt" $altText) }}
{{- else }}
{{ template "inline-image-simple" (dict "src" $resource.RelPermalink "alt" $altText) }}
{{- end }}
{{- else }}
{{ template "inline-image-simple" (dict "src" $url.String "alt" $altText) }}
{{- end }}
{{ template "inline-image-caption" (dict "caption" $caption) }}
</figure>