{% extends 'base.html' %}

{% load i18n %}


{% block meta_title %}
    {% trans 'Reviews' %}
{% endblock %}


{% block content %}

    <div class="container">
        {% block new_review_btn %}
            <button type="button" class="btn btn-lg btn-success"
                    data-role="show-new-review-modal">
                <i class="fa fa-envelope"></i>
                {% trans 'New review' %}
            </button>
        {% endblock %}

        <div class="clearfix"></div>

        {% for object in object_list %}
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4>{{ object.name }}</h4>
                </div>
                <div class="panel-body">
                    <b>{% trans 'Rating' %}:</b>
                    <div class="rateit" data-rateit-value="{{ object.rating }}"
                         data-rateit-ispreset="true" data-rateit-readonly="true"></div> |
                    <b>{% trans 'Date' %}:</b> {{ object.date_created|date:'d E Y' }}
                </div>
                <div class="panel-body">
                    <p>{{ object.text }}</p>
                    {% if object.photo %}
                        <img src="{{ object.photo.url }}"
                             alt="{{ object.name }}"
                             class="img-responsive"
                             style="max-width: 700px;">
                    {% endif %}
                </div>

                {% if object.answer %}
                    <div class="panel-footer">
                        <strong>{{ request.get_host|title }}:</strong> <br />
                        {{ object.answer }}
                    </div>
                {% endif %}
            </div>
        {% endfor %}

        {{ page_obj.render }}
    </div>

{% endblock %}


{% block js %}
    {{ block.super }}

    <script>
        $(window).on('load', function() {

            new NewReviewModal({
                url: '{% url 'reviews:api' %}',
                csrf: '{{ csrf_token }}',
                $target: $('[data-role="show-new-review-modal"]')
            });

        });
    </script>
{% endblock %}