{% extends 'base.html' %}
{% load crispy_forms_tags %}

{% block content %}
{% for review in reviews %}

<article class="media content-section">
    <div class="media-body">
        <div class="article-metadata">
            <small class="text-muted">{{ review.create_time|date:"F d, Y" }}</small>
            <small class="text-muted"> at <b>{{ review.page }}</b></small>
            <a href="{% url 'facebook-reviews-details' review.id %}">
              {% if review.recommendation_type %}
                  <span style="color: green; float: right">Recommended</span>
              {% else %}
                  <span style="color: red; float: right">Not Recommended</span>
              {% endif %}
            </a>
          <button class="btn btn-link"><a href="https://facebook.com/{{ review.id }}" target="_blank">Link</a></button>
        </div>
        {% if review.review_text %}
          <p class="article-content">{{ review.review_text }}</p>
        {% endif %}
        <form method="post" class="form" action="{% url 'facebook-reviews' %}">
            {% csrf_token %}
                {{ form|crispy }}
            <input type="hidden" value="{{ review.id }}" name="review_id">
            <input class="btn btn-primary ml-2" style="float: right" type="submit", value="Submit"/>
            {% if review.review_text%}
                <a href="{% url 'facebook-reviews-prediction' review.id %}" class="btn btn-info">Analyze</a>
            {% endif %}
        </form>
        </div>

</article>
{% endfor %}
    <div align="center">
        {% if reviews.has_other_pages %}

          {% if reviews.has_previous %}
            <a class="btn btn-outline-info mb-4" href="?page=1">First</a>
            <a class="btn btn-outline-info mb-4" href="?page={{ reviews.previous_page_number }}">Previous</a>
          {% endif %}

          {% for num in reviews.paginator.page_range %}
            {% if reviews.number == num %}
              <a class="btn btn-info mb-4" href="?page={{ num }}">{{ num }}</a>
            {% elif num > reviews.number|add:'-3' and num < reviews.number|add:'3' %}
              <a class="btn btn-outline-info mb-4" href="?page={{ num }}">{{ num }}</a>
            {% endif %}
          {% endfor %}

          {% if reviews.has_next %}
            <a class="btn btn-outline-info mb-4" href="?page={{ reviews.next_page_number }}">Next</a>
            <a class="btn btn-outline-info mb-4" href="?page={{ reviews.paginator.num_pages }}">Last</a>
          {% endif %}

        {% endif %}
    </div>
{% endblock %}