{% extends "base.html" %}
{% load logentries %}
{% load user_extras %}
{% load event_extras %}
{% load cache %}
{% load i18n %}
{% load static %}


{% block title %}
    {% trans "Home" %}
{% endblock %}

{% block javascript %}
    <script type="text/javascript" src="{% static "ephios/js/consequences.js" %}"></script>
{% endblock %}

{% block content %}
    <h1 class="page-header">
        {% trans "Welcome to ephios!" %}
    </h1>

    <style nonce="{{ request.csp_nonce }}">
        {% cache 900 "eventtype_colors" %}
            {% eventtype_colors %}
        {% endcache %}
    </style>

    {% with request.user|confirmed_participations as confirmed_participations %}
        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title mb-0">{% trans "Your upcoming events" %}</h5>
            </div>
            <ul class="list-group list-group-flush">
                {% for participation in confirmed_participations %}
                    <li class="list-group-item flex-column">
                        <div class="row">
                            <div class="col-auto px-0">
                                <span class="text-success fa fa-user-check ps-2"></span>
                            </div>
                            <div class="col">
                                <div class="row">
                                        <span class="col col-lg-6 text-break">
                                            {{ participation.shift.event.title }}
                                        </span>
                                    <span class="col-auto col-lg-2">
                                            <span class="badge badge-{{ participation.shift.event.type.pk }}-color">{{ participation.shift.event.type }}</span>
                                        </span>
                                    <span class="col-lg-4">
                                              {{ participation.start_time|date:"D" }}, {{ participation.start_time|date:"SHORT_DATE_FORMAT" }}, {{ participation.get_time_display }}
                                        </span>
                                </div>
                            </div>
                            <div class="col-auto">
                                <a class="btn btn-outline-primary btn-sm"
                                   href="{{ participation.shift.get_absolute_url }}"><span
                                        class="fa fa-eye"></span> <span
                                        class="d-none d-md-inline">{% translate "View" %}</span></a>
                            </div>
                        </div>
                    </li>
                {% empty %}
                    <li class="list-group-item d-flex flex-column align-items-center justify-content-center">
                        <span class="pb-1 text-muted">{% translate "None yet" context "empty list of upcoming shifts" %}</span>
                        <a class="btn btn-sm btn-primary" href="{% url "core:event_list" %}">{% translate "View events" %}</a>
                    </li>

                {% endfor %}
            </ul>
        </div>
    {% endwith %}

    {% with request.user|shifts_needing_disposition as shifts %}
        {% if shifts|length > 0 %}
            <div class="card mb-3">
                <div class="card-body">
                    <h5 class="card-title mb-0">{% trans "Events with requested participations" %}</h5>
                </div>
                <ul class="list-group list-group-flush">
                    {% for shift in shifts %}
                        <li class="list-group-item flex-column">
                            <div class="row">
                                <div class="col-auto px-0">
                                    <span class="text-info fa fa-hand-point-right ps-2"></span>
                                </div>
                                <div class="col">
                                    <div class="row">
                                        <span class="col col-lg-6 text-break">
                                            {{ shift.event.title }}
                                        </span>
                                        <span class="col-auto col-lg-2">
                                            <span class="badge badge-{{ shift.event.type.pk }}-color">{{ shift.event.type }}</span>
                                        </span>
                                        <span class="col-lg-4">
                                              {{ shift.start_time|date:"D" }}, {{ shift.start_time|date:"SHORT_DATE_FORMAT" }}, {{ shift.get_time_display }}
                                        </span>
                                    </div>
                                </div>
                                <div class="col-auto">
                                    <a class="btn btn-outline-primary btn-sm"
                                       href="{% url "core:event_detail" shift.event.pk shift.event.get_canonical_slug %}"><span
                                            class="fa fa-eye"></span> <span
                                            class="d-none d-md-inline">{% translate "View" %}</span></a>
                                    <a class="btn btn-outline-primary btn-sm"
                                       href="{% url "core:shift_disposition" shift.pk %}"><span
                                            class="fas fa-hand-point-right"></span> <span
                                            class="d-none d-md-inline">{% translate "Disposition" %}</span></a>
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    {% endwith %}

    {% include "core/fragments/approve_consequences.html" %}
    {% include "core/fragments/pending_consequences.html" %}

    {% with logentries=request.user|visible_logentries %}
        {% if logentries %}
            <div class="card mb-3">
                <div class="card-body">
                    <h5 class="card-title mb-0">
                        {% trans "Edit history" %}
                        <a class="btn btn-outline-primary btn-sm float-end" href="{% url "core:log" %}">
                            <span class="fas fa-eye"></span>
                            <span class="d-none d-md-inline">{% translate "View everything" %}</span>
                        </a>
                    </h5>
                </div>
                {% include 'modellogging/logentry_grouped_list.html' with logentries=logentries %}
            </div>
        {% endif %}
    {% endwith %}

    {% homepage_plugin_content request as plugin_content %}
    {% for item in plugin_content %}
        <div class="card mb-3">
            <div class="card-body">
                {{ item }}
            </div>
        </div>
    {% endfor %}

{% endblock %}
