{% extends "dash/_frame.twig" %}

{% block title %}
    {{ title }}
{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=adfdfa">
    {% endblock %}

    {% block mainContent %}
        <div id="post-index">
            <div id="post-index-wrapper">
                <div id="post-index-menu">
                    <a href="/dashboard/pages/all">All Pages ({{ stats['all'] }})</a>
                    .
                    <a href="/dashboard/pages/published">Published ({{ stats['published'] }})</a>
                    .
                    <a href="/dashboard/pages/deleted">Deleted ({{ stats['deleted'] }})</a>
                </div>
                <div id="posts-list">
                    {% for page in pages %}
                        <a class="page-link" href="/dashboard/page/edit/{{ page.uuid }}">
                            <div class="page-bg" style="background: url({{ page.feature }}) no-repeat center center / cover">
                                <div id="meta">
                                    <span>
                                        {{ page.updated }}
                                    </span>
                                    <label>
                                        {{ page.title }}
                                    </label>

                                    {% if page.menu == 'true' %}
                                        {% set menu = "true" %}
                                    {% else %}
                                        {% set menu = "false" %}
                                    {% endif %}
                                    {% if page.published == 'true' %}
                                        {% set published = "true" %}
                                    {% else %}
                                        {% set published = "false" %}
                                    {% endif %}
                                    {% if page.featured == 'true' %}
                                        {% set featured = "true" %}
                                    {% else %}
                                        {% set featured = "false" %}
                                    {% endif %}
                                    <div id="options">
                                        <span class="meta-options" data-active="{{ menu }}">
                                            Menu Item</span>
                                        <span class="meta-options" data-active="{{ published }}">
                                            Published</span>
                                        <span class="meta-options" data-active="{{ featured }}">
                                            Featured</span>
                                    </div>
                                    <span>{{ page.prettyDate }}</span>

                                </div>
                            </div>
                        </a>
                    {% endfor %}
                    {% if numOfPages > 1 %}
                        <div class="paginate">
                            <a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['prevPage'] }}">
                                <svg viewbox="0 0 20 20" class="icons"><use xlink:href="/assets/images/global/sprite.svg#entypo-chevron-left"/></svg>
                            </a>
                            <span class="count">
                                {{ currentPage }}
                                of
                                {{ numOfPages }}
                            </span>
                            <a class="page-btns" href="/dashboard/pages/{{ paginate['sort'] }}/{{ paginate['nextPage'] }}">
                                <svg viewbox="0 0 20 20" class="icons"><use xlink:href="/assets/images/global/sprite.svg#entypo-chevron-right"/></svg>
                            </a>
                        </div>
                    {% endif %}

                </div>
            </div>
        </div>
    {% endblock %}

    {% block javascripts %}
        <script src="/assets/scripts/dash.min.js" type="text/javascript"></script>
    {% endblock %}