aredn/files/app/partial/nav.ut

{%
/*
 * Part of AREDN® -- Used for creating Amateur Radio Emergency Data Networks
 * Copyright (C) 2024 Tim Wilkinson
 * See Contributors file for additional contributors
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation version 3 of the License.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 *
 * Additional Terms:
 *
 * Additional use restrictions exist on the AREDN® trademark and logo.
 * See AREDNLicense.txt for more info.
 *
 * Attributions to the AREDN® Project must be retained in the source code.
 * If importing this code into a new or existing project attribution
 * to the AREDN® project must be added to the source code.
 *
 * You must not misrepresent the origin of the material contained within.
 *
 * Modified versions must be modified to attribute to the original source
 * and be marked in reasonable ways as differentiate it from the original
 * version
 */
%}
{{_R("changes")}}
<a href="http://localnode.local.mesh"><div id="icon-logo"></div><div>AREDN<span style="font-size:4px">TM</span></div></a>
<div class="nav-node-name">{{configuration.getName()}}</div>
{{_R("nav-status")}}
<div style="flex:1"></div>
{{_R("login")}}
{% if (auth.isAdmin) { %}
<script>
(function navinit()
{
    if (!window.htmx) {
        document.body.addEventListener("htmx:load", navinit);
        return;
    }
    document.body.removeEventListener("htmx:load", navinit);
    const logo = htmx.find("#icon-logo");
    htmx.on("htmx:beforeRequest", function(e) {
        if ((e.detail.requestConfig.triggeringEvent || {}).type === "click") {
            const ismodal = (e.detail.target || {}).id === "ctrl-modal";
            setTimeout(_ => {
                if (document.body.classList.contains("htmx-request")) {
                    logo.classList.add("animate");
                }
            }, ismodal ? 1000 : 500);
            if (ismodal) {
                setTimeout(_ => {
                    if (!e.detail.target.open) {
                        e.detail.target.showModal();
                    }
                }, 200);
            }
        }
    });
    htmx.on(logo, "animationiteration", function() {
        if (!document.body.classList.contains("htmx-request")) {
            logo.classList.remove("animate");
        }
    });
})();
</script>
{% } %}