{% load staticfiles %}

<nav class="navbar navbar-inverse navbar-fixed-top" style="border: none;">
	<div class="container-fluid">
		<div class="navbar-header">
			<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="/">
				<b style="color: white;">Online teaching courses</b> at
				<img src="https://hps.vi4io.org/_media/logo.png" style="height:1em; float:right; margin-left: 5px"/>
			</a>

		</div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav navbar-right">

{% if user.is_authenticated %}

	<li><a href="#">Help</a></li>

  <li role="presentation" class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
      {{ request.user.username }} <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
		<!-- <li><a href="/dashboard">Dashboard</a></li> -->
		<!-- <li><a href="/settings">Settings</a></li> -->
		<li><a href="/accounts/logout/?next=/">Logout</a></li>
    </ul>
  </li>

{% else %}

  <li role="presentation" class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
      Login / Sign Up <span class="caret"></span>
    </a>
    <ul class="dropdown-menu" style="width: 400px; padding-top: 0;">

	<li>
          <form class="navbar-form" action="/accounts/login/?next={{ request.path }}" method="post" id="login-form" style="background-color: rgba(0,0,0,0.1); padding: 10px; margin-top: 0;">
			{% csrf_token %}
            <div class="form-group form-group-sm">
              <input type="text" placeholder="User/Email" class="form-control" name="username">
            </div>
            <div class="form-group form-group-sm">
              <input type="password" placeholder="Password" class="form-control" name="password">
            </div>
            <button type="submit" class="btn btn-primary btn-sm">Sign in</button>
          </form>
		  </li>


		<li><a href="{% url 'social:begin' 'github' %}?next={{ request.path }}"><i class="fa fa-github"></i> Login with GitHub</a>
		<li><a href="{% url 'social:begin' 'reddit' %}?next={{ request.path }}"><i class="fa fa-twitter"></i> Login with Reddit</a>
		<li><a href="{% url 'social:begin' 'twitter' %}?next={{ request.path }}"><i class="fa fa-twitter"></i> Login with Twitter</a>
		<li><a href="{% url 'social:begin' 'google-oauth2' %}?next={{ request.path }}"><i class="fa fa-google-plus"></i> Login with Google+</a></li>
		<li><a href="{% url 'social:begin' 'facebook' %}?next={{ request.path }}"><i class="fa fa-facebook"></i> Login with Facebook</a></li>
    </ul>
  </li>

{% endif %}


          </ul>
        </div>
      </div>
    </nav>
