{# The Info tab's pane: what this calculation and this system are. Identical
on every page that shows one calculation.

A page with something more to say about what it is showing passes
`extra_info_tab` (a {group, label, title} for the strip) and `extra_info_groups`
(a template to include after this one), the same way _panel_controls.html takes
its extra group. Without them there is no strip at all: one pane needs no tabs
to choose between. #}
{# Info Tab #}
<div class="tab-pane active" id="tab-info">
    {% if extra_info_tab %}
    <nav class="pane-tabs" role="tablist">
        <button role="tab" class="pane-tab active" data-pane-group="info"
            title="What this calculation and this system are">Calculation</button>
        <button role="tab" class="pane-tab" data-pane-group="{{ extra_info_tab.group }}"
            title="{{ extra_info_tab.title }}">{{ extra_info_tab.label }}</button>
    </nav>
    {% endif %}
    {# Two fixed columns, each a plain top-to-bottom list of
    label/value rows - no per-row grid, no sub-tab to click
    between Calculation and System. A long list just scrolls. #}
    <section class="pane-group active list" id="pane-group-info" aria-label="Info" role="tabpanel">
        <div class="list-column">
            <p class="group-title">Calculation<button type="button" class="help-badge"
                    data-help="What this particular calculation was: the functional and basis set it used, the charge and spin it was run at, and who ran it when. Everything on the orbital pages follows from these settings.">?</button>
            </p>
            <hr class="divider">
            <p>
                <span class="label">XC Functional</span>
                <span class="info">{{ calculation.xc_functional }}</span>
            </p>
            <p>
                <span class="label">Basis Set</span>
                <span class="info">{{ calculation.basis_set }}</span>
            </p>
            <p>
                <span class="label">Charge</span>
                <span class="info">{{ calculation.charge if calculation.charge is not none else "&mdash;" | safe }}</span>
            </p>
            <p>
                <span class="label">Spin</span>
                <span class="info">{{ calculation.spin if calculation.spin is not none else "&mdash;" | safe }}</span>
            </p>
            <p title="Total electronic energy of the ground state, in the unit selected under Display.
Stored in Hartree; an absolute value with no reference point, so only differences between calculations of the same system mean anything.">
                <span class="label">Total Energy [<span id="total-energy-unit">eV</span>]<button type="button"
                        class="help-badge"
                        data-help="The converged ground-state electronic energy of this calculation. It is an absolute number whose zero depends on the method, so it can be compared between calculations of the same system and not much else.">?</button></span>
                {# 2 decimals matches ENERGY_UNITS.eV, which controls.js
                   rewrites this to on load - a different precision here shows
                   as a flicker. #}
                {# total_energy is nullable: a calculation whose output did not state
                   one must show that, never a fabricated 0.00. #}
                <span class="info" id="total-energy-value" data-energy-ev="{{
                    calculation.total_energy | hartree_to_ev if calculation.total_energy is not none else "" }}">{{
                    "%.2f" | format(calculation.total_energy | hartree_to_ev)
                    if calculation.total_energy is not none else "&mdash;" | safe }}</span>
            </p>
            <p>
                <span class="label">Code</span>
                <span class="info">{{ calculation.code }} {{ calculation.code_version }}</span>
            </p>
            <p>
                <span class="label">Author</span>
                <span class="info">{{ calculation.author }}</span>
            </p>
            <p>
                <span class="label">Date</span>
                <span class="info">{{ calculation.date }}</span>
            </p>
            <p title="When this calculation was added to the database, in UTC.">
                <span class="label">Added<button type="button" class="help-badge"
                        data-help="When the calculation entered this database. The Date row above is when it was actually run; the two are unrelated.">?</button></span>
                <span class="info">{{ calculation.created_at }}</span>
            </p>
            <p title="Entry id in the previous (NWChem) database, if this calculation was migrated from there. Blank if it was added directly.">
                <span class="label">Legacy ID<button type="button" class="help-badge"
                        data-help="The id this calculation had on the previous version of this site. Old links of the form /default/row/&lt;id&gt; still resolve, so a reference from an older paper keeps working.">?</button></span>
                <span class="info">{{ calculation.legacy_id }}</span>
            </p>
        </div>
        <div class="list-column">
            <p class="group-title">System<button type="button" class="help-badge"
                    data-help="The molecule itself, independent of any one calculation. The point group names the symmetry the orbital labels refer to, and the orientation says how the molecule was placed in the calculation's coordinate frame.">?</button>
            </p>
            <hr class="divider">
            <p>
                <span class="label">Full Name</span>
                <span class="info">{{ system.full_name }}</span>
            </p>
            <p>
                <span class="label">Short Name</span>
                <span class="info">{{ system.short_name }}</span>
            </p>
            <p>
                <span class="label">Formula</span>
                <span class="info">{{ system.formula | subscript }}</span>
            </p>
            <p title="Molecular point group. Every orbital's symmetry column names one of its irreducible representations.">
                <span class="label">Point Group<button type="button" class="help-badge"
                        data-help="The symmetry group of the molecule as calculated. It is what the symmetry labels in the orbital and exciton lists refer to, so a label like B1u is only meaningful together with this group.">?</button></span>
                <span class="info">{{ system.point_group | point_group_subscript }}</span>
            </p>
            <p title="Orientation of the molecular plane in the calculation's own frame, e.g. xy for a molecule lying in the xy plane.
It seeds the Euler angles under Geometry.">
                <span class="label">Orientation<button type="button" class="help-badge"
                        data-help="Which plane the molecule was placed in when it was calculated. The momentum map depends on how the molecule sits relative to the analyser, so this is where the Euler angles under Geometry start from.">?</button></span>
                <span class="info">{{ calculation.orientation }}</span>
            </p>
        </div>
    </section>

    {% if extra_info_groups %}{% include extra_info_groups %}{% endif %}
</div>