{% extends 'image-resizer/_layouts' %}
{% import "image-resizer/_macros" as imageResizerMacro %}

{% set crumbs = [
    { label: "Image Resizer" | t('image-resizer'), url: url('image-resizer') },
    { label: "Logs" | t('image-resizer'), url: url('image-resizer/logs') }
] %}

{% set selectedTab = 'logs' %}

{% block blockContent %}

    <a class="btn right" href="{{ url('image-resizer/logs/clear') }}">{{ "Clear logs" | t('image-resizer') }}</a>

    <table id="logs" class="data fullwidth collapsible image-resizer-logs-table">
        <thead>
            <tr>
                <th scope="col">{{ "Filename" | t('image-resizer') }}</th>
                <th scope="col">{{ "Result" | t('image-resizer') }}</th>
                <th scope="col">{{ "Timestamp" | t('image-resizer') }}</th>
            </tr>
        </thead>

        <tbody>
            {% for entry in logEntries %}
                <tr>
                    <td class="col-label" data-title="{{ 'Filename' | t('image-resizer') }}">
                        <span class="">{{ entry.filename }}</span>
                    </td>

                    <td class="col-label" data-title="{{ 'Result' | t('image-resizer') }}">
                        <span class="log-result {{ entry.result }}">{{ entry.result }}</span>

                        <span class="log-label {{ entry.result }}">
                            {{ entry.description }}

                            {% if entry.handle == 'success' %}
                                {% set prevSize = entry.data.prev.size %}
                                {% set currSize = entry.data.curr.size %}
                                {% set saved = prevSize - currSize %}

                                {% set filesize = imageResizerMacro.filesize(saved) %}
                                {% set percentage = ((saved / prevSize) * 100) | number_format %}

                                {{ "Saved {perc}% ({num})." | t('image-resizer', { num: filesize, perc: percentage }) }}
                            {% endif %}

                            {% if entry.handle == 'error' %}
                                {{ entry.data.message }}
                            {% endif %}
                        </span>
                    </td>

                    <td data-title="{{ 'Timestamp' | t('image-resizer') }}">
                        <code>
                            {{ entry.dateTime | date('short') ~ ' ' ~ entry.dateTime | time('short') }}
                        </code>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>

{% endblock %}