2021-05-29 09:22:04 +02:00
{% load static bulma i18n %}
2020-11-20 19:31:22 +01:00
<!DOCTYPE html>
< html >
2020-12-18 11:48:07 +01:00
< head >
2020-12-20 13:46:25 +01:00
< title > Kadenios< / title >
2020-12-19 12:58:49 +01:00
< meta http-equiv = "Content-Type" content = "text/html; charset=UTF-8" >
2020-12-18 11:48:07 +01:00
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2021-06-09 15:37:06 +02:00
{# Favicon #}
2021-06-11 14:41:05 +02:00
< link rel = "shortcut icon" type = "image/png" href = "{% static 'images/kadenios.png' %}" >
2021-06-09 15:37:06 +02:00
2020-12-18 11:48:07 +01:00
{# CSS #}
2020-12-18 13:53:31 +01:00
< link rel = "stylesheet" href = "{% static 'css/main.css' %}" >
< link rel = "stylesheet" href = "{% static 'vendor/font-awesome/css/font-awesome.min.css' %}" >
2020-12-19 12:58:49 +01:00
< link rel = "stylesheet" href = "{% static 'vendor/font-awesome/css/solid.min.css' %}" >
2020-12-18 11:48:07 +01:00
2020-12-18 15:02:04 +01:00
< script >
2021-08-20 18:34:03 +02:00
const _$ = (s, e = document, a = true) => {
2021-08-20 22:06:09 +02:00
const r = e.querySelectorAll(s) || [];
2021-08-20 18:34:03 +02:00
if (!a) {
return r.item(0);
}
return r;
};
2021-08-20 22:06:09 +02:00
2021-08-20 18:34:03 +02:00
const _id = s => document.getElementById(s);
2021-08-21 15:17:52 +02:00
const _get = (u, f) => {
const xhr = new XMLHttpRequest();
xhr.responseType = 'json';
xhr.addEventListener('load', () => {
f(xhr.response);
});
xhr.open('GET', u);
xhr.send();
};
const _post = (u, d, f) => {
const xhr = new XMLHttpRequest();
const fd = new FormData(d);
xhr.responseType = 'json';
xhr.addEventListener('load', () => {
f(xhr.response);
});
xhr.open('POST', u);
xhr.send(fd);
};
const _notif = (m, c = 'success') => {
const n = document.createElement('div');
n.classList.add('notification', `is-${c}`, 'is-light');
n.innerHTML = `${m}< button class = "delete" > < / button > `;
_id('notifications').insertBefore(n, _id('content'))
_$('.delete', n, false).addEventListener('click', () => {
n.remove();
});
}
2020-12-18 15:02:04 +01:00
document.addEventListener('DOMContentLoaded', () => {
2021-03-23 12:46:38 +01:00
// Delete notifications
2021-08-20 18:34:03 +02:00
_$('.notification .delete').forEach(d => {
2021-08-20 22:06:09 +02:00
const n = d.parentNode;
2020-12-18 15:02:04 +01:00
2021-08-20 18:34:03 +02:00
d.addEventListener('click', () => {
2021-08-21 15:17:52 +02:00
n.remove();
2020-12-18 15:02:04 +01:00
});
});
2021-03-23 12:46:38 +01:00
// Interact with dropdowns
2021-08-20 22:06:09 +02:00
const ds = _$('.dropdown:not(.is-hoverable)');
2021-03-23 12:46:38 +01:00
2021-08-20 18:34:03 +02:00
ds.forEach(d => {
d.addEventListener('click', e => {
e.stopPropagation();
d.classList.toggle('is-active');
2021-03-23 12:46:38 +01:00
});
});
document.addEventListener('click', () => {
2021-08-20 18:34:03 +02:00
ds.forEach(d => {
d.classList.remove('is-active');
2021-03-23 12:46:38 +01:00
});
});
2021-04-09 11:40:16 +02:00
// Interact with modals
2021-08-20 22:06:09 +02:00
const ms = _$('.modal');
const mbs = _$('.modal-button');
const mcs = _$('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button-close');
2021-08-20 18:34:03 +02:00
mbs.forEach(b => {
b.addEventListener('click', () => {
2021-08-20 22:06:09 +02:00
const m = _id(b.dataset.target);
2021-08-20 18:34:03 +02:00
if ('post_url' in b.dataset) {
_$('form', m, false).action = b.dataset.post_url;
};
if ('title' in b.dataset) {
_$('.modal-card-title', m, false).innerHTML = b.dataset.title;
};
2021-04-09 11:40:16 +02:00
document.documentElement.classList.add('is-clipped');
2021-08-20 18:34:03 +02:00
m.classList.add('is-active');
2021-04-09 11:40:16 +02:00
});
});
2021-08-20 18:34:03 +02:00
mcs.forEach(d => {
d.addEventListener('click', () => {
2021-04-09 11:40:16 +02:00
document.documentElement.classList.remove('is-clipped');
2021-08-20 18:34:03 +02:00
ms.forEach(m => {
m.classList.remove('is-active');
2021-04-09 11:40:16 +02:00
});
});
});
2021-08-20 18:34:03 +02:00
document.addEventListener('keydown', ev => {
2021-08-20 22:06:09 +02:00
const e = ev || window.event;
2021-03-23 12:46:38 +01:00
if (e.keyCode === 27) {
2021-08-20 18:34:03 +02:00
ds.forEach(d => {
d.classList.remove('is-active');
2021-03-23 12:46:38 +01:00
});
2021-08-20 18:34:03 +02:00
2021-04-09 11:40:16 +02:00
document.documentElement.classList.remove('is-clipped');
2021-08-20 18:34:03 +02:00
ms.forEach(m => {
m.classList.remove('is-active');
2021-04-09 11:40:16 +02:00
});
2021-03-23 12:46:38 +01:00
}
});
2021-04-09 11:40:16 +02:00
2021-04-14 03:22:22 +02:00
// Language selection
2021-08-20 22:06:09 +02:00
_$('.dropdown-item.lang-selector').forEach(l => {
2021-08-20 18:34:03 +02:00
l.addEventListener('click', () => {
_id('lang-input').value = l.dataset.lang;
_id('lang-form').submit();
2021-04-14 03:22:22 +02:00
});
});
2021-05-26 23:44:46 +02:00
// Disable button after form submission
2021-08-20 18:34:03 +02:00
_$('form').forEach(f => {
f.addEventListener('submit', () => {
_$('button[type=submit]', f).forEach(b => {
b.classList.add('is-loading');
setTimeout(() => {
b.classList.remove('is-loading');
}, 1000);
});
2021-05-26 23:44:46 +02:00
});
});
2021-08-20 12:12:36 +02:00
// Scroll to top button
2021-08-20 22:06:09 +02:00
const up = _id('scroll-button');
2021-08-20 12:48:39 +02:00
if (document.documentElement.scrollTop >= 100) {
2021-08-20 18:34:03 +02:00
up.classList.remove('is-hidden');
2021-08-20 12:48:39 +02:00
}
2021-08-20 12:12:36 +02:00
window.onscroll = () => {
2021-08-20 12:48:39 +02:00
if (document.documentElement.scrollTop >= 100) {
2021-08-20 18:34:03 +02:00
up.classList.remove('is-hidden');
2021-08-20 12:12:36 +02:00
} else {
2021-08-20 18:34:03 +02:00
up.classList.add('is-hidden');
2021-08-20 12:12:36 +02:00
}
}
2021-08-20 18:34:03 +02:00
up.addEventListener('click', () => {
2021-08-20 12:12:36 +02:00
window.scrollTo({
top: 0,
behavior: 'smooth',
});
});
2020-12-18 15:02:04 +01:00
});
< / script >
2021-08-20 18:34:03 +02:00
{% block extra_head %}{% endblock extra_head %}
2020-12-18 11:48:07 +01:00
< / head >
< body >
2021-08-20 16:47:30 +02:00
< button id = "scroll-button" class = "button is-rounded is-large is-hidden has-tooltip" data-tooltip = "{% trans " Revenir en haut de la page " % } " >
2021-08-20 12:12:36 +02:00
< span class = "icon is-large has-text-primary" >
< i class = "fas fa-2x fa-chevron-circle-up" > < / i >
< / span >
< / button >
2020-12-18 11:48:07 +01:00
< nav class = "level has-background-primary" >
2021-03-20 09:56:25 +01:00
< div class = "level-left px-4" >
2020-12-19 23:48:18 +01:00
< div class = "level-item" >
2021-06-15 11:41:04 +02:00
< a href = "{% url 'kadenios' %}" >
2020-12-21 21:14:52 +01:00
< h1 class = "has-text-primary-light is-size-1 is-family-secondary" > Kadenios< / h1 >
< / a >
2020-12-19 23:48:18 +01:00
< / div >
2021-03-27 01:21:44 +01:00
2021-06-15 11:41:04 +02:00
< div class = "level-item pl-4" >
< a href = "{% url 'election.list' %}" >
2021-03-27 01:21:44 +01:00
< h3 class = "has-text-primary-light has-text-weight-semibold is-size-3" > {% trans "Élections" %}< / h3 >
< / a >
< / div >
2021-06-15 11:41:04 +02:00
2021-06-18 18:08:12 +02:00
{% comment %}
2021-06-15 11:41:04 +02:00
< div class = "level-item pl-4" >
< a href = "{% url 'faq.list' %}" >
< h3 class = "has-text-primary-light has-text-weight-semibold is-size-3" > {% trans "FAQ" %}< / h3 >
< / a >
< / div >
2021-06-18 18:08:12 +02:00
{% endcomment %}
2020-12-18 11:48:07 +01:00
< / div >
2020-12-21 13:38:18 +01:00
2021-03-20 09:56:25 +01:00
< div class = "level-right px-5" >
2021-04-14 20:51:04 +02:00
{% block auth %}
< div class = "level-item" >
{% if user.is_authenticated %}
< div class = "level is-mobile" >
2021-07-13 02:41:32 +02:00
{# Paramètres de Kadenios #}
{% if user.is_staff %}
< div class = "level-item has-tooltip-light has-tooltip-bottom" data-tooltip = "Administration" >
< a class = "button is-primary" href = "{% url 'auth.admin' %}" >
< span class = "icon is-size-3" >
< i class = "fas fa-cog" > < / i >
< / span >
< / a >
< / div >
{% endif %}
2021-04-14 20:51:04 +02:00
< div class = "level-item" >
< div class = "tag" >
2021-04-26 17:54:07 +02:00
{% blocktrans with name=user.base_username connection=user.connection_method %}Connecté·e en tant que {{ name }} par {{ connection }}{% endblocktrans %}
2021-04-14 20:51:04 +02:00
< / div >
< / div >
< div class = "level-item" >
< a class = "button is-primary" href = "{% url 'authens:logout' %}?next={% if view.get_next_url %}{{ view.get_next_url }}{% else %}/{% endif %}" >
< span class = "icon is-size-1" >
< i class = "fas fa-sign-out-alt" > < / i >
< / span >
< / a >
< / div >
< / div >
{% else %}
< div class = "level-item py-2" >
2021-04-15 17:01:17 +02:00
< a class = "button" href = "{% url 'authens:login' %}?next={{ request.path }}" >
< span class = "is-size-5" > {% trans "Se connecter" %}< / span >
< span class = "icon is-size-4" >
< i class = "fas fa-sign-in-alt" > < / i >
2021-04-14 20:51:04 +02:00
< / span >
< / a >
< / div >
{% endif %}
< / div >
{% endblock %}
2021-04-14 03:22:22 +02:00
{# Choix de la langue #}
2021-04-14 20:51:04 +02:00
< div class = "level-item" >
2021-04-14 03:22:22 +02:00
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as langs %}
< form action = "{% url " set_language " % } " method = "POST" id = "lang-form" >
{% csrf_token %}
< input type = "hidden" name = "language" id = "lang-input" >
< / form >
2021-04-14 20:51:04 +02:00
< div class = "dropdown is-hoverable is-right" >
2021-04-14 03:22:22 +02:00
< div class = "dropdown-trigger" >
2021-04-15 17:01:17 +02:00
< a class = "button is-primary is-large" aria-haspopup = "true" aria-controls = "dropdown-menu" >
< span class = "icon is-size-2" >
2021-04-14 03:22:22 +02:00
< i class = "fas fa-language" > < / i >
< / span >
< / a >
< / div >
< div class = "dropdown-menu" >
< div class = "dropdown-content" >
{% for lang in langs %}
{% with lang_svg="images/"|add:lang.code|add:".svg" %}
< a class = "dropdown-item lang-selector" data-lang = "{{ lang.code }}" >
< span class = "icon-text" >
< span class = "icon" >
< img src = "{% static lang_svg %}" >
< / span >
< span class = "ml-1" > {{ lang.name_translated }}< / span >
< / span >
{% endwith %}
< / a >
2021-04-14 20:51:04 +02:00
{% if not forloop.last %}
< hr class = "dropdown-divider" >
{% endif %}
2021-04-14 03:22:22 +02:00
{% endfor %}
< / div >
< / div >
< / div >
< / div >
2020-12-18 11:48:07 +01:00
< / div >
< / nav >
2021-07-13 02:41:32 +02:00
2020-12-18 11:48:07 +01:00
{% block layout %}
2020-12-18 15:02:04 +01:00
< div class = "main-content" >
< div class = "columns is-centered" >
2020-12-24 01:10:05 +01:00
< div class = "column is-two-thirds-fullhd is-12-desktop is-12-widescreen" >
2021-08-21 15:17:52 +02:00
< section id = "notifications" class = "section pt-3" >
2020-12-18 15:02:04 +01:00
{% for message in messages %}
< div class = "notification is-{{ message.level_tag|bulma_message_tag }} is-light" >
{% if 'safe' in message.tags %}
{{ message|safe }}
{% else %}
{{ message }}
{% endif %}
< button class = "delete" > < / button >
< / div >
{% endfor %}
2021-08-21 15:17:52 +02:00
< div id = "content" class = "box" >
2020-12-18 15:02:04 +01:00
{% block content %}
{% endblock content %}
< / div >
< / section >
< / div >
2020-11-20 19:31:22 +01:00
< / div >
2020-12-18 11:48:07 +01:00
< / div >
{% endblock layout %}
2020-12-18 15:02:04 +01:00
< footer class = "footer" >
< p class = "has-text-centered" >
2020-12-19 22:49:50 +01:00
{% blocktrans %}Développé par < a class = "tag is-light is-danger" href = "https://www.eleves.ens.fr/kde" > KDEns< / a > . En cas de pépin, contacter < span class = "tag is-info is-light" > klub-dev [at] ens [dot] fr< / span > .{% endblocktrans %}
2020-12-18 15:02:04 +01:00
< / p >
< / footer >
2021-08-21 15:17:52 +02:00
{% block custom_js %}{% endblock %}
2020-12-18 11:48:07 +01:00
< / body >
2020-11-20 19:31:22 +01:00
< / html >
