{% extends 'ndr_core/admin_views/base.html' %}
{% load django_tables2 %}
{% load crispy_forms_tags %}
{% load ndr_values %}
{% load static %}

{% block extra_css %}
    {% if form %}{{ form.media.css }}{% endif %}
{% endblock %}

{% block page_js %}
    {% if form %}{{ form.media.js }}{% endif %}
{% endblock %}

{% block content %}
    <h2><i class="fa-regular fa-gear"></i> Settings</h2>
    {% config_value 'page_is_editable' as is_editable %}

    {% if is_editable %}
        <!-- Options Bar -->
        <div class="d-flex flex-wrap align-items-center bg-light border rounded p-2 mb-3">
            <div class="mr-auto">
                <a href="{% url 'ndr_core:create_setting' %}" class="btn btn-sm btn-primary m-1">
                    <i class="fa-regular fa-table-list"></i> Create Setting
                </a>
                <a href="{% url 'ndr_core:import_settings' %}" class="btn btn-sm btn-primary m-1">
                    <i class="fa-regular fa-file-import"></i> Import
                </a>
                <a href="{% url 'ndr_core:export_settings' %}" class="btn btn-sm btn-primary m-1" target="_blank">
                    <i class="fa-regular fa-file-export"></i> Export
                </a>
                <a href="{% url 'ndr_core:change_password' %}" class="btn btn-sm btn-secondary m-1">
                    <i class="fa-regular fa-lock"></i> Change Password
                </a>
                {% if is_editable %}
                    <a href="{% url 'ndr_core:set_page_read_only' %}" class="btn btn-sm btn-warning m-1">
                        <i class="fa-regular fa-exclamation-circle"></i> Set Read-Only
                    </a>
                {% else %}
                    <a href="{% url 'ndr_core:set_page_editable' %}" class="btn btn-sm btn-warning m-1">
                        <i class="fa-regular fa-exclamation-circle"></i> Set Editable
                    </a>
                {% endif %}
                {% config_value 'under_construction' as is_under_construction %}
                {% if is_under_construction %}
                    <a href="{% url 'ndr_core:set_page_live' %}" class="btn btn-sm btn-warning m-1">
                        <i class="fa-regular fa-check-circle"></i> Set Live
                    </a>
                {% else %}
                    <a href="{% url 'ndr_core:set_page_under_construction' %}" class="btn btn-sm btn-danger m-1">
                        <i class="fa-regular fa-exclamation-circle"></i> Set Under Construction
                    </a>
                {% endif %}
                {% config_value 'page_password_protected' as is_password_protected %}
                {% if is_password_protected %}
                    <a href="{% url 'ndr_core:set_page_password_removed' %}" class="btn btn-sm btn-warning m-1">
                        <i class="fa-regular fa-lock-open"></i> Remove Password Protection
                    </a>
                {% else %}
                    <a href="{% url 'ndr_core:set_page_password_protected' %}" class="btn btn-sm btn-secondary m-1">
                        <i class="fa-regular fa-lock"></i> Set Password Protection
                    </a>
                {% endif %}
            </div>
            <div>
                <a href="{% url 'ndr_core:help_chapter' 'settings' %}" class="btn btn-sm btn-outline-secondary m-1">
                    <i class="fa-regular fa-circle-info"></i> Help
                </a>
            </div>
        </div>

        <div class="card bg-light mb-3" style="max-height: 50vh;">
            <div class="overflow-auto">
                <div class="card-body">
                    <h5 class="card-title">Settings</h5>
                    <ul class="list-group">
                        {% for name, value in settings_list.items %}
                            <li class="list-group-item list-group-item-action d-flex py-2 px-2">
                                <p class="p-0 m-0 flex-grow-1">
                                    <i class="fa-regular fa-bars"></i>
                                    <a href="{% url 'ndr_core:view_settings' name %}">{{ value.title }}</a><br/>
                                </p>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
        </div>

        {% if object %}
            <div class="card bg-light mb-3">
                <div class="card-body">
                    <h5 class="card-title">{{ object.title }}</h5>
                    <p>{{ object.help_text }}</p>
                    {% crispy form %}
                </div>
            </div>
        {% endif %}

        <div class="alert alert-info small" role="alert">
            <i class="fa-regular fa-circle-info"></i>
            View and Change Various Settings.
        </div>

    {% else %}
        <div class="card bg-light mb-3">
            <div class="card-body">
                <a href="{% url 'ndr_core:set_page_editable' %}" class="list-group-item list-group-item-warning py-2">
                    <i class="fa-regular fa-exclamation-circle"></i>
                    Set Page to "Editable Mode"
                </a>
            </div>
        </div>
    {% endif %}


{% endblock %}