{% extends 'includes/layout.swig' %}

{% macro PostTags(post) %}
<div>
{% for k in Object.keys(post.tags.data) %}
  <a href="{{ url_for(post.tags.data[k].path)}}"><div class="chip">
    {{post.tags.data[k].name}}
  </div></a>
  {% endfor %}
</div>
{% endmacro %}

{% macro Gallery(photos) %}
    <div class="row">
      <div class="col">
        {% set i = 0 %}
        {% for p in photos %}
          {% set i = i + 1 %}
          <img onerror="M.toast({ html: 'Some photos could not be showed at the moment, please try again later.' });" src="{{p}}" data-caption="{{i}}" class="responsive-img materialboxed gallery-img" async />
        {% endfor %}
      </div>
  </div>
{% endmacro %}

{% block body %}
  <article id="post">
    <div class="card">
    <div class="card-content">
      <span class="card-title">{{ page.title }}</span>
      <div class="row">
        <div class="col" style="padding-left:0;"><span class="mdi mdi-account">{{config.author}}</span></div>
        <div class="col"><span class="mdi mdi-clock">{{date(page.date, 'YYYY/M/D')}}</span></div>
      </div>
      {{ PostTags(page) }}
      {% if page.photos && page.photos.length > 0%}
      {{Gallery(page.photos)}}
      {% endif %}
      <div class="entry">
      {% autoescape false %}{{ page.content }}{% endautoescape %}
      </div>
    </div>
    </div>
  </article>

  <div id="paginator">
    {{ paginator() }}
  </div>
{% endblock %}