{% extends '../layouts/mobile.html' %}

{% block main %}
  <h1>{{ article.title }}</h1>
{% endblock %}

{% block content %}
  <div class="row">
    <div class="col-md-8">
      <p>{{ article.body }}</p>
      <div class="meta">
        {% if (article.user) %}
          {% if (article.user.name) %}
            {% set name = article.user.name %}
          {% else %}
            {% set name = article.user.username %}
          {% endif %}

          <a href="{{ '/users/' + article.user._id }}">{{ name }}</a>
        {% endif %}
        {% if (article.tags) %}
          <p>Tags &nbsp;</p>
          {% for tag in article.tags.split(',') %}
            <i class="muted fa fa-tag"></i>&nbsp;
            <a href="{{ '/tags/' + tag }}" class="tag">{{ tag }}</a>
            &nbsp;&nbsp;
          {% endfor %}
        {% endif %}

        <span class="muted">{{ article.createdAt.toISOString()|date('M d, Y  h:m a') }}</span>
      </div>
    </div>
    <div class="col-md-4">
      {% if (!article.isNew && article.image && article.image.files && article.image.files.length) %}
        <img src="{{ article.image.cdnUri + '/mini_' + article.image.files[0] }}" alt="">
      {% endif %}
    </div>
  </div>

  <form action="{{ '/articles/' + article.id }}" method="post" onsubmit="return confirm('Are you sure?')">
    <input type="hidden" name="_csrf" value="{{ csrf_token }}">
    <a href="{{ '/articles/' + article._id + '/edit' }}" title="edit" class="btn btn-default">
      Edit
    </a>
    &nbsp;
    <input type="hidden" name="_method" value="DELETE">
    <button class="btn btn-danger" type="submit">Delete</button>
  </form>

  <br>
  <h3>Comments</h3>
  {% for comment in article.comments %}
    {% include '../comments/comment.html' %}
  {% endfor %}
  {% include '../comments/form.html' %}
{% endblock %}