{% extends "base_html.html" %}
{% load static %}

{% block title %}Mathics in Django{% endblock %}

{% block html_head %}
	<script type="text/javascript" src="{% static 'js/scriptaculous/effects.js' %}"></script>
	<script type="text/javascript" src="{% static 'js/scriptaculous/dragdrop.js' %}"></script>
{% endblock %}

{% block html_body %}
	<header>
		<div id="headerleft">
			<a href="https://mathics.org" style="text-decoration: none">
				<img id="logo" class="load" src="{% static 'img/logo-heptatom.svg' %}" height="32" alt="Logo" />
				<img id="logotext" class="load" src="{% static 'img/logo-text.svg' %}" height="26" alt="Mathics" />
			</a>

			<div class="menu">
				<a href="javascript:showOpen()" title="Open Worksheet"><i class="fa fa-file-text"></i></a>
				<a href="javascript:showSave()" title="Save Worksheet"><i class="fa fa-download"></i></a>
				<a href="javascript:createLink()" title="Generate Worksheet Input Hash"><i class="fa fa-share-alt"></i></a>
			</div>
		</div>

		<div id="headerright">
			<input id="search" type="text" /><a id="doclink" href="javascript:toggleDoc()" title="Docs">
				<i class="fa fa-lg fa-question-circle-o"></i>
			</a>

			{% if require_login %}
				<div id="notAuthenticated" class="login">
					<a href="javascript:showLogin()" class="fa fa-lg fa-sign-in" title="Sign in"></a>
				</div>
			{% endif %}

			<div id="authenticated" class="login" style="display: none">
				<span id="username"></span>
				<a id="logout" href="javascript:logout()" class="fa fa-lg fa-sign-out" title="Sign out"></a>
			</div>
		</div>
	</header>

	<!-- login -->
	<script type="text/javascript">
		var REQUIRE_LOGIN = {% if require_login %}true{% else %} false{% endif %};
	</script>

	{% if user.is_authenticated %}
		<script type="text/javascript">
			$(document).observe('dom:loaded', function () {
				onLogin("{{ user.email }}");
			});
		</script>
	{% endif %}

	{% block main %}
	{% endblock main %}

	{% include "authentication.html" %}
	{% include "inout.html" %}
{% endblock html_body %}
