104 lines
3.9 KiB
HTML
104 lines
3.9 KiB
HTML
{% load static %}
|
|
<html>
|
|
<head>
|
|
{% include "head.html" %}
|
|
</head>
|
|
<body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
|
|
<div class="window" id="main-window">
|
|
<div class="title-bar main-title-bar">
|
|
<div class="title-bar-text">
|
|
{% block window-title %}{% endblock %}
|
|
</div>
|
|
<div class="title-bar-controls">
|
|
<button aria-label="Minimize" onclick="resetWindow()"></button>
|
|
<button aria-label="Restore" onclick="resetWindow()"></button>
|
|
<form action="{% url 'oidc_logout' %}" method="post">
|
|
{% csrf_token %}
|
|
<button aria-label="Close" onclick="hideWindow()"></button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="window-body">
|
|
<menu role="tablist" hx-boost="true" class="multirows">
|
|
<li role="tab" {% if request.path == '/vote/' %}aria-selected="true" {% endif %}>
|
|
<a href="{% url 'vote' %}">Stemmen</a>
|
|
</li>
|
|
<li role="tab" {% if request.path == '/track/' %}aria-selected="true" {% endif %}>
|
|
<a href="{% url 'nominate' %}">Nomineren</a>
|
|
</li>
|
|
<li role="tab" {% if request.path == '/overview/' %}aria-selected="true" {% endif %}>
|
|
<a href="{% url 'overview' %}">Overzicht</a>
|
|
</li>
|
|
<li role="tab" {% if request.path == '/settings/' %}aria-selected="true" {% endif %}>
|
|
<a href="{% url 'settings' %}">Instellingen</a>
|
|
</li>
|
|
</menu>
|
|
{% block multi-row %}{% endblock %}
|
|
<div class="window" role="tabpanel">
|
|
<div class="window-body">
|
|
{% if message_type %}
|
|
<script>
|
|
function hidePopup() {
|
|
document.getElementById("info-window").classList.add("hide");
|
|
}
|
|
</script>
|
|
<div class="window popup" id="info-window">
|
|
<div class="title-bar">
|
|
<div class="title-bar-text">
|
|
{% if message_title %}{{message_title}}{% else %}{{message_type | title}}{% endif %}
|
|
</div>
|
|
<div class="title-bar-controls">
|
|
<button aria-label="Close" onclick="hidePopup()"></button>
|
|
</div>
|
|
</div>
|
|
<div class="window-body">
|
|
<div class="icon {{message_type}}"></div>
|
|
<div class="text">
|
|
<div>
|
|
{{message}}
|
|
</div>
|
|
<section class="field-row" style="justify-content: flex-end">
|
|
<button onclick="hidePopup()">Ok</button>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% block main-content %}{% endblock %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% block status-bar %}{% endblock%}
|
|
</div>
|
|
{% block clippy %}{% endblock %}
|
|
<script>
|
|
position.get_pos(); // Gets position from localStorage
|
|
clippy = document.getElementById("clippy")
|
|
window.addEventListener('load', function () {
|
|
interact('.main-title-bar').draggable({
|
|
listeners: {
|
|
move (event) {
|
|
position.x += event.dx
|
|
position.y += event.dy
|
|
event.target.parentElement.style.transform = `translate(${position.x}px, ${position.y}px)`
|
|
if (clippy) document.getElementById("clippy").style.transform = `translate(${position.x}px, ${position.y}px)`
|
|
},
|
|
}
|
|
})
|
|
})
|
|
|
|
|
|
function hideWindow() {
|
|
document.getElementById("main-window").classList.add("hide");
|
|
}
|
|
|
|
function resetWindow() {
|
|
position.reset()
|
|
document.getElementById("main-window").style.transform = '';
|
|
if (clippy) document.getElementById("clippy").style.transform = '';
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|