{# Landing page: filterable/sortable list of systems (see static/javascript/home.js for the client-side search/sort). #}
{% extends "base.html" %}

{% block title %}PhysikMDB - Home{% endblock %}

{% block extra_css %}
<link rel="stylesheet" href="{{ url_for('static', filename='styles/home.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='styles/help.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='styles/tour.css') }}">
{% endblock %}

{% block javascript %}
<script src="{{ url_for('static', filename='javascript/home.js') }}" type="module"></script>
{% endblock %}

{% block header %}
<header class="header">
    <h1 data-tour="title">Molecular Orbital Database</h1>
    <nav>
        <a href="{{ url_for('static', filename='misc/main.pdf') }}" data-tour="theory"
            title="The derivation behind these pages: photoemission orbital tomography for an LCAO-GTO basis set (PDF)">Theory</a>
        <a href="https://pypi.org/project/physikmdb/" data-tour="python"
            title="physikmdb on PyPI: the same C kernels this site runs, plus a client for its database. pip install physikmdb">Python</a>

        <a href="/license">License</a>
        <a href="/imprint">Imprint</a>
        <a href="/privacy">Privacy</a>
        <a href="https://homepage.uni-graz.at/de/peter.puschnig/">Contact</a>
        <a href="{{ calculation_request_mailto() }}"
            title="Ask us to run a calculation that isn't in the database yet">Request</a>
        {# The two ways into the help system. Both are always visible: nothing
        is remembered between visits, so these buttons are the only entry
        points there are. The tour is only offered when its example
        calculation actually resolves (src/app.py TOUR_CALCULATION_ID). #}
        {% set tour_id = tour_calculation_id() %}
        {% if tour_id %}
        <button type="button" id="tour-start" class="tour-start" data-calculation-id="{{ tour_id }}"
            title="A guided walk through the database, one example calculation and its excitons">Tutorial</button>
        {% endif %}
        <button type="button" id="help-toggle" class="help-toggle" aria-pressed="false"
            title="Show a help badge on everything that needs explaining">?</button>
    </nav>
</header>
{% endblock %}

{% block content %}
<section class="search-controls">
    <div class="search-bar">
        <div class="search-field">
            {# Carried through a filter submit by home.js, so a query survives
            the reload the filter dropdowns trigger #}
            <input id="search" type="search" placeholder="Search, e.g. Mn* xc=b3lyp ie&gt;3 ~ea&lt;=0"
                value="{{ request.args.get('search', '') }}"
                title="Filters the table as you type. Hover for the search syntax.">
            <div class="search-help" role="tooltip">
                <p>Space/<code>&amp;</code>=AND, <code>|</code>=OR, leading <code>~</code>=NOT, <code>"x"</code>=exact.
                </p>
                <ul>
                    <li><code>Mn*</code> wildcard &middot; <code>xc=b3lyp</code> field &middot; <code>ie&gt;3</code>
                        compare (<code>= != &gt; &gt;= &lt; &lt;=</code>)</li>
                    <li><code>C=6</code> element count, any symbol: <code>Fe&gt;0</code></li>
                </ul>
                <p>Fields: id, formula, name, fullname, xc, basis, charge, spin, gap, ip/ie, ea, code, author.</p>
            </div>
            <button type="button" class="help-badge"
                data-help="Filters the table as you type; nothing is sent to the server. Beyond the syntax shown on hover, any element symbol works as a field of its own: C=6 finds molecules with exactly six carbons, Fe>0 everything containing iron.">?</button>
        </div>
        <span class="badge-anchor">
            <button type="button" id="export-csv" class="control-surface"
                title="Downloads the rows currently visible, in the sort order shown, as physikmdb-systems.csv.
Columns are the table's own; energies in eV.">Export CSV</button>
            <button type="button" class="help-badge"
                data-help="Writes out what the table currently holds, so a search and a sort both carry into the file. It is the listing that is exported, not the orbitals or the momentum maps behind it.">?</button>
        </span>
    </div>

    <form action="/" method="GET" class="filter-form">
        <a href="/">Reset Filters</a>
        <span class="badge-anchor">
            {% if systems %}
            <button type="submit" id="show-calculations" class="control-surface"
                title="Show all available calculations" value="true" name="listCalculations">Show Calculations</button>
            {% else %}
            <button type="submit" id="show-systems" class="control-surface"
                title="Show all available systems">Show Systems</button>
            {% endif %}
            <button type="button" class="help-badge"
                data-help="Two ways to read the same database. Systems shows one row per molecule, picking whichever calculation ranks best for it: neutral singlet first, then preferred functionals and basis sets. Calculations shows every calculation on its own, so one molecule can appear many times.">?</button>
        </span>

        <div class="filter-fields" data-tour="filters">
            <span class="badge-anchor">
                <select name="xc_functional"
                    class="{{ 'active' if filters.xc_functional and filters.xc_functional != 'any' }}">
                    <option value="any" {{ 'selected' if not filters.xc_functional or filters.xc_functional=='any' }}>Any
                        XC-Functional</option>
                    {% for value in filter_options.xc_functional %}
                    <option value="{{ value }}" {{ 'selected' if filters.xc_functional==value }}>{{ value }}</option>
                    {% endfor %}
                </select>
                <button type="button" class="help-badge"
                    data-help="Five dropdowns narrowing the table by exchange-correlation functional, basis set, charge, spin multiplicity and the code that ran the calculation. They combine, and each one is a plain URL parameter, so any filtered view can be bookmarked.">?</button>
            </span>

            <select name="basis_set" class="{{ 'active' if filters.basis_set and filters.basis_set != 'any' }}">
                <option value="any" {{ 'selected' if not filters.basis_set or filters.basis_set=='any' }}>Any Basis Set
                </option>
                {% for value in filter_options.basis_set %}
                <option value="{{ value }}" {{ 'selected' if filters.basis_set==value }}>{{ value }}</option>
                {% endfor %}
            </select>

            <select name="charge" class="{{ 'active' if filters.charge and filters.charge != 'any' else '' }}">
                <option value="any" {{ 'selected' if filters.charge is none or filters.charge=='any' }}>Any Charge
                </option>
                {% for value in filter_options.charge %}
                <option value="{{ value }}" {{ 'selected' if filters.charge==(value|string) }}>{{ value }}</option>
                {% endfor %}
            </select>

            <select name="spin" class="{{ 'active' if filters.spin and filters.spin != 'any' else '' }}">
                <option value="any" {{ 'selected' if filters.spin is none or filters.spin=='any' }}>Any Spin
                </option>
                {% for value in filter_options.spin %}
                <option value="{{ value }}" {{ 'selected' if filters.spin==(value|string) }}>{{ value }}</option>
                {% endfor %}
            </select>

            <select name="code" class="{{ 'active' if filters.code and filters.code != 'any' else '' }}">
                <option value="any" {{ 'selected' if filters.code is none or filters.code=='any' }}>Any Code
                </option>
                {% for value in filter_options.code %}
                <option value="{{ value }}" {{ 'selected' if filters.code==value }}>{{ value }}</option>
                {% endfor %}
            </select>

            <label class="filter-checkbox {{ 'active' if filters.calculation_type == 'casida' }}"
                title="Only calculations with excited states, linked to their exciton page instead of the orbital list">
                <input type="checkbox" name="calculation_type" value="casida"
                    {{ 'checked' if filters.calculation_type == 'casida' }}>
                Casida only
                <button type="button" class="help-badge"
                    data-help="A Casida calculation solves the linear-response TD-DFT equations for the excited states on top of the ground state. Ticking this keeps only those, and points every row at its exciton page instead of its orbital list.">?</button>
            </label>
        </div>
    </form>
</section>

<section id="systems-section" data-tour="table">
    <table class="clickable-table" id="systems">
        <thead>
            {# One header row for both views: they differ only in what a row stands
            for, so the scope clause is set once instead of duplicating every column. #}
            {% set scope = 'the best available calculation for this molecule' if systems else 'this calculation' %}
            <tr class="header">
                <th class="id">{{ 'System' if systems else 'Calculation' }}</th>
                <th class="formula">Formula</th>
                <th class="shortname">Short Name</th>
                <th class="fullname">Full Name</th>
                <th class="xc_functional" title="Exchange-correlation functional of {{ scope }}.">XC
                    <button type="button" class="help-badge"
                        data-help="The approximate exchange-correlation functional the DFT calculation used. It sets the orbital energies and everything derived from them, so two rows computed with different functionals are not directly comparable.">?</button>
                </th>
                <th class="basis_set" title="Gaussian basis set of {{ scope }}.">Basis
                    <button type="button" class="help-badge"
                        data-help="The set of contracted Gaussians the orbitals are expanded in. Every momentum map here is computed analytically from that expansion, so the basis sets how far an orbital's diffuse tail is described.">?</button>
                </th>
                <th class="charge" title="Total charge of {{ scope }} [e].">Charge
                    <button type="button" class="help-badge"
                        data-help="The total charge the molecule was calculated at. Charging it shifts every orbital energy, so the IP and EA of an ion do not sit on the same scale as the neutral molecule's.">?</button>
                </th>
                <th class="spin" title="Spin multiplicity 2S+1 of {{ scope }}. 1 = singlet, 3 = triplet.">Spin
                    <button type="button" class="help-badge"
                        data-help="The spin multiplicity 2S+1. Anything above 1 is an open-shell calculation carrying two independent sets of orbitals, α and β, which the entry page lets you switch between.">?</button>
                </th>
                <th class="gap" title="ε_LUMO − ε_HOMO of {{ scope }} [eV].">Gap (eV)
                    <button type="button" class="help-badge"
                        data-help="The HOMO-LUMO gap, ε_LUMO − ε_HOMO. It is a difference of Kohn-Sham eigenvalues and not an optical gap: where a Casida calculation exists, its lowest excitation energy is generally lower.">?</button>
                </th>
                <th class="ip"
                    title="ε_HOMO of {{ scope }}, referred to the vacuum level [eV].
Negative for a bound orbital; the Koopmans ionisation potential is −ε_HOMO.">
                    IP (eV)
                    <button type="button" class="help-badge"
                        data-help="The energy of the highest occupied orbital, referred to the vacuum level. The column shows that orbital energy itself, so it is negative for a bound state and the Koopmans ionisation potential is its negative.">?</button>
                </th>
                <th class="ea"
                    title="ε_LUMO of {{ scope }}, referred to the vacuum level [eV].
The Koopmans electron affinity is −ε_LUMO.">
                    EA (eV)
                    <button type="button" class="help-badge"
                        data-help="The energy of the lowest unoccupied orbital, referred to the vacuum level. As with IP, the column shows the orbital energy itself, so the Koopmans electron affinity is its negative.">?</button>
                </th>
            </tr>
        </thead>
        <tbody>
            {% if systems %}
            {% for system in systems %}
            {% set row_url = '/' ~ system.calculation_id ~ ('/exciton' if filters.calculation_type == 'casida' else '') %}
            <tr class="{{ 'even' if loop.index is even else 'odd' }}"
                data-code="{{ system.code or '' }}" data-author="{{ system.author or '' }}"
                title="Calculation #{{ system.calculation_id }}, XC: {{ system.xc_functional }}, Basis: {{ system.basis_set }}">
                <td class="id"><a href="{{ row_url }}">{{ system.id }}</a></td>
                <td class="formula"><a href="{{ row_url }}">{{ system.formula | subscript }}</a></td>
                <td class="shortname"><a href="{{ row_url }}">{{ system.short_name }}</a></td>
                <td class="fullname"><a href="{{ row_url }}">{{ system.full_name }}</a></td>
                <td class="xc_functional"><a href="{{ row_url }}">{{ system.xc_functional }}</a></td>
                <td class="basis_set"><a href="{{ row_url }}">{{ system.basis_set }}</a></td>
                <td class="charge"><a href="{{ row_url }}">{{ system.charge }}</a></td>
                <td class="spin"><a href="{{ row_url }}">{{ system.spin }}</a></td>
                <td class="gap"><a href="{{ row_url }}">{{ "%.3f" | format(system.fundamental_gap |
                        hartree_to_ev) }}</a></td>
                <td class="ip"><a href="{{ row_url }}">{{ "%.3f" | format(system.ionisation_potential |
                        hartree_to_ev) }}</a></td>
                <td class="ea"><a href="{{ row_url }}">{{ "%.3f" | format(system.electron_affinity |
                        hartree_to_ev) }}</a></td>
            </tr>
            {% endfor %}
            {% else %}
            {% for calculation in calculations %}
            {% set row_url = '/' ~ calculation.id ~ ('/exciton' if filters.calculation_type == 'casida' else '') %}
            <tr class="{{ 'even' if loop.index is even else 'odd' }}"
                data-code="{{ calculation.code or '' }}" data-author="{{ calculation.author or '' }}">
                <td class="id"><a href="{{ row_url }}">{{ calculation.id }}</a></td>
                <td class="formula"><a href="{{ row_url }}">{{ calculation.formula | subscript }}</a></td>
                <td class="shortname"><a href="{{ row_url }}">{{ calculation.short_name }}</a></td>
                <td class="fullname"><a href="{{ row_url }}">{{ calculation.full_name }}</a></td>
                <td class="xc_functional"><a href="{{ row_url }}">{{ calculation.xc_functional }}</a></td>
                <td class="basis_set"><a href="{{ row_url }}">{{ calculation.basis_set }}</a></td>
                <td class="charge"><a href="{{ row_url }}">{{ calculation.charge }}</a></td>
                <td class="spin"><a href="{{ row_url }}">{{ calculation.spin }}</a></td>
                <td class="gap"><a href="{{ row_url }}">{{ "%.3f" | format(calculation.fundamental_gap |
                        hartree_to_ev) }}</a></td>
                <td class="ip"><a href="{{ row_url }}">{{ "%.3f" | format(calculation.ionisation_potential |
                        hartree_to_ev) }}</a></td>
                <td class="ea"><a href="{{ row_url }}">{{ "%.3f" | format(calculation.electron_affinity |
                        hartree_to_ev) }}</a></td>
            </tr>
            {% endfor %}
            {% endif %}
        </tbody>
    </table>
</section>
{% endblock %}