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.
99 lines
3.0 KiB
HTML
99 lines
3.0 KiB
HTML
{% 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 (7h–20h, 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 %}
|