{% extends "base.html" %}

{% load i18n %}

{% block content %}
<div class="card">
<div class="card-header text-center">
    <h1>{{ food.name }}</h1>
</div>
<div class="card-body">
    <div class="row">
        <div class="card col-xl-6">
            <div class="card-header text-center">
                <h2>{% trans "queued"|capfirst %}{% if queue %} ({{ queue|length }}){% endif %}</h2>
            </div>
            <div class="card-body">
                <ul>
                    {% for ordered_food in queue %}
                        <li>
                            {{ ordered_food.order.note }}
                            {% if ordered_food.priority %}
                                <span class="badge badge-secondary">{{ ordered_food.priority }}</span>
                            {% endif %}
                        </li>
                    {% empty %}
                        <div class="alert alert-warning">
                            {% trans "There is no queued order." %}
                        </div>
                    {% endfor %}
                </ul>
            </div>
        </div>
        <div class="card col-xl-6">
            <div class="card-header text-center">
                <h2>{% trans "ready"|capfirst %}</h2>
            </div>
            <div class="card-body">
                <ul>
                    {% for ordered_food in ready %}
                        <li>{{ ordered_food.order.note }}</li>
                    {% empty %}
                        <div class="alert alert-warning">
                            {% trans "There is no ready order." %}
                        </div>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>

    <hr>

    <h3>{% trans "Other waiting lists:" %}</h3>
    <ul>
        {% for other_food in food.sheet.food_set.all %}
            {% if other_food != food %}
                <li>
                    <a href="{% url 'sheets:waiting_list' pk=other_food.pk %}">{{ other_food }}</a>
                </li>
            {% endif %}
        {% endfor %}
    </ul>
</div>
<div class="card-footer text-center">
    <a href="{% url 'sheets:queued_list' pk=food.pk %}" class="btn btn-primary">
        {% trans "Queued orders" %}
    </a>
    <a href="{% url 'sheets:ready_list' pk=food.pk %}" class="btn btn-primary">
        {% trans "Ready orders" %}
    </a>
    <a href="{% url 'sheets:sheet_detail' pk=food.sheet_id %}" class="btn btn-secondary">
        {% trans "Back to note sheet detail" %}
    </a>
</div>
</div>
{% endblock %}

{% block extrajavascript %}
    <script>
        function reload() {
            reloadWithTurbolinks()
            timeout = setTimeout(reload, 15000)
        }

        if (timeout === undefined)
            var timeout = setTimeout(reload, 15000)
    </script>
{% endblock %}