spee.ch/views/partials/topBar.handlebars

<div class="row top-bar">
	<a href="https://en.wikipedia.org/wiki/Freedom_of_information" target="_blank"><img id="logo" src="/assets/img/content-freedom-64px.png"/></a>
	<h1 id="title"><a href="/">Spee.ch</a></h1><span class="top-bar-left">(beta)</span>
	<a href="/popular" class="top-bar-right">popular</a>
	<a href="https://github.com/lbryio/spee.ch" target="_blank" class="top-bar-right">source</a>
	<a href="/about" class="top-bar-right">help</a>

    {{#if user}}
        <select type="text" class="select" onchange="toggleLogin(event)">
            <option value="none">@{{user.userName}}</option>
            <option value="view">view</option>
            <option value="logout">logout</option>
        </select>
    {{else}}
        <a href="/login" class="top-bar-right">login</a>
    {{/if}}
	<div class="top-bar-tagline">Open-source, decentralized image and video hosting.</div>
</div>

<script type="text/javascript">
    function toggleLogin (event) {
        console.log(event);
        const selectedOption = event.target.selectedOptions[0].value;
        if (selectedOption === 'logout') {
            console.log('login');
            window.location.href = '/logout';
        } else if (selectedOption === 'view') {
            console.log('view channel');
            window.location.href = '/{{user.channelName}}:{{user.channelClaimId}}';
        }
    }
</script>