{% extends "base.html" %}
{% load i18n %}
{% load bootstrap4 %}
{% load static %}

{% block title %}
    {% if object %}
        {% trans "Edit shift" %}
    {% else %}
        {% trans "Create new shift for event" %}
    {% endif %}
{% endblock %}

{% block content %}
    <div class="page-header">
        {% if object %}
            <h1>{% trans "Edit shift" %}</h1>
        {% else %}
            <h1>{% trans "Create new shift for event" %}</h1>
        {% endif %}
    </div>
    <div class="row">
        <div class="col-md-9">
            <form method="post" class="form">
                {% csrf_token %}
                {% bootstrap_form form %}
                <div id="configuration_form">
                    {{ configuration_form }}
                </div>

                {% buttons %}
                    {% if object or event.active %}
                        <a role="button" class="btn btn-secondary"
                           href="{% url "event_management:event_detail" event.pk %}">
                            <span class="fas fa-arrow-left"></span> {% trans "Back to event" %}
                        </a>
                        {% if object and object.event.shifts.count > 1 %}
                            <a role="button" class="btn btn-danger"
                               href="{% url "event_management:shift_delete" object.pk %}"><span
                                    class="fas fa-trash-alt"></span> {% trans "Delete" %}</a>
                        {% endif %}
                        <button type="submit" class="btn btn-primary float-right ml-1">
                            <span class="fas fa-save"></span> {% trans "Save" %}
                        </button>
                    {% else %}
                        <a role="button" class="btn btn-danger"
                           href="{% url "event_management:event_delete" event.pk %}">{% trans "Discard event" %}</a>
                        <button type="submit" class="btn btn-primary float-right ml-1">
                            <span class="fas fa-save"></span> {% trans "Save event" %}
                        </button>
                    {% endif %}
                    <button type="submit" name="addAnother" class="btn btn-secondary float-right">
                        <span class="fas fa-plus"></span> {% trans "Add another shift" %}
                    </button>
                {% endbuttons %}
            </form>
        </div>
        <div class="col-md-3">
            <div class="card mb-2">
                <div class="card-body">
                    <h5 class="card-title">
                        {{ event.title }}
                        <small class="float-right"><a href="{% url "event_management:event_edit" event.pk %}"><span
                                class="fas fa-edit"></span> {% trans "Edit" %}</a></small>
                    </h5>
                    <p class="card-text">
                        {% trans "Event type" %}: {{ event.type }}<br>
                        {% trans "Location" %}: {{ event.location }}
                    </p>
                </div>
            </div>
            {% for shift in event.shifts.all %}
                {% include "event_management/fragments/shift_box_small.html" with shift=shift editing_shift=object can_change=perms.event_management.change_event %}
            {% endfor %}
            {% if not object %}
                <div class="card mb-2 border-info">
                    <div class="card-body">
                        <h5 class="card-subtitle mb-2 text-muted">{% trans "Shift" %}</h5>
                        <p class="card-text">{% trans "You are currently adding this shift" %}</p>
                </div>
            {% endif %}
        </div>
    </div>
    <script type="application/json" id="configuration_form_url">{"url": "{% url "event_management:signupmethod_configurationform" "slug" %}"}</script>
    <script type="text/javascript" src="{% static "ephios/js/shift_form.js" %}"></script>

{% endblock %}
