<div class="toolbarTabs">
    <ul id="aboutTabs" class="tab-menu">
        <li id="aboutAboutLink" class="selected"><a>QBT_TR(About)QBT_TR[CONTEXT=AboutDialog]</a></li>
        <li id="aboutAuthorLink"><a>QBT_TR(Authors)QBT_TR[CONTEXT=AboutDialog]</a></li>
        <li id="aboutSpecialThanksLink"><a>QBT_TR(Special Thanks)QBT_TR[CONTEXT=AboutDialog]</a></li>
        <li id="aboutTranslatorsLink"><a>QBT_TR(Translators)QBT_TR[CONTEXT=AboutDialog]</a></li>
        <li id="aboutLicenseLink"><a>QBT_TR(License)QBT_TR[CONTEXT=AboutDialog]</a></li>
        <li id="aboutSoftwareUsedLink"><a>QBT_TR(Software Used)QBT_TR[CONTEXT=AboutDialog]</a></li>
    </ul>
    <div class="clear"></div>
</div>

<script>
    "use strict";

    (() => {
        MochaUI.initializeTabs("aboutTabs");

        const showContent = (element) => {
            for (const content of document.querySelectorAll(".aboutTabContent"))
                content.classList.toggle("invisible", (content !== element));
        };

        document.getElementById("aboutAboutLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutAboutContent"));
        });
        document.getElementById("aboutAuthorLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutAuthorContent"));
        });
        document.getElementById("aboutSpecialThanksLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutSpecialThanksContent"));
        });
        document.getElementById("aboutTranslatorsLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutTranslatorsContent"));
        });
        document.getElementById("aboutLicenseLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutLicenseContent"));
        });
        document.getElementById("aboutSoftwareUsedLink").addEventListener("click", (event) => {
            showContent(document.getElementById("aboutSoftwareUsedContent"));
        });
    })();
</script>
