{% extends "base.html" %}
{% load i18n %}
{% load staticfiles %}
{% load wger_extras %}

{#           #}
{# Opengraph #}
{#           #}
{% block opengraph %}
    {{ block.super }}
    <meta property="og:title" content="{% trans 'Workout' %}">
    <meta property="og:description" content="{{ workout }} / {{owner_user.username}}">
{% endblock %}


{#       #}
{# Title #}
{#       #}
{% block title %}{% trans "Workout" %} – {{ workout.creation_date }}{% endblock %}


{#        #}
{# Header #}
{#        #}
{% block header %}
<script>
function custom_modal_init()
{
    // Set up the edit set functions on modal dialogs
    init_edit_set();
}


$(document).ready(function() {
    /*
     * Show/Hide the comments to the exercises
     */
    {% if user.userprofile.show_comments %}
        $(".exercise-comments").show();
    {% else %}
        $(".exercise-comments").hide();
    {% endif %}
    toggle_comments();

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


{#         #}
{# Content #}
{#         #}
{% block content %}
{% if workout.comment %}
<p>
    <span class="text-muted">{{workout.comment}}</span>
</p>
{% endif %}

{% for day in workout.canonical_representation.day_list %}
    <div id="div-day-{{ day.obj.id }}">
        {% render_day day.obj is_owner %}
    </div>
{% empty %}

    <div class="list-group">
        <a href="{% url 'manager:day:add' workout.id %}" class="list-group-item list-group-item-success wger-modal-dialog">
            {% trans "No days for this workout." %}<br>
            {% trans "Add training day." %}
        </a>
    </div>
{% endfor %}


<p style="margin-top:2em;">
    {% if is_owner %}
    <a href="{% url 'manager:day:add' workout.id %}" {% auto_link_css flavour "wger-modal-dialog" %}>
        {% trans "Add training day" %}
    </a>
    
    <a id="exercise-comments-toggle"
       href="{% url 'core:user:preferences' %}"
       {% auto_link_css flavour %}>
        {% trans "Show/Hide exercise comments" %}
    </a>
    {% endif %}
</p>
{% endblock %}



{#          #}
{# Side bar #}
{#          #}
{% block sidebar %}
<h4>{% trans "Steps" %}</h4>

<ol>
    <li>{% trans "Add training days" %}</li>
    <li>{% trans "Add workout sets to days" %}</li>
    <li>
        {% trans "Set the repetitions for each set" %}
        ({% trans "use '99' for 'all repetitions you can do'" %})
    </li>
</ol>


<h4>{% trans "Muscles trained" %}</h4>

<p>
    {% trans "Images show combined muscles as trained by the exercises on the workout." %}
</p>

<div class="row">
    <div class="col-xs-6">
        <div id="muscle-front"
                class="muscle-background center-block"
                style="width: 120px; height: 220px; background-size: 120px; background-image: {% for background in muscle_backgrounds_front %}url({% static background %}){% if not forloop.last %},{% endif %}{% endfor %};">
        </div>
    </div>
    <div class="col-xs-6">
        <div id="muscle-back"
                class="muscle-background center-block"
                style="width: 120px; height: 220px; background-size: 120px; background-image: {% for background in muscle_backgrounds_back %}url({% static background %}){% if not forloop.last %},{% endif %}{% endfor %};">
        </div>
    </div>
</div>



<h4>{% trans "Options" %}</h4>

<a href="#export-pdf-link" data-toggle="modal" {% auto_link_css flavour %}>
    <img src="{% static 'images/icons/save.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'Download as PDF' %}"
         title="{% trans 'Download as PDF' %}">
    {% trans "Download as PDF" %}
</a>

<a href="{% url 'manager:log:log' workout.id %}" {% auto_link_css flavour %}>
   <img src="{% static 'images/icons/statistics.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'View weight log' %}"
         title="{% trans 'View weight log' %}">
   {% trans "View weight log" %}
</a>

{% if is_owner %}
<a href="{% url 'manager:workout:edit' workout.id %}" {% auto_link_css flavour "wger-modal-dialog" %}>
   <img src="{% static 'images/icons/edit.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'Edit workout' %}"
         title="{% trans 'Edit workout' %}">
   {% trans "Edit workout" %}
</a>
{% endif %}

<a href="#export-ical-link" data-toggle="modal" {% auto_link_css flavour %}>
   <img src="{% static 'images/icons/calendar.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'Export calendar file' %}"
         title="{% trans 'Export calendar file' %}">
   {% trans "Export calendar file" %}
</a>

{% if is_owner %}
<a href="{% url 'manager:workout:copy' workout.id %}" {% auto_link_css flavour "wger-modal-dialog" %}>
   <img src="{% static 'images/icons/copy.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'Make a copy of this workout' %}"
         title="{% trans 'Make a copy of this workout' %}">
   {% trans "Make a copy of this workout" %}
</a>

<a href="{% url 'manager:workout:delete' workout.id %}" {% auto_link_css flavour "wger-modal-dialog" %}>
    <img src="{% static 'images/icons/trash.svg' %}"
         width="32"
         height="32"
         alt="{% trans 'Delete this workout' %}">
    {% trans "Delete this workout" %}
</a>
{% endif %}


<div class="modal fade" id="export-ical-link">
    <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 "Export calendar file" %}</h4>
            </div>
            <div class="modal-body">
                <p>{% trans "Export this workout as a calendar file." %}</p>
                <p>{% blocktrans %}You can then import the file it into your calendar
application for example google calendar, outlook or iCal. This will create
an appointment for each training day with the appropriate exercises.{% endblocktrans %}</p>
                <p>
                <a href="{% url 'manager:workout:ical' workout.id uid token %}" {% auto_link_css flavour %}>
                   <img src="{% static 'images/icons/calendar.svg' %}"
                         width="32"
                         height="32"
                         alt="{% trans 'Export calendar file' %}"
                         title="{% trans 'Export calendar file' %}">
                   {% trans "Export calendar file" %}
                </a>
                </p>
            </div>
        </div>
    </div>
</div>



<div class="modal fade" id="export-pdf-link">
    <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 "Download as PDF" %}</h4>
            </div>
            <div class="modal-body">
                <a href="{% url 'manager:workout:pdf-log' workout.id uid token %}" {% auto_link_css flavour %}>
                {% trans "Log" %}
                </a>

                <a href="{% url 'manager:workout:pdf-table' workout.id uid token %}" {% auto_link_css flavour %}>
                {% trans "Table" %}
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock %}
