{{ $contextType := printf "%T" . }}
{{ $isShortcode := (eq $contextType "*hugolib.ShortcodeWithPage") }}

{{/*
  sectionId: Optional argument to override the default HTML id for this section. If not provided, the default id is used.
  hideViewAll: Optional argument to hide the "View All" button. Set to "true" to hide the button. */}}
{{ $sectionId := "experience-single" }}
{{ $showViewAll := true }}
{{ if $isShortcode }}
  {{ with .Get "sectionId" }}
    {{ $sectionId = . }}
  {{ end }}
  {{ $hideViewAllParam := .Get "hideViewAll" }}
  {{ if eq $hideViewAllParam "true" }}
    {{ $showViewAll = false }}
  {{ end }}
{{ end }}

<section {{if $sectionId}} id="{{ $sectionId }}"{{end}} class="section-experience section section--border-bottom rad-animation-group flex-grow-1">
  <div class="row flex-column-reverse flex-md-row rad-fade-down">
    <div class="experience-list col-12 col-md-6">
      <h2>
        {{ if $isShortcode }}
          {{ .Get "title" | default "" }}
        {{ else }}
          {{ i18n "experience_title" }}
        {{ end }}
      </h2>

      {{ $xp := where .Site.RegularPages.ByDate "Type" "experience" }}
      {{ if not $isShortcode }}
        {{ $baseLangSite := .Sites.Default }}
        {{ $xp = $xp | lang.Merge (where $baseLangSite.RegularPages.ByDate.Reverse "Type" "experience") }}
      {{ end }}

      {{ $xpCount := len $xp }}
{{/* in the homepage we limit to the homepageExperienceCount param (6 by default) in the inner page (experience) we display the all */}}
      {{ $totalCount := .Site.Params.homepageExperienceCount }}

      {{ if not $isShortcode }}
      {{ if not .IsHome }}
        {{ $totalCount = $xpCount }}
      {{ end }}
      {{ end }}

      {{ range first $totalCount (sort $xp "Date" "desc") }}
      <div class="experience">
        <a href="{{ .Permalink | relURL }}" class="experience__link">
          <div class="experience__header">
            {{ $img := resources.Get .Params.companyLogo }}
            {{ with $img }}
              {{ $imgWebp := $img.Resize (printf "%dx%d webp q75 Lanczos picture" $img.Width $img.Height) }}
              <img 
                src="{{ $imgWebp.RelPermalink }}" 
                alt="{{ .Params.company }} logo"
                class="experience__company-logo"
                loading="lazy"
              />
            {{ end }}
            <div class="experience__meta">
              <div class="experience__date">{{ .Params.duration }}</div>
              <div class="experience__title">{{ .Params.jobTitle }}</div>
              <div class="experience__company">
                {{ .Params.company }}.
                <span class="experience__location">{{ .Params.location }}</span>
              </div>
            </div>
            <div class="experience__description d-none d-print-block">
              <h1>{{ .Params.title }}</h1>
              {{ .Content | safeHTML | transform.Plainify }}
            </div>
          </div>
        </a>
      </div>
      {{ end }}

      {{ if and (gt $xpCount $totalCount) $showViewAll }}
      <div class="all-experience-container">
        {{ $xpExtra := sub $xpCount $totalCount }}
        <em>And {{ $xpExtra }} more</em><br />
        <a href="{{ absURL "experience" | relLangURL }}" class="btn btn-primary btn-all-experience">
          <i class="{{ .Site.Data.homepage.experience.button3.icon }}"></i>
          {{ i18n "experience_button3" }}
        </a>
      </div>
      {{ end }}
    </div>
    <div class="experience-description col-12 col-md-6">
      {{ partial "experience-description.html" . }}
    </div>
  </div>
</section>