{% load i18n %}
{% load static wger_extras thumbnail %}

{% if editable %}
<div class="modal fade" id="editoptions-day-{{ day.obj.id }}">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">{{day.obj.description}}</h4>
            </div>
            <div class="modal-body">
                <a href="{% url 'manager:day:log' day.obj.id %}"
                   title="{% trans 'Add weight log to this day' %}"
                   class="btn btn-default btn-block"
                   {% auto_link_css request.user_agent.is_mobile %}>
                            {% trans 'Add weight log to this day' %}
                </a>
                {% if day.set_list|length > 0 %}
                <a href="{% url 'manager:workout:timer' day.obj.id %}"
                   title="{% trans 'Start gym mode' %}"
                   class="btn btn-default btn-block"
                   {% auto_link_css request.user_agent.is_mobile %}>
                            {% trans "Start gym mode" %}
                </a>
                {% endif %}
                <a href="{% url 'manager:day:edit' day.obj.id %}"
                    title="{% trans 'Edit' %}"
                    class="btn btn-default btn-block"
                    {% auto_link_css request.user_agent.is_mobile "wger-modal-dialog" %}>
                            {% trans 'Edit' %}
                </a>
                <a href="{% url 'manager:day:delete' day.obj.id %}"
                   title="{% trans 'Delete' %}"
                   class="btn btn-default btn-block"
                   {% auto_link_css request.user_agent.is_mobile %}>
                             {% trans "Delete" %}
                </a>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
            </div>
        </div>
    </div>
</div>
{% endif %}


{% if editable %}
{% for set in day.set_list %}
<div class="modal fade" id="editoptions-set-{{ set.obj.id }}">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">
                    {% trans "Options" %} –
                    {% blocktrans with set_nr=forloop.counter %}Set Nr. {{set_nr}}{% endblocktrans %}
                </h4>
            </div>
            <div class="modal-body">
                <a href="{% url 'manager:set:edit' set.obj.id %}"
                   title="{% trans 'Edit' %}"
                   class="btn btn-default btn-block"
                   {% auto_link_css request.user_agent.is_mobile "wger-modal-dialog" %}>
                        {% trans "Edit" %}
                </a>
                <a href="{% url 'manager:set:delete' set.obj.id %}"
                   title="{% trans 'Delete' %}"
                   class="btn btn-default btn-block"
                   {% auto_link_css request.user_agent.is_mobile %}>
                        {% trans "Delete" %}
                </a>

                <h5>{% trans "Exercises" %}</h5>
                {% for exercise in set.exercise_list %}
                    <a href="{{ exercise.obj.get_absolute_url }}"
                       title="{{ exercise.obj.name }}"
                       class="btn btn-default btn-block"
                       {% auto_link_css request.user_agent.is_mobile %}>
                        {{ exercise.obj.name }}
                    </a>
                {% endfor %}
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
            </div>
        </div>
    </div>
</div>
{% endfor %}
{% endif %}


<div class="list-group"
    id="table-day-{{ day.obj.id }}"
    style="margin-top: 3em;">

        {#     #}
        {# Day #}
        {#     #}
        <a href="#editoptions-day-{{ day.obj.id }}" class="list-group-item active" data-toggle="modal">
            {% if editable %}
            <span class="glyphicon glyphicon-cog pull-right"></span>
            {% endif %}

            <h4>{{ day.obj.description }}</h4>
            {{ day.days_of_week.text }}
        </a>


    {#      #}
    {# Sets #}
    {#      #}
    {% for set in day.set_list %}
        {% if set.has_settings %}
            <a href="#editoptions-set-{{ set.obj.id }}"
               class="list-group-item wger-list-group-item"
               data-toggle="modal"
               id="set-{{ set.obj.id }}">
        {% else %}
            <a href="{% url 'manager:set:edit' set.obj.id %}"
               id="set-{{ set.obj.id }}"
               class="list-group-item  wger-modal-dialog">
        {% endif %}

        {% if editable %}
        <span class="glyphicon glyphicon-cog pull-right"></span>
        {% endif %}


        {% for exercise in set.exercise_list %}
            <div id="exercise-{{ exercise.obj.id }}" class="ajax-manager:set:edit-target">
                <div class="media">
                        <div class="media-left">

                            <div style="width: 64px; height: 64px;">
                            {% if exercise.obj.main_image %}
                            <img class="img-responsive"
                                 src="{{ exercise.obj.main_image.image|thumbnail_url:'small' }}"
                                 alt="{{exercise.obj}}"
                                 style="max-width: 100%; max-height: 100%;">
                            {% else %}
                            <img class="img-responsive"
                                 src="{% static 'images/icons/image-placeholder.svg' %}"
                                 alt="{% trans 'Placeholder image for exercise' %}"
                                 style="opacity: 0.4;">
                            {% endif %}
                            </div>

                        </div>
                        <div class="media-body">
                            <h4 class="media-heading">
                                {{ exercise.obj.name }}
                            </h4>
                            <p>{{exercise.setting_text}}</p>

                            {% if not exercise.setting_list %}
                            <p>
                                {% trans "This exercise has no repetitions." %}<br>
                                {% trans "Edit them now."%}
                            </p>
                            {% endif %}

                            {% if editable %}
                            {% if exercise.comment_list %}
                            <p class="text-muted exercise-comments">
                                {% for comment in exercise.comment_list %}
                                    {{comment}}<br>
                                {% endfor %}
                            </p>
                            {% endif %}
                            {% endif %}
                        </div>
                    </div>
            </div>
        {% endfor %} <!--for exercise in set-->
    </a>
    {% empty %}
    {% if editable %}
    <a href="{% url 'manager:set:add' day.obj.id %}"
       class="list-group-item list-group-item-success wger-modal-dialog">
           {% trans "No exercises selected for this day." %}<br>
           {% trans "Add one now." %}
    </a>
    {% endif %}
    {% endfor %} <!--for set in day-->

    {% if day.set_list %}
    {% if editable %}
        <a href="{% url 'manager:set:add' day.obj.id %}" class="list-group-item list-group-item-success wger-modal-dialog">
            <span class="{% fa_class 'plus' %}"></span>
            {% trans "Add exercises to this workout day" %}
        </a>
    {% endif %}
    {% endif %}

</div>

