{% load i18n l10n %}
{% with input_tpl="admin/django_cachex/key/key_detail_value_input.html#value-input" %}
{% if can_mutate %}
<!-- List Operations -->
<fieldset class="module aligned monospace">
    <h2>{% trans "Operations" %}</h2>
    <div class="form-row">
        <div>
            <label for="id_lpush_value">{% trans "Push Left:" %}</label>
            <form method="post">
                {% csrf_token %}
                <input type="hidden" name="action" value="lpush">
                {% include input_tpl with name="value" rows=4 field_id="id_lpush_value" placeholder=_("value") editable=True can_mutate=can_mutate only %}
                <div class="cachex-value-actions">
                    <button type="submit" class="button btn-small">{% trans "Push" %}</button>
                </div>
            </form>
        </div>
    </div>
    <div class="form-row">
        <div>
            <label for="id_rpush_value">{% trans "Push Right:" %}</label>
            <form method="post">
                {% csrf_token %}
                <input type="hidden" name="action" value="rpush">
                {% include input_tpl with name="value" rows=4 field_id="id_rpush_value" placeholder=_("value") editable=True can_mutate=can_mutate only %}
                <div class="cachex-value-actions">
                    <button type="submit" class="button btn-small">{% trans "Push" %}</button>
                </div>
            </form>
        </div>
    </div>
    <div class="form-row">
        <label>{% trans "Pop Left:" %}</label>
        <form method="post" style="display: inline;">
            {% csrf_token %}
            <input type="hidden" name="action" value="lpop">
            <input type="number" name="pop_count" value="1" min="1" class="vIntegerField" style="width: 50px;" aria-label="{% trans "Count" %}">
            <button type="submit" class="button btn-small">{% trans "Pop" %}</button>
        </form>
    </div>
    <div class="form-row">
        <label>{% trans "Pop Right:" %}</label>
        <form method="post" style="display: inline;">
            {% csrf_token %}
            <input type="hidden" name="action" value="rpop">
            <input type="number" name="pop_count" value="1" min="1" class="vIntegerField" style="width: 50px;" aria-label="{% trans "Count" %}">
            <button type="submit" class="button btn-small">{% trans "Pop" %}</button>
        </form>
    </div>
    <div class="form-row">
        <label>{% trans "Trim:" %}</label>
        <form method="post" style="display: inline;">
            {% csrf_token %}
            <input type="hidden" name="action" value="ltrim">
            <input type="number" name="trim_start" value="0" class="vIntegerField" style="width: 60px;" aria-label="{% trans "Start index" %}" placeholder="{% trans "start" %}">
            <input type="number" name="trim_stop" value="-1" class="vIntegerField" style="width: 60px;" aria-label="{% trans "Stop index (-1 for last)" %}" placeholder="{% trans "stop" %}">
            <button type="submit" class="button btn-small" onclick="return confirm('{% trans "Trim list to this range? Elements outside the range will be removed." %}');">{% trans "Trim" %}</button>
        </form>
    </div>
</fieldset>
{% endif %}
<!-- List Items -->
<fieldset class="module aligned monospace">
    <h2>{% trans "List Items" %}{% if type_data.length %} ({{ type_data.length }}){% endif %}</h2>
    {% if type_data.item_entries %}
    <div class="results">
        <table id="result_list" class="cachex-entry-table" style="width: 100%;">
            <thead>
                <tr>
                    <th scope="col" style="width: 60px;">{% trans "Index" %}</th>
                    <th scope="col">{% trans "Value" %}</th>
                    {% if can_mutate %}
                    <th scope="col" style="width: 110px;">{% trans "Actions" %}</th>
                    {% endif %}
                </tr>
            </thead>
            <tbody>
                {% for index, item, sha1, editable in type_data.item_entries %}
                <tr class="{% cycle "row1" "row2" %}">
                    <td class="quiet">{{ index }}</td>
                    <td>{% include input_tpl with name="value" value=item rows=2 form_id="list-update-" row_index=forloop.counter0 editable=editable can_mutate=can_mutate only %}</td>
                    {% if can_mutate %}
                    <td>
                        <div class="cachex-row-actions">
                            {% if editable %}
                            <button type="submit" form="list-update-{{ forloop.counter0 }}" class="button btn-small">{% trans "Update" %}</button>
                            {% translate "Remove the first item in the list matching this value?" as confirm_remove %}
                            <button type="submit" form="list-remove-{{ forloop.counter0 }}" class="button delete-btn btn-small" onclick="return confirm('{{ confirm_remove|escapejs }}');">{% trans "Remove" %}</button>
                            {% else %}
                            <button type="button" class="button btn-small" disabled title="{% trans "Not JSON-serializable, so this item cannot be edited or matched for removal." %}">{% trans "Update" %}</button>
                            <button type="button" class="button delete-btn btn-small" disabled title="{% trans "Not JSON-serializable, so this item cannot be edited or matched for removal." %}">{% trans "Remove" %}</button>
                            {% endif %}
                        </div>
                    </td>
                    {% endif %}
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
    {% if can_mutate %}
    <!-- Forms for list operations (outside table for valid HTML) -->
    {% for index, item, sha1, editable in type_data.item_entries %}
    <form id="list-update-{{ forloop.counter0 }}" method="post" style="display: none;">
        {% csrf_token %}
        <input type="hidden" name="action" value="lset">
        <input type="hidden" name="index" value="{{ index|unlocalize }}">
        {% if sha1 %}<input type="hidden" name="original_sha1" value="{{ sha1 }}">{% endif %}
    </form>
    <form id="list-remove-{{ forloop.counter0 }}" method="post" style="display: none;">
        {% csrf_token %}
        <input type="hidden" name="action" value="lrem">
        <input type="hidden" name="value" value="{{ item }}">
        <!-- LREM matches by value, never by index: bound it to one occurrence. -->
        <input type="hidden" name="lrem_count" value="1">
    </form>
    {% endfor %}
    {% endif %}
    {% else %}
    <p class="quiet" style="padding: 10px;">{% trans "List is empty." %}</p>
    {% endif %}
    {% include "admin/django_cachex/key/key_detail_pagination.html" %}
</fieldset>
{% endwith %}