Files
pointeuse-optimisator/app/templates/settings.html
Antoine 1ab1cf27c1 Ajoute les rappels de pointage via ntfy et détection de présence Tasker
Notifie l'utilisateur toutes les 5 min s'il est présent dans les locaux
sans avoir pointé le matin, ou parti sans avoir dépointé la sortie.
2026-07-17 20:45:27 +02:00

99 lines
3.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends "base.html" %}
{% block content %}
<div class="stats-head">
<div>
<span class="stats-title">Réglages</span>
<div class="stats-meta">Rappels de pointage sur ton téléphone</div>
</div>
</div>
<div class="settings-card">
<span class="hist-label">Notifications (ntfy)</span>
<p class="settings-p">
Crée un topic sur <a href="https://ntfy.sh" target="_blank" rel="noopener">ntfy.sh</a> (un identifiant
secret que toi seul connais), abonne-toi dessus avec l'app ntfy sur ton téléphone, puis renseigne-le ici.
</p>
{% if saved %}
<div class="settings-saved">Enregistré.</div>
{% endif %}
<form method="post" action="/settings" class="settings-form">
<label class="login-label" for="ntfy_topic">Topic ntfy</label>
<input
id="ntfy_topic"
class="login-input"
type="text"
name="ntfy_topic"
value="{{ ntfy_topic }}"
placeholder="ex: antoine-pointeuse-x7f2"
autocomplete="off"
>
<button class="login-btn" type="submit">Enregistrer</button>
</form>
</div>
<div class="settings-card">
<span class="hist-label">Détection de présence (Tasker)</span>
<p class="settings-p">
Crée une automatisation Tasker déclenchée par une géofence autour du bureau : à l'<b>entrée</b> de la
zone, appelle l'URL "arrivée" ; à la <b>sortie</b>, l'URL "départ". Tant que tu es détecté présent sans
avoir pointé l'entrée du matin, ou parti sans avoir pointé la sortie, tu reçois un rappel toutes les
5 minutes (7h20h, jours ouvrés).
</p>
<div class="settings-urlrow">
<span class="settings-urllabel">Arrivée</span>
<code class="settings-url">{{ arrivee_url }}</code>
</div>
<div class="settings-urlrow">
<span class="settings-urllabel">Départ</span>
<code class="settings-url">{{ depart_url }}</code>
</div>
<p class="settings-hint">
Ces URLs sont secrètes (elles contiennent ton token) — ne les partage pas.
</p>
</div>
<style>
.settings-card {
background: var(--surface);
border: 1.5px solid var(--rule);
padding: 1.25rem 1.5rem;
display: flex;
flex-direction: column;
gap: .75rem;
}
.settings-p { font-size: 13px; color: var(--text); line-height: 1.6; }
.settings-p a { color: var(--accent); }
.settings-form { display: flex; flex-direction: column; gap: .5rem; max-width: 420px; }
.settings-saved {
background: var(--pos-bg);
border-left: 3px solid var(--pos);
color: var(--pos);
font-size: 12px;
padding: .5rem .8rem;
font-family: var(--mono);
}
.settings-urlrow { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.settings-urllabel {
font-family: var(--mono);
font-size: 10px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--muted);
width: 70px;
flex-shrink: 0;
}
.settings-url {
font-family: var(--mono);
font-size: 12px;
color: var(--text);
background: var(--ground);
border: 1px solid var(--rule);
padding: .4rem .6rem;
word-break: break-all;
}
.settings-hint { font-size: 11px; color: var(--muted); }
</style>
{% endblock %}