{% extends "core_components/site_base.html" %}
{% block tabtitle %}Simmate{% endblock %}
{% block banner %}
    {% include "core_components/header.html" %}
{% endblock %}
{% block body %}
    {# Page title #}
    <div class="row pt-3">
        <div class="col-12">
            <div class="page-title-box">
                <div class="page-title-right">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item">
                            <a href="{% url 'data_explorer:home' %}">Data</a>
                        </li>
                        <li class="breadcrumb-item active">{{ provider.source }}</li>
                    </ol>
                </div>
                <h4 class="page-title">
                    {{ provider.source }}  <i class="mdi mdi-database me-1"></i>
                </h4>
            </div>
        </div>
    </div>
    {# Table name, description, quick links #}
    <div class="row">
        {# Search Form #}
        <div class="col-8">
            {% block sidebarfilters %}
                {# Start of Sidebar-right #}
                <div id="rightendbar" class="end-bar">
                    {# sidebar header #}
                    <div class="rightbar-title">
                        <a href="javascript:void(0);" class="end-bar-toggle float-end">
                            <i class="dripicons-cross noti-icon"></i>
                        </a>
                        <h5 class="m-0">Available Filters</h5>
                    </div>
                    {# sidebar content #}
                    <div class="rightbar-content h-100" data-simplebar>
                        <div>
                            {# Search Forms #}
                            {% load crispy_forms_tags %}
                            <div class="accordion custom-accordion" id="accordionFilters">
                                {# Full API Search Form #}
                                <form method="get" enctype="multipart/form-data">
                                    {{ form.non_field_errors }}
                                    {# Exact ID #}
                                    <div class="card mb-0">
                                        <div class="card-header" id="headingExactID">
                                            <h5>
                                                <a class="custom-accordion-title d-block"
                                                   data-bs-toggle="collapse"
                                                   href="#collapseExactID"
                                                   aria-expanded="true"
                                                   aria-controls="collapseExactID">
                                                    Entry ID
                                                    <i class="mdi mdi-chevron-down accordion-arrow"></i>
                                                </a>
                                            </h5>
                                        </div>
                                        <div id="collapseExactID"
                                             class="collapse"
                                             aria-labelledby="headingExactID"
                                             data-bs-parent="#accordionExample">
                                            <div class="card-body">{{ form.id | as_crispy_field }}</div>
                                        </div>
                                    </div>
                                    {# Date / Time #}
                                    <div class="card mb-0">
                                        <div class="card-header" id="headingDateTime">
                                            <h5>
                                                <a class="custom-accordion-title d-block"
                                                   data-bs-toggle="collapse"
                                                   href="#collapseDateTime"
                                                   aria-expanded="true"
                                                   aria-controls="collapseDateTime">
                                                    Date / Time
                                                    <i class="mdi mdi-chevron-down accordion-arrow"></i>
                                                </a>
                                            </h5>
                                        </div>
                                        <div id="collapseDateTime"
                                             class="collapse"
                                             aria-labelledby="headingDateTime"
                                             data-bs-parent="#accordionExample">
                                            <div class="card-body">
                                                <div class="alert alert-danger" role="alert">
                                                    <i class="mdi mdi-alert mx-2"></i>
                                                    calendar-based selection tool is coming soon
                                                </div>
                                                {{ form.created_at__range | as_crispy_field }}
                                                {{ form.updated_at__range | as_crispy_field }}
                                            </div>
                                        </div>
                                    </div>
                                    {# Iterate through the main tables that we've prebuilt pages for #}
                                    {% if filterset.filter_name == "StaticEnergy" %}
                                        {% include "core_components/base_filter_types/static-energy.html" %}
                                    {% elif filterset.filter_name == "DiffusionAnalysis" %}
                                        {% include "core_components/base_filter_types/diffusion-analysis.html" %}
                                    {% elif filterset.filter_name == "DensityofStatesCalc" %}
                                        {% include "core_components/base_filter_types/density-of-states-calc.html" %}
                                    {% elif filterset.filter_name == "BandStructureCalc" %}
                                        {% include "core_components/base_filter_types/band-structure-calc.html" %}
                                    {% elif filterset.filter_name == "Dynamics" %}
                                        {% include "core_components/base_filter_types/dynamics-run.html" %}
                                    {% elif filterset.filter_name == "Relaxation" %}
                                        {% include "core_components/base_filter_types/relaxation.html" %}
                                    {% else %}
                                        {# If none of the pages above were used, then we iterate through the fundamental mixins and pull the proper components. Is there a better way to do this as a django for-loop? #}
                                        {% if "Calculation" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/calculation.html" %}
                                        {% endif %}
                                        {% if "Structure" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/structure.html" %}
                                        {% endif %}
                                        {% if "Molecule" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/molecule.html" %}
                                        {% endif %}
                                        {% if "Thermodynamics" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/thermodynamics.html" %}
                                        {% endif %}
                                        {% if "Forces" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/forces.html" %}
                                        {% endif %}
                                        {% if "BandStructure" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/band-structure.html" %}
                                        {% endif %}
                                        {% if "DensityofStates" in filterset_mixins %}
                                            {% include "core_components/base_filter_types/density-of-states.html" %}
                                        {% endif %}
                                    {% endif %}
                                    {% block extrafilters %}
                                        {# Add any extra fields using default crispy formatting #}
                                        {% if extra_filters %}
                                            <div class="card mb-0">
                                                <div class="card-header" id="headingExtraFilters">
                                                    <h5 class="m-0">
                                                        <a class="custom-accordion-title d-block pt-2 pb-2"
                                                           data-bs-toggle="collapse"
                                                           href="#collapseExtraFilters"
                                                           aria-expanded="true"
                                                           aria-controls="collapseExtraFilters">
                                                            By Extra Info:
                                                            <i class="mdi mdi-chevron-down accordion-arrow"></i>
                                                        </a>
                                                    </h5>
                                                </div>
                                                <div id="collapseExtraFilters"
                                                     class="collapse"
                                                     aria-labelledby="headingExtraFilters"
                                                     data-bs-parent="#accordionExample">
                                                    <div class="card-body">
                                                        {% for field in form %}
                                                            {% if field.name in extra_filters %}{{ field | as_crispy_field }}{% endif %}
                                                        {% endfor %}
                                                    </div>
                                                </div>
                                            </div>
                                        {% endif %}
                                    {% endblock %}
                                    <div class="p-3 text-center">
                                        {# Search button #}
                                        <button type="submit" class="btn btn-primary">
                                            <i class="mdi mdi-magnify"></i>&nbsp;&nbsp;Update Search
                                        </button>
                                        {# Button to remove API arguments #}
                                        <a href="." class="btn btn-secondary m-2">
                                            <i class="mdi mdi-refresh"></i>&nbsp;&nbsp;Reset Filters
                                        </a>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                {# Toggle sidebar & Search buttons #}
                <button type="button" class="btn btn-dark end-bar-toggle">
                    <i class="mdi mdi-filter py-1"></i>&nbsp;&nbsp;Filter
                </button>
            {% endblock %}
            <a href="#" target="_blank" class="btn btn-primary my-1 disabled">
                <i class="mdi mdi-information"></i>&nbsp;&nbsp;Table Info</a>
            <a href="{{ provider.homepage }}"
               target="_blank"
               class="btn btn-outline-dark my-1">Source</a>
            <a href="{{ provider.source_doi }}"
               target="_blank"
               class="btn btn-outline-dark my-1">Cite</a>
            <a href="?format=api" target="_blank" class="btn btn-outline-dark my-1">API</a>
            <a href="?format=json" target="_blank" class="btn btn-outline-dark my-1">JSON</a>
            <a href="https://jacksund.github.io/simmate/getting_started/access_the_database/quick_start/"
               target="_blank"
               class="btn btn-outline-dark">Python</a>
        </div>
        {# Extra links #}
        <div class="col-4">
            <p class="lead text-muted">{{ provider.source_long }}</p>
        </div>
    </div>
    {# Search Results #}
    {% include "data_explorer/search_results.html" %}
{% endblock %}
