{% extends "bootstrap/base.html" %}
{% import "bootstrap/utils.html" as utils %}

{% set navbar = [
	('general_bp.home', 'Home'),
	('order_bp.orders', 'Orders'),
	('general_bp.locations', 'Locations'),
	('general_bp.map_view', 'Map'),
	('general_bp.about', 'About'),
	('stats_blueprint.stats', 'Stats'),
] -%}

{% if current_user.is_admin() -%}
	{% set navbar = navbar + [('admin.index', 'Admin')] -%}
{% endif -%}

{% set active_page = active_page|default('index') -%}

{% block title %}
	Haldis - {{ active_page|capitalize }}
	{% if title %}
		- {{ title }}
	{% endif %}
{% endblock %}

{% block styles %}
	{{ super() }}
	<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" media="screen">
	<link rel="stylesheet" href="{{ url_for('general_bp.theme_css') }}" media="screen">
	<link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}" media="print">
{% endblock %}

{% block scripts %}
	{{ super() }}
	<script type="text/javascript" src="{{ url_for('general_bp.current_theme_js') }}"></script>
	<script type="text/javascript" src="{{ url_for('static', filename='js/theme.js') }}"></script>
	<script type="text/javascript" src="{{ url_for('static', filename='js/timer.js') }}"></script>
	<script type="text/javascript" src="{{ url_for('static', filename='js/pwa.js') }}"></script>
{% endblock %}

{% block head %}
	{{ super() }}

	<!-- Manifest (for PWA support) -->
	<link rel="manifest" href="{{ url_for('static', filename='manifest.json') }}">

	<!-- Favicons -->
	<link rel="apple-touch-icon" sizes="180x180" href="{{ url_for('static', filename='icons/apple-touch-icon.png') }}">
	<link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static', filename='icons/favicon-32x32.png') }}">
	<link rel="icon" type="image/png" sizes="16x16" href="{{ url_for('static', filename='icons/favicon-16x16.png') }}">
	<link rel="mask-icon" href="{{ url_for('static', filename='icons/safari-pinned-tab.svg') }}" color="#5bbad5">
	<link rel="shortcut icon" href="{{ url_for('static', filename='icons/favicon.ico') }}">

	<!-- Theme colors -->
	<meta name="msapplication-TileColor" content="#1c1c1c">
	<meta name="msapplication-config" content="{{ url_for('static', filename='browserconfig.xml') }}">
	<meta name="theme-color" content="#1c1c1c">
{% endblock %}

{% block navbar %}
	<div class="background"></div>
	<div class="foreground"></div>
	<nav class="navbar navbar-default navbar-fixed-top">
		<div class="container">
			<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="{{ url_for('general_bp.home') }}">HALDIS</a>
			</div>
			<div id="navbar" class="navbar-collapse collapse">
				<ul class="nav navbar-nav">
					{% for id, text in navbar -%}
						<li class="{{ 'active' if active_page in id else '' }}">
							<a href="{{ url_for(id) }}">{{ text|e }}</a>
						</li>
					{% endfor -%}
				</ul>
				<ul class="nav navbar-nav navbar-right">
					{% if current_user.is_anonymous() %}
						<li><a href="{{ url_for('auth_bp.login') }}">Login</a></li>
					{% else %}
						<li><a href="{{ url_for('general_bp.profile') }}">{{ current_user.username }}</a></li>
						<li><a href="{{ url_for('auth_bp.logout') }}">Logout</a></li>
					{% endif %}
				</ul>
			</div><!--/.nav-collapse -->
		</div>
	</nav>
{% endblock %}

{% block content -%}
	{{ utils.flashed_messages(container=True) }}

	<div class="container main">
	{% block container -%}
	{%- endblock %}
	</div>

	<footer>
		<hr/>
		<div class="container">
			<div class="footerWrapper">
				<div class="pull-left">Made with ❤ by <a href="https://zeus.gent/">Zeus WPI</a></div>
				<div class="changeThemeButton" id="themeChange"><!-- Populated with JS --></div>
				<div class="pull-right"><a href="https://github.com/ZeusWPI/Haldis">© {{ ""|year }}</a></div>
			</div>
		</div>
	</footer>
{%- endblock %}
