dss/templates/views/HeaderView.html

{% load account_tags %}
{% load spa_extras %}
<div class="navbar navbar-fixed-top navbar-inverse" xmlns="http://www.w3.org/1999/html">
    <div class="navbar-inner">
        <div class="container">
            <a href="/" class="brand">
                <img src="{{ STATIC_URL }}img/site-logo-gr.png"/>
                Deep|South|Sounds</a>

            <div class="nav-collapse">
                <ul class="nav">
                    <li><a href="/mixes">Mixes</a></li>
                    <li><a href="/releases">Releases</a></li>
                    <li><a href="/events">Events</a></li>
                    {% if user.is_authenticated %}
                        <li>
                            <form id="logout-form" method="post" action="{% url "account_logout" %}" style="display: none">
                                {% csrf_token %}
                            </form>
                            <a  data-bypass="true" style="cursor: hand; cursor: pointer;" id="header-logout-button" onclick="document.getElementById('logout-form').submit();">Logout&nbsp;<i class="icon-eject icon-white"></i>
                            </a>
                            <input type="hidden" name="user_id" value="{{ user.id }}" />
                        </li>
                    {% else %}
                        <li>
                            <a data-bypass="true" id="header-login-button">Login/Signup&nbsp;<i class="icon-music icon-white"></i></a>
                        </li>
                    {% endif %}
                </ul>
                <ul class="nav pull-right">
                    <li>
                        <a class="volume-button" data-mode="volume" id="header-volume-button">
                            <i class="icon-volume-up icon-white" id="header-volume-icon"></i>
                        </a>
                    <li>
                    <li>
                        <a id="header-profile-edit" href="/me">{{ user|nice_name }}</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>