{{ $ := .root }}
{{ $page := .page }}

{{ $author := "" }}
{{ if .author }}
  {{ $author = .author }}
{{ else }}
  {{ $author = $page.Params.author }}
{{end}}

{{ $person_page_path := (printf "/authors/%s" $author) }}
{{ $person_page := site.GetPage $person_page_path }}
{{ if not $person_page }}
  {{ errorf "Could not find an author page at `%s`. Please check the value of `author` in your About widget and create an associated author page if one does not already exist. See https://wowchemy.com/docs/page-builder/#about " $person_page_path }}
{{end}}
{{ $person := $person_page.Params }}
{{ $avatar := ($person_page.Resources.ByType "image").GetMatch "*avatar*" }}
{{ $avatar_shape := site.Params.features.avatar.shape | default "circle" }}

<!-- About widget -->
<div class="row">
  <div class="col-12 col-lg-4">
    <div id="profile">

      {{ if site.Params.features.avatar.gravatar }}
      <img class="avatar {{if eq $avatar_shape "square"}}avatar-square{{else}}avatar-circle{{end}}" src="https://s.gravatar.com/avatar/{{ md5 $person.email }}?s=270')" alt="{{$person_page.Title}}">
      {{ else if $avatar }}
      {{ $avatar_image := $avatar.Fill "270x270 Center" }}
      <img class="avatar {{if eq $avatar_shape "square"}}avatar-square{{else}}avatar-circle{{end}}"
           width="{{ $avatar_image.Width }}" height="{{ $avatar_image.Height }}"
           src="{{ $avatar_image.RelPermalink }}" alt="{{$person_page.Title}}">
      {{ end }}

      <div class="portrait-title">

        <h2>
          {{- if $person.name_pronunciation -}}
            <ruby>
              <rb>{{ $person_page.Title }}</rb>
              <rt>{{ $person.name_pronunciation }}</rt>
            </ruby>
          {{- else -}}
            {{- $person_page.Title -}}
          {{- end -}}
        </h2>

        {{ with $person.role }}<h3>{{ . | markdownify | emojify }}</h3>{{ end }}

        {{ range $person.organizations }}
        <h3>
          {{ with .url }}<a href="{{ . }}" target="_blank" rel="noopener">{{ end }}
          <span>{{ .name }}</span>
          {{ if .url }}</a>{{ end }}
        </h3>
        {{ end }}
      </div>

      <ul class="network-icon" aria-hidden="true">
        {{ range $person.social }}
        {{ $pack := or .icon_pack "fas" }}
        {{ $pack_prefix := $pack }}
        {{ if in (slice "fab" "fas" "far" "fal") $pack }}
          {{ $pack_prefix = "fa" }}
        {{ end }}
        {{ $link := .link }}
        {{ $scheme := (urls.Parse $link).Scheme }}
        {{ $target := "" }}
        {{ if not $scheme }}
          {{ $link = .link | relLangURL }}
        {{ else if in (slice "http" "https") $scheme }}
          {{ $target = "target=\"_blank\" rel=\"noopener\"" }}
        {{ end }}
        <li>
          <a href="{{ $link | safeURL }}" {{ $target | safeHTMLAttr }} aria-label="{{ .icon }}">
            <i class="{{ $pack }} {{ $pack_prefix }}-{{ .icon }} big-icon"></i>
          </a>
        </li>
        {{ end }}
      </ul>

    </div>
  </div>
  <div class="col-12 col-lg-8">

    {{/* Only display widget title in explicit instances of about widget, not in author pages. */}}
    {{ if and $page.Params.widget $page.Title }}<h1>{{ $page.Title | markdownify | emojify }}</h1>{{ end }}

    <div class="article-style">
      {{ $person_page.Content }}
    </div>

    <div class="row">

      {{ with $person.interests }}
      <div class="col-md-5">
        <div class="section-subheading">{{ i18n "interests" | markdownify }}</div>
        <ul class="ul-interests mb-0">
          {{ range . }}
          <li>{{ . | markdownify | emojify }}</li>
          {{ end }}
        </ul>
      </div>
      {{ end }}

      {{ with $person.education }}
      <div class="col-md-7">
        <div class="section-subheading">{{ i18n "education" | markdownify }}</div>
        <ul class="ul-edu fa-ul mb-0">
          {{ range .courses }}
          <li>
            <i class="fa-li fas fa-graduation-cap"></i>
            <div class="description">
              <p class="course">{{ .course }}{{ with .year }}, {{ . }}{{ end }}</p>
              <p class="institution">{{ .institution }}</p>
            </div>
          </li>
          {{ end }}
        </ul>
      </div>
      {{ end }}

    </div>
  </div>
</div>