<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(Author)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';

    (function() {
        MochaUI.initializeTabs('aboutTabs');

        $('aboutAboutLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutAboutContent').removeClass('invisible');
        });

        $('aboutAuthorLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutAuthorContent').removeClass('invisible');
        });

        $('aboutSpecialThanksLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutSpecialThanksContent').removeClass('invisible');
        });

        $('aboutTranslatorsLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutTranslatorsContent').removeClass('invisible');
        });

        $('aboutLicenseLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutLicenseContent').removeClass('invisible');
        });

        $('aboutSoftwareUsedLink').addEvent('click', function() {
            $$('.aboutTabContent').addClass('invisible');
            $('aboutSoftwareUsedContent').removeClass('invisible');
        });
    })();
</script>
