{# For SEO purposes, we avoid displaying more than one H1 tag. #}
{% set Htag = listing ? 'h2' : 'h1' %}

{# Set avatar image and primary image #}
{% set avatar = page.media[page.header.avatarImage].url|e  %}
{% set image = page.media[page.header.primaryImage] ?: page.media.all|filter((v, k) => k != page.header.avatarImage and (v.type == 'image' or v.type == 'vector'))|first %}

{# Set page author #}
{% if page.header.metadata.author %}
  {% set author = page.header.metadata.author %}
{% elseif page.header.author %}
  {% set author = page.header.author %}
{% else %}
  {% set author = page.taxonomy.author[0] %}
{% endif %}

<article class="post" itemprop="liveBlogUpdate" itemscope itemtype="http://schema.org/BlogPosting">

  <header>
    <div class="title">
      {% if page.header.link %}
        <{{ Htag }} itemprop="headline">
          {% if page.header.continue_link is not sameas(false) %}
            <a href="{{ page.url }}" aria-label="{{ title }}"></a>
          {% endif %}
          <a href="{{ page.header.link }}" aria-label="{{ title }}">{{ title }}</a>
        </{{ Htag }}>
      {% else %}
       <{{ Htag }} itemprop="headline">
          <a href="{{ page.url }}" aria-label="{{ title }}">{{ title }}</a>
        </{{ Htag }}>
      {% endif %}
      {% if subtitle %}
        <p itemprop="alternativeHeadline">{{ subtitle|raw }}</p>
      {% endif %}
    </div>
    <div class="meta">
      {# Support for reading time plugin #}
      {% if config.plugins.readingtime.enabled %}
        <span class="reading-time"><i class="fas fa-book-reader"></i> {{ page.content|readingtime}}</span>
      {% endif %}
      
      <time class="published" itemprop="datePublished" datetime="{{ datestamp }}">{{ datestamp }}</time>

      {% if author %}
        <span itemprop="author" itemscope itemtype="http://schema.org/Person"/>
        <a {% if page.taxonomy.author %}href="{{ blog.url }}/author{{ config.system.param_sep }}{{ author }}" itemprop="url" {% endif %}class="author" aria-label="{{ author }}" rel="nofollow">
          <span class="name" rel="author">{{ author }}</span>
          {% if avatar %}<img src="{{ avatar }}" alt="{{ author }}" />{% endif %}
        </a>
      {% endif %}
    </div>
  </header>
  {% if show_image and image %}
  <a class="image featured" href="{{ page.url }}" title="{{ title|raw }}" rel="nofollow">
    {{ image.cropZoom(img_width,img_height).loading('lazy').attribute('decoding','async').html(title, title)|raw }}
  </a>
  {% endif %}
  <div itemprop="articleBody">
    {% if page.header.continue_link is sameas(false) %}
      {{ page.content|raw }}
      {% if not truncate %}
        {% set show_prev_next = true %}
      {% endif %}
    {% elseif truncate and page.summary != page.content %}
      {{ page.summary|raw }}
    {% elseif truncate %}
      {{ page.content|truncate(550)|raw }}
    {% else %}
      {{ page.content|raw }}
      {% set show_prev_next = true %}
    {% endif %}
  </div>

  <footer>
    <ul class="actions">
      {% if truncate and page.summary != page.content %}
        <li><a href="{{ page.url }}" class="button" rel="nofollow">{{'FUTURE.BLOG.ITEM.CONTINUE_READING'|t}}</a></li>
      {% elseif truncate %}
        <li><a href="{{ page.url }}" class="button" rel="nofollow">{{'FUTURE.BLOG.ITEM.CONTINUE_READING'|t}}</a></li>
      {% endif %}

      {% if show_prev_next %}
        {% if not page.isLast %}
          <li>
            <a class="button" href="{{ page.prevSibling.url }}" rel="prev">
              <i class="fa fa-chevron-left"></i>
              {{'FUTURE.BLOG.ITEM.PREV_POST'|t}}</a>
          </li>
        {% endif %}
        {% if not page.isFirst %}
          <li>
            <a class="button" href="{{ page.nextSibling.url }}" rel="next">{{'FUTURE.BLOG.ITEM.NEXT_POST'|t}}
              <i class="fa fa-chevron-right"></i>
            </a>
          </li>
        {% endif %}
      {% endif %}
    </ul>

    {% if page.taxonomy.tag %}
    <ul class="stats">
        {% for tag in page.taxonomy.tag %}
          <li><a href="{{ blog.url }}/tag{{ config.system.param_sep }}{{ tag }}" itemprop="keywords" rel="nofollow">{{ tag }}</a></li>
        {% endfor %}
     </ul>
    {% endif %}
    <ul class="share">
      {% set share = [
      { 'name': 'facebook', 'icon': 'fa-facebook', 'enabled': header_var('shareicons.facebook')|defined(true), 'url': 'https://www.facebook.com/sharer/sharer.php?', 'params': {'u': page.url(true)} },
      { 'name': 'twitter', 'icon': 'fa-twitter', 'enabled': header_var('shareicons.twitter')|defined(true), 'url': 'https://twitter.com/intent/tweet?', 'params': {'text': page.title, 'url': page.url(true)} },
      { 'name': 'whatsapp', 'icon': 'fa-whatsapp', 'enabled': header_var('shareicons.whatsapp')|defined(true), 'url': 'https://wa.me/?', 'params': {'text': page.title ~ '. ' ~ page.url(true)}, 'action': 'share/whatsapp/share' },
      { 'name': 'telegram', 'icon': 'fa-telegram', 'enabled': header_var('shareicons.telegram')|defined(true), 'url': 'https://t.me/share/url?', 'params': {'url': page.url(true), 'text': page.title} },
      ] %}
      {% for item in share %}
          {% if item.enabled|defined(true) %}
              <li><a class="icon brands {{ item.icon }}" target="_blank" href="{{- item.url -}}{{- item.params|url_encode-}}" {% if item.action is defined %}data-action="{{ item.action }}"{% endif %} aria-label="{{ 'FUTURE.MISC.SHARE_ON'|t }} {{ item.name|capitalize }}" title="{{ 'FUTURE.MISC.SHARE_ON'|t }} {{item.name|capitalize }}"></a></li>
          {% endif %}
      {% endfor %}
    </ul>
  </footer>
</article>
