{{ .Page.Scratch.Add "hasImages" "true" }}
{{/* Get the image */}}
{{- $img := .src -}}
{{- $width := 350 -}}
{{- $isRemote := strings.HasPrefix $img "http" -}}
{{- $originalImg := "" -}}
{{- if not $isRemote -}}
{{- $img = .Page.Resources.GetMatch $img -}}
{{- if and (not $img) .Page.File -}}
{{- $path := path.Join .Page.File.Dir $img -}}
{{- $img = resources.Get $path -}}
{{- end -}}
{{- $originalImg = $img -}}
{{/* Resize the image if applicable */}}
{{- $img = ($img.Resize (print $width "x")).RelPermalink -}}
{{- end -}}
<div class="box"{{ with $width }} style="max-width:{{ . }}px;"{{ end }}>
  <figure>
    <img data-src="{{ $img }}"
         {{- if or .alt .caption }}
         alt="{{ with .alt }}{{ . }}{{ else }}{{ .caption | markdownify | plainify }}{{ end }}"
         {{- else -}}
         alt=""
         {{- end -}}
         draggable="false" ondragstart="return false;"
         class="lazyload imageGalleryTrigger"
         {{- with .title }} imgTitle="{{ . | plainify }}"{{ end -}}
         {{- with .caption }} imgCaption="{{ . | markdownify | plainify }}"{{ end -}}
         {{- with .attr }} attr="{{ . | markdownify | plainify }}"{{ end -}}
         {{- with .attrlink }} attrlink="{{ . | plainify }}"{{ end -}}
         {{- if .link }}
          {{- $target := .linkTarget | default "_blank" -}}
          linkhref="{{ .Get "link" }}"
          {{- with .linkTxt }} linkTxt="{{ . | markdownify | plainify }}"{{ end -}}
          linktarget="{{ $target }}"
          linkrel="{{- with .linkRel }}{{ . | plainify }}{{ else }}{{ if eq $target "_blank" }}noreferrer{{ end }}{{ end -}}"         
         {{ end -}}
         {{/* Link the high res version of the image if applicable. */}}
         {{- if (not $isRemote) }}
          hsrc="{{ $originalImg.RelPermalink }}"
          hwidth="{{ $originalImg.Width }}"
          hheight="{{ $originalImg.Height }}"
         {{ end -}}
     />
    {{- if or .title .caption -}}
    <figcaption>
        {{- with .title -}}
        <h4>{{ . }}</h4>
        {{- end -}}
        {{- with .caption -}}
        <p>{{ . }}</p>
        {{- end -}}
    </figcaption>
    {{- end -}}
  </figure>
</div>