{% extends "base.html" %}
{% load gravatar %}
{% load i18n %}
{% block "global_content" %}
<script>
	$(document).ready(function() {
		typeahead_search = new Bloodhound({
			datumTokenizer: function(d) {
				return Bloodhound.tokenizers.whitespace(d.val);
			},
			queryTokenizer: Bloodhound.tokenizers.whitespace,
			remote: {
				url: '{% url 'secrets.secret-search' %}?q=%QUERY',
				wildcard: '%QUERY'
			}
		});
		typeahead_search.initialize();

		$('#search').typeahead(
		{
			minLength: 3,
			highlight: true,
		},
		{
			name: 'secrets',
			displayKey: 'name',
			source: typeahead_search.ttAdapter(),
			templates: {
				suggestion: function (datum) {
					var output = '';
					output += '<div class="search_result" onclick="document.location = \'' + datum.url + '\';">';
					output += '<div class="search_result_icons"><i class="fa fa-' + datum.icon + '"></i></div>';
					output += '<div class="search_result_name"><a href="' + datum.url + '">' + datum.name + '</a></div>';
					output += '<div class="goto_icon"><i class="fa fa-arrow-right"></i></div>';
					output += '<div class="clearfix"></div></div>';
					return output;
				}
			}
		});

		$('#search').on('typeahead:selected', function(event, selection) {
			window.location.href = selection.url;
		});
	});
</script>
<nav class="navbar navbar-default" role="navigation">
	<div class="container">
		<div class="navbar-header">
			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
				<span class="sr-only">{% trans "Toggle navigation" %}</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="{% url 'dashboard' %}">{% trans "TeamVault" %}</a>
		</div>
		<div class="collapse navbar-collapse" id="navbar-collapse">
			<ul class="nav navbar-nav navbar-left">
				<div class="btn-group">
					<a href="{% url 'secrets.secret-add' content_type='password' %}" class="btn btn-nav"><i class="fa fa-plus-circle"></i>&nbsp; {% trans "Add Password" %}</a>
					<button type="button" class="btn btn-nav dropdown-toggle" data-toggle="dropdown">
						<span class="caret"></span>
						<span class="sr-only">Toggle Dropdown</span>
					</button>
					<ul class="dropdown-menu" role="menu">
						<li><a href="{% url 'secrets.secret-add' content_type='cc' %}"><i class="fa fa-credit-card"></i>&nbsp; {% trans "Add Credit Card" %}</a></li>
						<li><a href="{% url 'secrets.secret-add' content_type='file' %}"><i class="fa fa-upload"></i>&nbsp; {% trans "Upload File" %}</a></li>
					</ul>
				</div>
			</ul>
			<ul class="nav navbar-nav navbar-right">
				{% if request.user.is_superuser %}
				<li class="dropdown">
					<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-cog"></i>&nbsp; {% trans "Administration" %} <span class="caret"></span></a>
					<ul class="dropdown-menu" role="menu">
						<li><a href="{% url 'audit.log' %}"><i class="fa fa-address-card-o" aria-hidden="true"></i> &nbsp; {% trans "Audit log" %}</a></li>
						<li><a href="{% url 'accounts.user-list' %}"><i class="fa fa-users" aria-hidden="true"></i> &nbsp; {% trans "Users" %}</a></li>
					</ul>
				</li>
				{% endif %}
				<li class="dropdown">
					<a href="#" class="dropdown-toggle" data-toggle="dropdown">
						<img class="avatar" src="{% gravatar_url request.user.email 64 %}">
						&nbsp; {{ request.user.username }}
						{% if access_request_count > 0 %} &nbsp; <span class="badge badge-danger">{{ access_request_count }}</span>{% endif %}
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu" role="menu">
						<li><a href="{% url 'secrets.access_request-list' %}"><i class="fa fa-check-square-o"></i>&nbsp; {% trans "Access Requests" %} &nbsp; <span class="badge">{{ access_request_count }}</span></a></li>
						<li class="divider"></li>
						<li><a href="{% url 'accounts.logout' %}"><i class="fa fa-sign-out"></i>&nbsp; {% trans "Logout" %}</a></li>
					</ul>
				</li>
			</ul>
		</div>
	</div>
</nav>
<div class="container container-opaque">
	<div class="row">
		<div class="col-md-12">
			<form action="{% url 'secrets.secret-list' %}" role="search" method="GET">
				<div class="input-group input-group-lg search-group">
					<input id="search" name="search" placeholder="{% trans "Search secrets..." %}" value="{{ search_term }}" type="text" class="form-control">
					<span class="input-group-btn">
						<button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button>
					</span>
				</div>
			</form>
		</div>
	</div>
</div>
{% block "content" %}{% endblock %}
<div class="container">
	<div class="row">
		<div class="col-md-12">
			<footer>
				TeamVault {{ version }} &nbsp; &middot; &nbsp; &copy; 2014-2019 //SEIBERT/MEDIA GmbH
			</footer>
		</div>
	</div>
</div>
{% endblock %}
