Compare commits
5 Commits
v2026.5.21
...
v2026.5.26
| Author | SHA1 | Date | |
|---|---|---|---|
 FroSteel
|
df623da8f4 | ||
|
FroSteel
|
1441b0a7a1 | ||
|
FroSteel
|
5eae40d38b | ||
|
FroSteel
|
e69482add4 | ||
|
FroSteel
|
a382d8f35f |
@@ -1184,6 +1184,11 @@ chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
||||
url: `${origin}/`, // racine → EV redirige vers SSO si besoin
|
||||
active: true
|
||||
});
|
||||
// v2026.5.16 : surveiller cet onglet — si on tombe sur la page de
|
||||
// login manuel portail.etat-de-vaud.ch/iamlogin/, rediriger vers
|
||||
// portail.etat-de-vaud.ch/iam/accueil/ qui déclenche le Windows
|
||||
// SSO Kerberos automatiquement.
|
||||
watchReconnectTabForIamLogin(tab.id);
|
||||
sendResponse({ ok: true, tabId: tab.id, origin });
|
||||
} catch (err) {
|
||||
sendResponse({ ok: false, error: err.message || String(err) });
|
||||
|
||||
+1
-1
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"manifest_version": 3,
|
||||
"name": "Planification",
|
||||
"version": "2026.5.21",
|
||||
"version": "2026.5.26",
|
||||
"description": "Vue claire et rapide du planning des techniciens EasyVista. Regroupe interventions et réservations par tech, affiche horaires, contact, lieu, catégorie et statut en un coup d'œil.",
|
||||
"browser_specific_settings": {
|
||||
"gecko": {
|
||||
|
||||
+464
-18
@@ -9,8 +9,8 @@
|
||||
--border: #e2e4e8;
|
||||
--border-strong: #cfd3da;
|
||||
--text: #1a1f2b;
|
||||
--text-muted: #5b6573;
|
||||
--text-faint: #8892a0;
|
||||
--text-muted: #2e3642; /* v2026.5.29 : +contraste (était #4a5260) */
|
||||
--text-faint: #50596a; /* v2026.5.29 : +contraste (était #6c7583) */
|
||||
--accent: #0f4f8b;
|
||||
--accent-soft: #e1ecf7;
|
||||
--danger: #b03030;
|
||||
@@ -59,8 +59,8 @@
|
||||
--border: #2e333c;
|
||||
--border-strong: #414754;
|
||||
--text: #e6e8ec;
|
||||
--text-muted: #9ba2ad;
|
||||
--text-faint: #6a727e;
|
||||
--text-muted: #d0d5de; /* v2026.5.29 : +contraste (était #b8c0cc) — quasi blanc */
|
||||
--text-faint: #a8b0bc; /* v2026.5.29 : +contraste (était #8b93a0) */
|
||||
--accent: #5ea8e8;
|
||||
--accent-soft: #223348;
|
||||
--danger: #e87878;
|
||||
@@ -842,6 +842,17 @@ html, body {
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
/* v2026.5.29 : highlight visible sur les rows .intervention-v2 quand on
|
||||
survole le segment timeline correspondant (ou que l'user survole la row) */
|
||||
.intervention-v2.highlight {
|
||||
background: var(--accent-soft);
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: -2px;
|
||||
box-shadow: 0 0 0 3px var(--accent-soft);
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Interventions — layout v2 (heures verticales)
|
||||
========================================================================== */
|
||||
@@ -1832,22 +1843,28 @@ body.modal-open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* v4.2.9 : pied de page discret en bas à droite — affiche auteur + date + version */
|
||||
/* v4.2.9 : pied de page discret en bas à droite — affiche auteur + date + version
|
||||
v2026.5.29 : agrandi + plus contrasté */
|
||||
.app-footer {
|
||||
position: fixed;
|
||||
right: 8px;
|
||||
bottom: 4px;
|
||||
font-size: 10px;
|
||||
color: var(--text-faint, #8892a0);
|
||||
opacity: 0.55;
|
||||
pointer-events: none; /* ne capture pas les clics */
|
||||
right: 10px;
|
||||
bottom: 6px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--text-muted);
|
||||
opacity: 0.85;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: 0.2px;
|
||||
z-index: 1; /* sous les modals (qui sont à 10000) */
|
||||
letter-spacing: 0.3px;
|
||||
z-index: 1;
|
||||
padding: 3px 8px;
|
||||
background: var(--bg-muted);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
}
|
||||
.app-footer:hover {
|
||||
opacity: 0.85;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* ─────────────────────────────────────────────────────────────────────────
|
||||
@@ -1992,16 +2009,15 @@ body.modal-open {
|
||||
/* ─────────────────────────────────────────────────────────────────────────
|
||||
v5.0.0 : horloge au milieu de la topbar (HH:MM, pas de secondes)
|
||||
───────────────────────────────────────────────────────────────────────── */
|
||||
/* v2026.5.16 : app-clock contient maintenant 2 lignes empilées :
|
||||
- app-clock-date : "Mardi 21 avril 2026" (petit)
|
||||
- app-clock-time : "12:34" (grand) */
|
||||
/* v2026.5.27 : app-clock sur UNE seule ligne : "Jeudi 23.04.26 • 21:55"
|
||||
Même taille pour la date et l'heure, gros point au milieu. */
|
||||
.app-clock {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
line-height: 1.1;
|
||||
@@ -2480,3 +2496,433 @@ header.topbar::before {
|
||||
.banner-reconnect-failed .banner-btn-primary:hover {
|
||||
background: #f8d7da;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.16 : responsive topbar
|
||||
========================================================================== */
|
||||
|
||||
/* Breakpoint medium : entre 1000 et 1300px, on compacte un peu */
|
||||
@media (max-width: 1300px) {
|
||||
.app-clock-date { font-size: 11px; }
|
||||
.app-clock-time { font-size: 20px; }
|
||||
.topbar-right .btn-action .btn-action-label,
|
||||
.topbar-right .btn-refresh .btn-refresh-label {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Breakpoint small : moins de 1000px, on masque les labels de boutons action
|
||||
et on réduit encore l'horloge. Les icônes restent, titres restent. */
|
||||
@media (max-width: 1000px) {
|
||||
.topbar { padding: 8px 14px; gap: 8px; }
|
||||
.topbar h1 { font-size: 16px; }
|
||||
.app-clock { font-size: smaller; }
|
||||
.app-clock-date { font-size: 10px; }
|
||||
.app-clock-time { font-size: 18px; }
|
||||
.btn-action .btn-action-label,
|
||||
.btn-refresh .btn-refresh-label {
|
||||
display: none;
|
||||
}
|
||||
.btn-action, .btn-refresh {
|
||||
padding: 6px 10px;
|
||||
}
|
||||
.capture-info { display: none; }
|
||||
}
|
||||
|
||||
/* Breakpoint très petit : moins de 720px, on cache la date complète (garde
|
||||
juste l'heure) et on autorise le wrap total */
|
||||
@media (max-width: 720px) {
|
||||
.topbar {
|
||||
flex-wrap: wrap;
|
||||
padding: 6px 10px;
|
||||
}
|
||||
.app-clock {
|
||||
position: static;
|
||||
transform: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.app-clock-date { display: none; }
|
||||
.topbar-left { flex-wrap: wrap; }
|
||||
.date-nav { margin-top: 4px; }
|
||||
.date-picker-day { min-width: 46px; font-size: 12px; }
|
||||
.topbar-right { flex-wrap: wrap; justify-content: flex-end; }
|
||||
}
|
||||
|
||||
/* Breakpoint minuscule : masque aussi les labels de refresh, boutons deviennent
|
||||
vraiment iconifiés */
|
||||
@media (max-width: 520px) {
|
||||
.app-clock-time { font-size: 16px; }
|
||||
.topbar h1 { font-size: 14px; }
|
||||
.btn-today { padding: 4px 6px; font-size: 11px; }
|
||||
.btn-nav { min-width: 26px; padding: 4px 6px; }
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : topbar des popups épinglés (3 boutons : _ ▭ 📍)
|
||||
========================================================================== */
|
||||
.pinned-popup {
|
||||
/* Laisser un peu de place en haut pour la topbar */
|
||||
padding-top: 30px !important;
|
||||
}
|
||||
/* v2026.5.18 : masquer le conteneur d'actions d'origine (↻ reload + 📌 pin)
|
||||
dans les popups épinglés — leur place est reprise par notre .pinned-popup-topbar */
|
||||
.pinned-popup .tooltip-actions {
|
||||
display: none !important;
|
||||
}
|
||||
.pinned-popup-topbar {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
align-items: center;
|
||||
z-index: 10;
|
||||
}
|
||||
.pinned-popup-btn {
|
||||
width: 26px;
|
||||
height: 22px;
|
||||
padding: 0;
|
||||
font-size: 13px;
|
||||
line-height: 1;
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background 0.1s, color 0.1s, border-color 0.1s;
|
||||
font-family: inherit;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.pinned-popup-btn:hover {
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
border-color: var(--border);
|
||||
}
|
||||
.pinned-popup-unpin {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : mode Minimisé (popup flottant compact, juste la ref)
|
||||
v2026.5.19 : refonte — élément .pinned-popup-minref créé à la volée
|
||||
v2026.5.21 : agrandi pour que la ref tienne sans déborder
|
||||
v2026.5.22 : encore agrandi + plus d'espace entre dragbar et topbar
|
||||
========================================================================== */
|
||||
.pinned-popup.pinned-popup-minimized {
|
||||
min-width: 300px !important;
|
||||
max-width: 360px !important;
|
||||
width: 300px !important;
|
||||
height: auto !important;
|
||||
min-height: 80px !important;
|
||||
padding: 44px 16px 16px 16px !important;
|
||||
overflow: visible;
|
||||
background: var(--bg-elevated) !important;
|
||||
border: 1px solid var(--border) !important;
|
||||
}
|
||||
/* Séparer visuellement la dragbar (collée en haut) des boutons topbar */
|
||||
.pinned-popup.pinned-popup-minimized .pinned-popup-topbar {
|
||||
top: 14px !important; /* sous la dragbar (qui fait ~6-8px) */
|
||||
}
|
||||
/* Masquer tous les enfants directs du popup minimisé */
|
||||
.pinned-popup.pinned-popup-minimized > *:not(.pinned-popup-topbar):not(.pinned-popup-dragbar):not(.pinned-popup-minref) {
|
||||
display: none !important;
|
||||
}
|
||||
/* L'élément ref dédié, centré et gros */
|
||||
.pinned-popup-minref {
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 10px 12px;
|
||||
font-family: var(--mono, monospace);
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
color: var(--text);
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
border-radius: 4px;
|
||||
transition: background 0.12s;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.pinned-popup-minref:hover {
|
||||
background: var(--bg-muted);
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : mode Réduit (docké en bas de l'écran) + taskbar
|
||||
========================================================================== */
|
||||
.pinned-popup.pinned-popup-reduced {
|
||||
display: none !important;
|
||||
}
|
||||
.pinned-popups-dock {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 50;
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
padding: 6px 10px;
|
||||
background: var(--bg-elevated);
|
||||
border-top: 1px solid var(--border);
|
||||
box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
|
||||
align-items: center;
|
||||
}
|
||||
.pinned-popups-dock.visible {
|
||||
display: flex;
|
||||
}
|
||||
.pinned-popup-dock-pill {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 6px 14px;
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 16px;
|
||||
font-family: var(--mono, monospace);
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
transition: background 0.15s, transform 0.15s, filter 0.15s;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.pinned-popup-dock-pill:hover {
|
||||
transform: translateY(-1px);
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
/* v2026.5.18 : couleurs par catégorie (fond = couleur, texte blanc) */
|
||||
.pinned-popup-dock-pill.color-livraison { background: var(--c-livraison); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-installation { background: var(--c-installation); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-recup { background: var(--c-recup); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-remplacement { background: var(--c-remplacement); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-incident { background: var(--c-incident); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-rollout { background: var(--c-rollout); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-reservation { background: var(--c-reservation); color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-absence { background: #2a2f36; color: white; border-color: transparent; }
|
||||
.pinned-popup-dock-pill.color-autre { background: var(--c-autre); color: white; border-color: transparent; }
|
||||
|
||||
/* v2026.5.18 : bouton "Fermer tous" à droite du dock */
|
||||
.pinned-popups-close-all {
|
||||
margin-left: auto;
|
||||
padding: 6px 12px;
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
transition: background 0.15s, color 0.15s, border-color 0.15s;
|
||||
}
|
||||
.pinned-popups-close-all:hover {
|
||||
background: rgba(239, 68, 68, 0.1);
|
||||
color: #ef4444;
|
||||
border-color: #ef4444;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : popup user-badge avec ligne session
|
||||
========================================================================== */
|
||||
.user-name-popup-name {
|
||||
font-weight: 600;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.user-name-popup-session {
|
||||
font-size: 12px;
|
||||
font-variant-numeric: tabular-nums;
|
||||
padding-top: 4px;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
.user-name-popup-session.session-ok { color: var(--text-muted); }
|
||||
.user-name-popup-session.session-warn { color: #f59e0b; font-weight: 600; }
|
||||
.user-name-popup-session.session-critical { color: #ef4444; font-weight: 700; }
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : popup alerte session qui glisse depuis haut-gauche
|
||||
========================================================================== */
|
||||
.session-slide-alert {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: -420px; /* hors écran au départ */
|
||||
width: 380px;
|
||||
max-width: calc(100vw - 40px);
|
||||
padding: 14px 18px;
|
||||
background: var(--bg-elevated);
|
||||
border: 1px solid var(--border);
|
||||
border-left: 4px solid #f59e0b;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.25);
|
||||
z-index: 1000;
|
||||
transition: left 0.28s ease-out, opacity 0.28s;
|
||||
opacity: 0;
|
||||
}
|
||||
.session-slide-alert.visible {
|
||||
left: 20px;
|
||||
opacity: 1;
|
||||
}
|
||||
.session-slide-alert.urgent {
|
||||
border-left-color: #ef4444;
|
||||
animation: session-pulse 1.4s ease-in-out infinite;
|
||||
}
|
||||
@keyframes session-pulse {
|
||||
0%, 100% { box-shadow: 0 8px 24px rgba(0,0,0,0.25); }
|
||||
50% { box-shadow: 0 8px 24px rgba(239,68,68,0.5); }
|
||||
}
|
||||
.session-slide-alert-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--text);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.session-slide-alert-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.session-slide-alert-extend,
|
||||
.session-slide-alert-later {
|
||||
padding: 6px 14px;
|
||||
font-size: 13px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border);
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
}
|
||||
.session-slide-alert-extend {
|
||||
background: #10b981;
|
||||
color: white;
|
||||
border-color: #10b981;
|
||||
font-weight: 600;
|
||||
}
|
||||
.session-slide-alert-extend:hover { background: #059669; }
|
||||
.session-slide-alert-extend:disabled { opacity: 0.6; cursor: wait; }
|
||||
.session-slide-alert-later {
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.session-slide-alert-later:hover {
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.19 : nouveaux éléments
|
||||
========================================================================== */
|
||||
|
||||
/* Bouton Actualiser (↻) dans la topbar du popup épinglé — animation spin */
|
||||
.pinned-popup-refresh {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
}
|
||||
.pinned-popup-refresh svg {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
.pinned-popup-refresh.spinning svg {
|
||||
animation: pinned-popup-refresh-spin 0.6s linear infinite;
|
||||
transform-origin: 50% 50%;
|
||||
}
|
||||
.pinned-popup-refresh.spinning {
|
||||
pointer-events: none;
|
||||
}
|
||||
@keyframes pinned-popup-refresh-spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* Pendant le drag d'un popup, ignorer les hover sur les cartes pour ne pas
|
||||
ouvrir des tooltips parasites */
|
||||
body.popup-dragging .intervention-v2,
|
||||
body.popup-dragging .card {
|
||||
pointer-events: none;
|
||||
}
|
||||
/* Mais garder les popups épinglés cliquables */
|
||||
body.popup-dragging .pinned-popup {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* Pastille dock à 2 lignes : ref (gras) + date (petit) */
|
||||
.pinned-popup-dock-pill {
|
||||
flex-direction: column !important;
|
||||
align-items: center !important;
|
||||
padding: 4px 14px !important;
|
||||
line-height: 1.1;
|
||||
gap: 1px !important;
|
||||
}
|
||||
.pinned-popup-dock-pill-ref {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
font-family: var(--mono, monospace);
|
||||
}
|
||||
.pinned-popup-dock-pill-date {
|
||||
display: block;
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
opacity: 0.85;
|
||||
font-family: var(--mono, monospace);
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.20 : mini-menu au survol d'une pastille dock
|
||||
========================================================================== */
|
||||
.pill-hover-menu {
|
||||
position: fixed;
|
||||
z-index: 60;
|
||||
background: var(--bg-elevated);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.3);
|
||||
padding: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
min-width: 130px;
|
||||
animation: pill-hover-menu-appear 0.12s ease-out;
|
||||
}
|
||||
@keyframes pill-hover-menu-appear {
|
||||
from { opacity: 0; transform: translateY(4px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.pill-hover-menu-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 6px 10px;
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
font-family: inherit;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
transition: background 0.12s;
|
||||
}
|
||||
.pill-hover-menu-btn:hover {
|
||||
background: var(--bg-muted);
|
||||
}
|
||||
.pill-hover-menu-btn.pill-hover-menu-close:hover {
|
||||
background: rgba(239, 68, 68, 0.15);
|
||||
color: #ef4444;
|
||||
}
|
||||
.pill-menu-ico {
|
||||
font-size: 14px;
|
||||
width: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.21 : icône 📍 "active" dans le tooltip hover = déjà épinglée
|
||||
========================================================================== */
|
||||
.tooltip-pinbtn.tooltip-pinbtn-active {
|
||||
opacity: 1 !important;
|
||||
filter: none !important;
|
||||
background: rgba(239, 68, 68, 0.15);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
+7
-2
@@ -9,8 +9,13 @@
|
||||
<header class="topbar">
|
||||
<div class="topbar-left">
|
||||
<!-- v4.2.3 : pastille avec initiales de l'utilisateur connecté, avant
|
||||
le titre. Clic → popup fixe avec nom complet juste en dessous. -->
|
||||
<button id="user-badge" class="user-badge hidden"
|
||||
le titre. Clic → popup fixe avec nom complet juste en dessous.
|
||||
v2026.5.34 : TOUJOURS visible d'office avec "?" (état user inconnu)
|
||||
pour garantir l'accès au menu (⊞ Vue / ⚙ Paramètres) même si
|
||||
la détection user échoue ou est en retard.
|
||||
Le script JS mettra à jour le textContent + classes quand le
|
||||
fetch aboutit. En cas d'échec persistant, reste sur "?". -->
|
||||
<button id="user-badge" class="user-badge user-badge-unknown"
|
||||
type="button" aria-label="Utilisateur connecté"
|
||||
title="Utilisateur connecté"></button>
|
||||
<h1 id="app-title">Planification</h1>
|
||||
|
||||
@@ -240,6 +240,7 @@ async function init() {
|
||||
initModalScrollLock(); // v4.2.9 : bloquer le scroll arrière quand modal
|
||||
initAppFooter(); // v4.2.9 : pied de page discret bas-droite
|
||||
initAppClock(); // v5.0.0 : horloge HH:MM au milieu topbar
|
||||
_applyViewMode(); // v2026.5.32 : appliquer la vue sauvegardée
|
||||
initAdminMenu(); // v5.0.0 : menu admin caché (5 clics sur titre)
|
||||
initSessionTimer(); // v5.0.9 : compteur de session EV (tick 1s)
|
||||
initDateCustomPicker(); // v2026.5.17 : faux input date avec jour
|
||||
@@ -325,26 +326,120 @@ function markSessionActivity() {
|
||||
}
|
||||
|
||||
// v4.2 : fetche l'utilisateur EasyVista connecté (via background.js) et
|
||||
// l'affiche dans la topbar. En cas d'échec ou si aucun nom n'est trouvé,
|
||||
// le badge reste caché.
|
||||
// l'affiche dans la topbar.
|
||||
// v2026.5.26 : en cas d'échec, affiche un rond gris "?" + retry 60s (max 10 essais).
|
||||
// v2026.5.34 : le badge est maintenant TOUJOURS visible (état "?" par défaut
|
||||
// dans le HTML). Cette fonction met à jour le contenu (initiales
|
||||
// quand succès, "?" quand échec). Logs abondants pour debug.
|
||||
//
|
||||
// État initial (HTML) : <button class="user-badge user-badge-unknown">?</button>
|
||||
// État succès : initiales calculées + couleur dérivée du nom
|
||||
// État échec : "?" + couleur grise (classe user-badge-unknown)
|
||||
//
|
||||
// Retry : 10 tentatives espacées de 60s (10 min max), arrêt au 1er succès.
|
||||
let _currentUserRetryCount = 0;
|
||||
const _CURRENT_USER_MAX_RETRIES = 10;
|
||||
const _CURRENT_USER_RETRY_DELAY_MS = 60 * 1000;
|
||||
|
||||
async function fetchAndShowCurrentUser() {
|
||||
const attemptId = _currentUserRetryCount + 1;
|
||||
console.log(`[currentUser] tentative ${attemptId}/${_CURRENT_USER_MAX_RETRIES + 1} de fetchCurrentUser`);
|
||||
|
||||
const badge = document.getElementById("user-badge");
|
||||
if (!badge) {
|
||||
// Fallback défensif : pas de badge dans le DOM ? On log et on abandonne.
|
||||
console.warn("[currentUser] badge DOM introuvable — abandon");
|
||||
return;
|
||||
}
|
||||
|
||||
let success = false;
|
||||
let errorReason = null;
|
||||
|
||||
try {
|
||||
const resp = await sendMessage({ type: "fetchCurrentUser" });
|
||||
if (!resp || !resp.ok || !resp.user) return;
|
||||
const badge = document.getElementById("user-badge");
|
||||
if (!badge) return;
|
||||
const fullName = resp.user.name || resp.user.login || null;
|
||||
if (!fullName) return;
|
||||
const initials = computeUserInitials(fullName);
|
||||
badge.textContent = initials;
|
||||
badge.title = fullName;
|
||||
// v4.2.3 : couleur unique dérivée du nom, dans la palette neutre du thème
|
||||
badge.style.setProperty("--user-badge-color", colorFromName(fullName));
|
||||
badge.classList.remove("hidden");
|
||||
state.currentUser = resp.user;
|
||||
console.log("[currentUser] réponse reçue :", resp ? JSON.stringify(resp).substring(0, 200) : "(null)");
|
||||
|
||||
if (!resp) {
|
||||
errorReason = "response_null";
|
||||
} else if (!resp.ok) {
|
||||
errorReason = resp.error || "ok_false";
|
||||
} else if (!resp.user) {
|
||||
errorReason = "user_null";
|
||||
} else {
|
||||
const fullName = resp.user.name || resp.user.login || null;
|
||||
if (!fullName) {
|
||||
errorReason = "name_empty";
|
||||
} else {
|
||||
// ✅ Succès : mise à jour du badge
|
||||
const initials = computeUserInitials(fullName);
|
||||
console.log(`[currentUser] SUCCÈS : "${fullName}" → initiales "${initials}"`);
|
||||
badge.textContent = initials;
|
||||
badge.title = fullName;
|
||||
badge.style.setProperty("--user-badge-color", colorFromName(fullName));
|
||||
badge.classList.remove("user-badge-unknown");
|
||||
// On retire aussi "hidden" au cas où (compat ancienne version)
|
||||
badge.classList.remove("hidden");
|
||||
state.currentUser = resp.user;
|
||||
success = true;
|
||||
_currentUserRetryCount = 0; // reset compteur au succès
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.warn("[currentUser] fetch failed:", err);
|
||||
errorReason = "exception: " + String(err);
|
||||
console.warn("[currentUser] exception durant sendMessage :", err);
|
||||
}
|
||||
|
||||
if (success) return;
|
||||
|
||||
// ❌ Échec : on laisse le badge en état "inconnu" (déjà le cas par défaut)
|
||||
// et on schedule un retry.
|
||||
console.warn(`[currentUser] échec (raison: ${errorReason}) — badge reste en état "?"`);
|
||||
|
||||
// Défense : s'assurer que le badge est bien en état inconnu (au cas où
|
||||
// une mise à jour partielle a eu lieu puis échoué).
|
||||
badge.textContent = "?";
|
||||
badge.title = "Utilisateur — cliquer pour accéder aux paramètres";
|
||||
badge.style.setProperty("--user-badge-color", "#6b7280");
|
||||
badge.classList.add("user-badge-unknown");
|
||||
badge.classList.remove("hidden");
|
||||
|
||||
// Schedule retry si pas trop d'essais
|
||||
if (_currentUserRetryCount < _CURRENT_USER_MAX_RETRIES) {
|
||||
_currentUserRetryCount++;
|
||||
console.log(`[currentUser] retry programmé : ${_currentUserRetryCount}/${_CURRENT_USER_MAX_RETRIES} dans ${_CURRENT_USER_RETRY_DELAY_MS / 1000}s`);
|
||||
setTimeout(() => {
|
||||
fetchAndShowCurrentUser();
|
||||
}, _CURRENT_USER_RETRY_DELAY_MS);
|
||||
} else {
|
||||
console.warn("[currentUser] max retries atteint, arrêt du retry automatique. Le badge reste cliquable (⚙ Paramètres accessible).");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* v2026.5.34 : déclenche un fetchAndShowCurrentUser() SI le user n'est pas
|
||||
* encore connu (badge en état "?"). Appelée après chaque succès de planning
|
||||
* pour profiter d'une session EV valide sans attendre le retry de 60s.
|
||||
*
|
||||
* Sans effet si :
|
||||
* - state.currentUser est déjà renseigné (pas besoin de re-fetcher)
|
||||
* - un retry est déjà en cours (évite les doublons)
|
||||
*
|
||||
* @param {string} reason - contexte pour les logs (ex: "after_load_success")
|
||||
*/
|
||||
function _maybeRetryFetchUser(reason) {
|
||||
if (state.currentUser && state.currentUser.name) {
|
||||
// User déjà connu, rien à faire
|
||||
return;
|
||||
}
|
||||
const badge = document.getElementById("user-badge");
|
||||
if (badge && !badge.classList.contains("user-badge-unknown")) {
|
||||
// Badge n'est pas en état inconnu → user probablement connu par un autre chemin
|
||||
return;
|
||||
}
|
||||
console.log(`[currentUser] relance opportuniste (raison: ${reason}) — user encore inconnu`);
|
||||
// Reset le compteur puisqu'on a un nouveau contexte (session fraîche)
|
||||
_currentUserRetryCount = 0;
|
||||
fetchAndShowCurrentUser();
|
||||
}
|
||||
|
||||
// v4.2.3 : calcule les initiales depuis un nom au format "Nom, Prénom" ou
|
||||
@@ -400,14 +495,20 @@ function toggleUserNamePopup() {
|
||||
hideUserNamePopup();
|
||||
return;
|
||||
}
|
||||
if (!state.currentUser || !state.currentUser.name) return;
|
||||
|
||||
// v2026.5.17 : afficher aussi le temps restant de la session (MM:SS) avec
|
||||
// une couleur qui dépend du seuil (vert/jaune/rouge).
|
||||
// v2026.5.26 : si user inconnu, afficher "Utilisateur inconnu" + retry + réglages
|
||||
popup.innerHTML = "";
|
||||
const nameEl = document.createElement("div");
|
||||
nameEl.className = "user-name-popup-name";
|
||||
nameEl.textContent = state.currentUser.name;
|
||||
if (state.currentUser && state.currentUser.name) {
|
||||
nameEl.textContent = state.currentUser.name;
|
||||
} else {
|
||||
nameEl.textContent = "Utilisateur inconnu";
|
||||
nameEl.style.fontStyle = "italic";
|
||||
nameEl.style.color = "var(--text-muted)";
|
||||
}
|
||||
popup.appendChild(nameEl);
|
||||
|
||||
const sessEl = document.createElement("div");
|
||||
@@ -416,6 +517,36 @@ function toggleUserNamePopup() {
|
||||
_renderUserPopupSessionLine(sessEl);
|
||||
popup.appendChild(sessEl);
|
||||
|
||||
// v2026.5.25 : bouton Paramètres (remplace les 5 clics sur le titre)
|
||||
// v2026.5.32 : bouton "Vue" pour basculer Vue classique ↔ Vue horizontale
|
||||
const viewBtn = document.createElement("button");
|
||||
viewBtn.type = "button";
|
||||
viewBtn.className = "user-name-popup-settings";
|
||||
const currentView = _getCurrentView();
|
||||
viewBtn.innerHTML = '<span class="settings-ico">⊞</span> Vue : '
|
||||
+ (currentView === "horizontal" ? "Horizontale" : "Classique");
|
||||
viewBtn.title = "Changer la disposition du planning";
|
||||
viewBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
hideUserNamePopup();
|
||||
_toggleView();
|
||||
});
|
||||
popup.appendChild(viewBtn);
|
||||
|
||||
const settingsBtn = document.createElement("button");
|
||||
settingsBtn.type = "button";
|
||||
settingsBtn.className = "user-name-popup-settings";
|
||||
settingsBtn.innerHTML = '<span class="settings-ico">⚙</span> Paramètres';
|
||||
settingsBtn.title = "Ouvrir les paramètres d'administration";
|
||||
settingsBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
hideUserNamePopup();
|
||||
if (typeof showAdminPanel === "function") {
|
||||
showAdminPanel();
|
||||
}
|
||||
});
|
||||
popup.appendChild(settingsBtn);
|
||||
|
||||
popup.classList.remove("hidden");
|
||||
badge.classList.add("open");
|
||||
// Positionne juste en dessous de la pastille
|
||||
@@ -889,20 +1020,49 @@ function initAppFooter() {
|
||||
document.body.appendChild(el);
|
||||
}
|
||||
|
||||
// v2026.5.32 : bascule entre Vue classique (cards) et Vue horizontale (rows)
|
||||
// Persisté dans localStorage (clé : "view_mode"). Défaut : "classic".
|
||||
const VIEW_MODE_KEY = "view_mode";
|
||||
|
||||
function _getCurrentView() {
|
||||
try {
|
||||
const v = localStorage.getItem(VIEW_MODE_KEY);
|
||||
return v === "horizontal" ? "horizontal" : "classic";
|
||||
} catch (e) {
|
||||
return "classic";
|
||||
}
|
||||
}
|
||||
|
||||
function _setCurrentView(mode) {
|
||||
try {
|
||||
localStorage.setItem(VIEW_MODE_KEY, mode === "horizontal" ? "horizontal" : "classic");
|
||||
} catch (e) {}
|
||||
_applyViewMode();
|
||||
}
|
||||
|
||||
function _toggleView() {
|
||||
const current = _getCurrentView();
|
||||
const next = current === "horizontal" ? "classic" : "horizontal";
|
||||
_setCurrentView(next);
|
||||
}
|
||||
|
||||
function _applyViewMode() {
|
||||
const mode = _getCurrentView();
|
||||
document.documentElement.classList.remove("view-classic", "view-horizontal");
|
||||
document.documentElement.classList.add("view-" + mode);
|
||||
}
|
||||
|
||||
// v5.0.0 : horloge HH:MM au milieu de la topbar. Mise à jour toutes les 30s
|
||||
// (les secondes ne sont pas affichées donc pas besoin d'un tick plus rapide).
|
||||
// v2026.5.27 : date courte "Jeudi 23.04.26" sur la même ligne que l'heure,
|
||||
// séparées par un gros point "•", même taille que l'heure.
|
||||
function initAppClock() {
|
||||
const el = document.getElementById("app-clock");
|
||||
if (!el) return;
|
||||
const dateEl = document.getElementById("app-clock-date");
|
||||
const timeEl = document.getElementById("app-clock-time");
|
||||
|
||||
// v2026.5.16 : format "Mardi 21 avril 2026"
|
||||
const JOURS = ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
|
||||
const MOIS = [
|
||||
"janvier", "février", "mars", "avril", "mai", "juin",
|
||||
"juillet", "août", "septembre", "octobre", "novembre", "décembre"
|
||||
];
|
||||
|
||||
let lastDateStr = "";
|
||||
const tick = () => {
|
||||
@@ -913,13 +1073,13 @@ function initAppClock() {
|
||||
if (timeEl) timeEl.textContent = timeStr;
|
||||
else el.textContent = timeStr; // fallback si ancien markup
|
||||
|
||||
// Date complète : actualisée seulement si elle a changé (évite reflow inutile)
|
||||
// Date courte : "Jeudi 23.04.26"
|
||||
if (dateEl) {
|
||||
const jour = JOURS[d.getDay()];
|
||||
const num = d.getDate();
|
||||
const mois = MOIS[d.getMonth()];
|
||||
const annee = d.getFullYear();
|
||||
const dateStr = `${jour} ${num} ${mois} ${annee}`;
|
||||
const dd = String(d.getDate()).padStart(2, "0");
|
||||
const mm = String(d.getMonth() + 1).padStart(2, "0");
|
||||
const yy = String(d.getFullYear()).slice(-2);
|
||||
const dateStr = `${jour} ${dd}.${mm}.${yy}`;
|
||||
if (dateStr !== lastDateStr) {
|
||||
dateEl.textContent = dateStr;
|
||||
lastDateStr = dateStr;
|
||||
@@ -1002,25 +1162,14 @@ function updateNowLine() {
|
||||
});
|
||||
}
|
||||
|
||||
// v5.0.0 : menu admin caché. 5 clics consécutifs sur le titre "Planification"
|
||||
// (avec max 2 secondes entre chaque clic) ouvrent le panneau admin.
|
||||
// v5.0.0 : menu admin caché via 5 clics sur le titre "Planification".
|
||||
// v2026.5.25 : SUPPRIMÉ — l'accès au panneau admin se fait désormais via le
|
||||
// bouton "⚙ Paramètres" du popup user-badge (clic sur les initiales).
|
||||
function initAdminMenu() {
|
||||
const title = document.getElementById("app-title");
|
||||
if (!title) return;
|
||||
let clicks = 0;
|
||||
let resetTimer = null;
|
||||
title.addEventListener("click", () => {
|
||||
clicks++;
|
||||
if (resetTimer) clearTimeout(resetTimer);
|
||||
resetTimer = setTimeout(() => { clicks = 0; }, 2000);
|
||||
if (clicks >= 5) {
|
||||
clicks = 0;
|
||||
clearTimeout(resetTimer);
|
||||
showAdminPanel();
|
||||
}
|
||||
});
|
||||
// Cursor pointer pour indiquer (discrètement) qu'il est cliquable
|
||||
title.style.cursor = "default";
|
||||
// Plus de handler de clic : les 5 clics n'ouvrent plus rien.
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
@@ -1063,6 +1212,10 @@ function initSessionTimer() {
|
||||
hideReconnectFailedBanner();
|
||||
markSessionActivity();
|
||||
showToast("Reconnecté", "Session EasyVista renouvelée");
|
||||
// v2026.5.34 : relancer fetchUser tout de suite (au lieu d'attendre
|
||||
// le retry de 60s) — la session vient d'être renouvelée, c'est le
|
||||
// meilleur moment pour récupérer le user.
|
||||
_maybeRetryFetchUser("session_reconnected");
|
||||
// Recharger le planning à la date courante sans perdre la position
|
||||
await loadForDate(state.currentDate);
|
||||
}
|
||||
@@ -1710,17 +1863,9 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
|
||||
|
||||
tableWrap.appendChild(table);
|
||||
|
||||
// Bouton Ajouter manuellement
|
||||
const addBtn = document.createElement("button");
|
||||
addBtn.type = "button";
|
||||
addBtn.className = "btn btn-secondary";
|
||||
addBtn.textContent = "+ Ajouter manuellement";
|
||||
addBtn.style.marginTop = "10px";
|
||||
addBtn.addEventListener("click", () => {
|
||||
rows.push({ id: "", name: "", included: true, days: [] });
|
||||
render();
|
||||
});
|
||||
tableWrap.appendChild(addBtn);
|
||||
// v2026.5.26 : bouton "+ Ajouter manuellement" retiré. La liste complète
|
||||
// des techniciens du groupe est chargée automatiquement depuis EasyVista
|
||||
// à l'ouverture du panel admin (voir auto-détection plus bas).
|
||||
|
||||
// Bouton Enregistrer
|
||||
const saveBtn = document.createElement("button");
|
||||
@@ -1746,6 +1891,36 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
|
||||
}
|
||||
|
||||
render();
|
||||
|
||||
// v2026.5.26 : auto-détection EasyVista à l'ouverture du panel admin.
|
||||
// On lance en arrière-plan (non-bloquant), et on merge avec cfg.team actuel
|
||||
// quand le résultat arrive. Les techs actuellement en cfg.team restent
|
||||
// cochés par défaut ; les nouveaux détectés du groupe apparaissent non-cochés.
|
||||
(async () => {
|
||||
try {
|
||||
const resp = await sendMessage({ type: "detectTeam" });
|
||||
if (resp && resp.ok && resp.members && resp.members.length) {
|
||||
for (const m of resp.members) {
|
||||
const existing = rows.find(r => r.id === m.id);
|
||||
if (existing) {
|
||||
if (m.name && !m.name.startsWith("?") && existing.name.startsWith("?")) {
|
||||
existing.name = m.name;
|
||||
}
|
||||
} else {
|
||||
rows.push({
|
||||
id: m.id,
|
||||
name: m.name || "? (" + m.id + ")",
|
||||
included: !!m.alreadyInTeam,
|
||||
days: []
|
||||
});
|
||||
}
|
||||
}
|
||||
render();
|
||||
}
|
||||
} catch (err) {
|
||||
console.warn("[admin auto-detect]", err);
|
||||
}
|
||||
})();
|
||||
}
|
||||
|
||||
// v5.0.0 : sections suivantes (placeholders, à enrichir v5.0.1+)
|
||||
@@ -2577,6 +2752,11 @@ async function loadForDate(isoDate, opts = {}) {
|
||||
console.log(`[load] merged : ${merged.techs.length} techs, ${totalIv} iv totales, ${totalInterIv} interventions réelles, ${notFetched} sans fiche`);
|
||||
console.log(`[load] needFetch = ${needFetch} | doStatusRefresh = ${!!opts.doStatusRefresh} | forceRefetch = ${!!opts.forceRefetch} | aborted = ${isRefreshAborted(myToken)}`);
|
||||
|
||||
// v2026.5.34 : si le user n'est pas encore connu (badge "?"), on tente
|
||||
// un fetch immédiatement puisque le planning a réussi = session valide.
|
||||
// Évite d'attendre le retry de 60s quand on vient juste de se reconnecter.
|
||||
_maybeRetryFetchUser("after_load_success");
|
||||
|
||||
// v4.3.2 : avant de lancer le fetch des fiches (lourd, ~460 KB chacune),
|
||||
// on fait d'abord un batch xhr2 (léger, ~2-5 KB chacun) pour récupérer
|
||||
// les vraies infos contact/lieu de toutes les interventions en parallèle.
|
||||
@@ -2839,6 +3019,16 @@ function actionNodeToIntervention(node) {
|
||||
reservationCreator: reservationCreator, // "Nom, Prénom" du coordinateur
|
||||
cssClass: cssClass,
|
||||
isPompier: /pompier/i.test(label) || /pompier/i.test(actionType),
|
||||
// v2026.5.27 : catégorie d'absence pour classification visuelle
|
||||
// "maladie" | "conge" | "pompier" | null
|
||||
absenceCategory: (function() {
|
||||
if (effectiveType !== "AL-Absence") return null;
|
||||
const lblTest = reservationMatch ? reservationMatch[1].trim() : label;
|
||||
if (/pompier/i.test(lblTest) || /pompier/i.test(actionType)) return "pompier";
|
||||
if (/maladie/i.test(lblTest)) return "maladie";
|
||||
if (/cong[ée]s?/i.test(lblTest)) return "conge";
|
||||
return null;
|
||||
})(),
|
||||
ref: ref,
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
@@ -4517,9 +4707,30 @@ function buildCard(tech, isoDate) {
|
||||
|
||||
const isPompier = tech.interventions.some(iv => iv.isPompier);
|
||||
const isAbsent = isTechAbsent(tech, isoDate);
|
||||
// v2026.5.30 : détecter aussi les absences récurrentes hardcodées (Pillonel vendredi)
|
||||
// pour leur appliquer le code couleur cyan (comme Congé) au lieu du rouge Pompier.
|
||||
const isRecurring = isPillonelAbsentFriday(tech, isoDate);
|
||||
|
||||
if (isPompier) card.classList.add("is-pompier");
|
||||
if (isAbsent) card.classList.add("is-absent");
|
||||
|
||||
// v2026.5.27 : déterminer la catégorie d'absence principale (maladie/conge/pompier)
|
||||
// pour appliquer le bon code couleur sur la carte entière.
|
||||
// v2026.5.30 : les absences récurrentes hardcodées prennent la catégorie
|
||||
// "recurring" (même cyan que Congé, texte distinct).
|
||||
let absenceCategory = null; // "maladie" | "conge" | "pompier" | "recurring" | null
|
||||
if (isRecurring) {
|
||||
absenceCategory = "recurring";
|
||||
} else if (isPompier) {
|
||||
absenceCategory = "pompier";
|
||||
} else if (isAbsent) {
|
||||
const catBlock = tech.interventions.find(iv => iv.type === "AL-Absence" && iv.absenceCategory);
|
||||
if (catBlock) absenceCategory = catBlock.absenceCategory;
|
||||
}
|
||||
if (absenceCategory) {
|
||||
card.classList.add("absence-cat-" + absenceCategory);
|
||||
}
|
||||
|
||||
const realInterventions = tech.interventions.filter(iv =>
|
||||
iv.type !== "AL-Absence" && !iv.isPompier
|
||||
);
|
||||
@@ -4535,23 +4746,57 @@ function buildCard(tech, isoDate) {
|
||||
// --- Header ---
|
||||
const header = document.createElement("div");
|
||||
header.className = "card-header";
|
||||
|
||||
// v2026.5.27 : pastille colorée supprimée (v2026.5.28) — la barre gauche de la
|
||||
// carte + le badge à droite suffisent pour indiquer la catégorie d'absence.
|
||||
|
||||
const nameEl = document.createElement("div");
|
||||
nameEl.className = "card-tech-name";
|
||||
nameEl.textContent = tech.name;
|
||||
header.appendChild(nameEl);
|
||||
|
||||
if (isPompier || isAbsent) {
|
||||
if (isPompier || isAbsent || isRecurring) {
|
||||
const badge = document.createElement("div");
|
||||
badge.className = "card-tech-badge";
|
||||
if (isPompier) {
|
||||
if (isRecurring) {
|
||||
// v2026.5.30 : absence récurrente (Pillonel vendredi) → badge "Absent" cyan
|
||||
badge.classList.add("badge-recurring");
|
||||
badge.textContent = "Absent";
|
||||
} else if (isPompier) {
|
||||
badge.classList.add("badge-pompier");
|
||||
badge.textContent = "Pompier";
|
||||
} else if (absenceCategory === "maladie") {
|
||||
badge.classList.add("badge-maladie");
|
||||
badge.textContent = "Maladie/Accident";
|
||||
} else if (absenceCategory === "conge") {
|
||||
// Déterminer singulier/pluriel selon la durée
|
||||
const ab = absenceBlocks.find(a => a.absenceCategory === "conge") || absenceBlocks[0];
|
||||
const multiDay = ab && ab.startDate && ab.endDate && ab.startDate !== ab.endDate;
|
||||
badge.classList.add("badge-conge");
|
||||
badge.textContent = multiDay ? "Congés" : "Congé";
|
||||
} else {
|
||||
badge.classList.add("badge-absent");
|
||||
badge.textContent = "Absent";
|
||||
}
|
||||
header.appendChild(badge);
|
||||
}
|
||||
|
||||
// v2026.5.32 : stats rapides pour la vue horizontale (cachées en classique)
|
||||
const rowStats = document.createElement("div");
|
||||
rowStats.className = "tech-row-stats";
|
||||
const totalInterv = realInterventions.length;
|
||||
const pill1 = document.createElement("span");
|
||||
pill1.className = "stat-pill";
|
||||
pill1.textContent = totalInterv + " interv.";
|
||||
rowStats.appendChild(pill1);
|
||||
if (morning > 0 || afternoon > 0) {
|
||||
const pill2 = document.createElement("span");
|
||||
pill2.className = "stat-pill";
|
||||
pill2.textContent = morning + "m · " + afternoon + "a";
|
||||
rowStats.appendChild(pill2);
|
||||
}
|
||||
header.appendChild(rowStats);
|
||||
|
||||
card.appendChild(header);
|
||||
|
||||
// --- Body ---
|
||||
@@ -4572,6 +4817,9 @@ function buildCard(tech, isoDate) {
|
||||
} else if (isAbsent && absenceBlocks.length) {
|
||||
const note = document.createElement("div");
|
||||
note.className = "card-status-note absent";
|
||||
if (absenceCategory) {
|
||||
note.classList.add("absent-" + absenceCategory);
|
||||
}
|
||||
const ab = absenceBlocks[0];
|
||||
if (ab.startDate && ab.endDate && ab.startDate !== ab.endDate) {
|
||||
note.textContent = `Absent du ${ab.startDate.substring(0, 5)} au ${ab.endDate.substring(0, 5)}`;
|
||||
@@ -7419,6 +7667,11 @@ function _attachPopupDragHandler(popup, dragbar) {
|
||||
startLeft = parseFloat(popup.style.left) || 0;
|
||||
startTop = parseFloat(popup.style.top) || 0;
|
||||
popup.classList.add("dragging");
|
||||
// v2026.5.19 : flag global pour que showTooltip ignore les mouseenter
|
||||
// pendant le drag. Ajout d'une classe sur <body> qui désactive les
|
||||
// pointer-events sur les cartes.
|
||||
state._popupDragging = true;
|
||||
document.body.classList.add("popup-dragging");
|
||||
document.addEventListener("mousemove", onMouseMove);
|
||||
document.addEventListener("mouseup", onMouseUp);
|
||||
});
|
||||
@@ -7624,10 +7877,10 @@ function bindTooltipInteractions() {
|
||||
}
|
||||
});
|
||||
|
||||
// Double-Ctrl : v4.3.0
|
||||
// - Si 0 popup épinglé ET un tooltip live visible : épingler
|
||||
// - Si EXACTEMENT 1 popup épinglé ET souris pas dessus : le fermer
|
||||
// - Si 2+ popups épinglés : ne fait rien (ambigu, user doit utiliser Échap)
|
||||
// Double-Ctrl : v2026.5.21 — toggle sur l'intervention survolée
|
||||
// - Si tooltip visible et iv pas encore épinglée pour cette date : épingle
|
||||
// - Si tooltip visible et iv déjà épinglée pour cette date : désépingle
|
||||
// - Sinon (pas de tooltip visible) : rien
|
||||
// On détecte 2 keydown Control dans une fenêtre de 400 ms.
|
||||
let lastCtrlTs = 0;
|
||||
document.addEventListener("keydown", (e) => {
|
||||
@@ -7636,17 +7889,36 @@ function bindTooltipInteractions() {
|
||||
const now = performance.now();
|
||||
if (now - lastCtrlTs < 400) {
|
||||
lastCtrlTs = 0;
|
||||
if (pinnedPopups.length === 0) {
|
||||
// Aucun popup épinglé : épingler le tooltip live s'il y en a un
|
||||
if (state.currentTooltipIv) pinTooltip();
|
||||
} else if (pinnedPopups.length === 1) {
|
||||
// 1 popup épinglé : le fermer si la souris n'est pas dessus
|
||||
const p = pinnedPopups[0];
|
||||
if (!p.el.matches(":hover")) {
|
||||
_closePinnedPopup(p.el);
|
||||
const iv = state.currentTooltipIv;
|
||||
if (!iv) return;
|
||||
const pinState = _getPinStateForIv(iv);
|
||||
if (pinState.isPinned && pinState.popup) {
|
||||
// Déjà épinglée : désépingle (ferme le popup correspondant)
|
||||
const idx = pinnedPopups.findIndex(p => p.el === pinState.popup);
|
||||
if (idx >= 0) pinnedPopups.splice(idx, 1);
|
||||
// Fermer aussi la pastille dock si elle existe
|
||||
if (pinState.popup._linkedPill) {
|
||||
try { pinState.popup._linkedPill.remove(); } catch (e) {}
|
||||
}
|
||||
try { pinState.popup.remove(); } catch (e) {}
|
||||
// Nettoyer dock si vide
|
||||
const dock = document.getElementById("pinned-popups-dock");
|
||||
if (dock && dock.querySelectorAll(".pinned-popup-dock-pill").length === 0) {
|
||||
dock.classList.remove("visible");
|
||||
const closeAllBtn = document.getElementById("pinned-popups-close-all");
|
||||
if (closeAllBtn) closeAllBtn.remove();
|
||||
} else {
|
||||
_ensureDockCloseAllBtn();
|
||||
}
|
||||
// Mettre à jour le tooltip hover (📍 → 📌)
|
||||
const tip = tooltipEl();
|
||||
if (tip && tip.classList.contains("visible")) {
|
||||
tip.innerHTML = buildTooltipHTML(iv);
|
||||
}
|
||||
} else {
|
||||
// Pas encore épinglée : épingle
|
||||
pinTooltip();
|
||||
}
|
||||
// 2+ popups : rien faire (Échap pour tout fermer)
|
||||
} else {
|
||||
lastCtrlTs = now;
|
||||
}
|
||||
@@ -7660,8 +7932,12 @@ function bindTooltipInteractions() {
|
||||
e.preventDefault();
|
||||
const action = btn.dataset.action;
|
||||
if (action === "pin") {
|
||||
// v4.3.0 : toujours épingler (le tooltip live clone son contenu en popup
|
||||
// détaché). Pour désépingler, l'user utilise × sur le popup, ou Échap.
|
||||
// v2026.5.22 : clic sur 📌/📍 dans le tooltip hover = TOUJOURS réépingler
|
||||
// à la position actuelle. Si un popup existe déjà pour cette iv+date,
|
||||
// il est supprimé avant d'en créer un nouveau à côté de la carte survolée.
|
||||
// (La suppression de l'ancien est faite dans pinTooltip() qui gère
|
||||
// l'unicité actionId+date — v2026.5.21.)
|
||||
// Pour désépingler : bouton 📍 dans la topbar du popup, double-Ctrl, ou Échap.
|
||||
if (state.currentTooltipIv) {
|
||||
pinTooltip();
|
||||
}
|
||||
@@ -7804,12 +8080,25 @@ function buildTooltipHTML(iv) {
|
||||
rows.push(`<dt></dt><dd style="color:var(--text-faint);font-size:11px">Cliquer pour ouvrir la fiche</dd>`);
|
||||
}
|
||||
|
||||
// v2026.5.21 : icône épingle adaptative
|
||||
// 📌 (épingle couchée) = pas encore épinglée, clic pour épingler
|
||||
// 📍 (épingle plantée, rouge) = déjà épinglée pour cette (ref + date)
|
||||
// — clic pour désépingler. NB : le popup a sa propre topbar avec un
|
||||
// bouton 📍 explicite ; celui-ci dans le tooltip hover sert surtout
|
||||
// à montrer visuellement l'état à l'user au survol.
|
||||
const _pinState = _getPinStateForIv(iv);
|
||||
const _pinIcon = _pinState.isPinned ? "📍" : "📌";
|
||||
const _pinTitle = _pinState.isPinned
|
||||
? "Cette intervention est déjà épinglée pour ce jour. Cliquer pour désépingler."
|
||||
: "Épingler la bulle (ou double-Ctrl). Cliquer à nouveau pour libérer.";
|
||||
const _pinClass = _pinState.isPinned ? " tooltip-pinbtn-active" : "";
|
||||
|
||||
if (rows.length === 0) {
|
||||
return `<div class="tooltip-actions">
|
||||
<div class="tooltip-actionbtn" data-action="reload" title="Recharger uniquement cette intervention">
|
||||
<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M2 8a6 6 0 1 0 1.76-4.24M2 3v3h3" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="tooltip-actionbtn tooltip-pinbtn" data-action="pin" title="Épingler la bulle (ou double-Ctrl). Cliquer à nouveau pour libérer.">📌</div>
|
||||
<div class="tooltip-actionbtn tooltip-pinbtn${_pinClass}" data-action="pin" title="${_pinTitle}">${_pinIcon}</div>
|
||||
</div><dl><dt>Info</dt><dd>Aucun détail disponible</dd></dl>`;
|
||||
}
|
||||
// v4.1.13/14 : boutons d'action en haut à droite (recharger + épingler)
|
||||
@@ -7817,10 +8106,30 @@ function buildTooltipHTML(iv) {
|
||||
<div class="tooltip-actionbtn" data-action="reload" title="Recharger uniquement cette intervention">
|
||||
<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M2 8a6 6 0 1 0 1.76-4.24M2 3v3h3" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="tooltip-actionbtn tooltip-pinbtn" data-action="pin" title="Épingler la bulle (ou double-Ctrl). Cliquer à nouveau pour libérer.">📌</div>
|
||||
<div class="tooltip-actionbtn tooltip-pinbtn${_pinClass}" data-action="pin" title="${_pinTitle}">${_pinIcon}</div>
|
||||
</div><dl>${rows.join("")}</dl>`;
|
||||
}
|
||||
|
||||
/**
|
||||
* v2026.5.21 : retourne l'état d'épinglage pour une intervention donnée
|
||||
* (pour la date actuellement affichée). Utilisé pour afficher 📌 vs 📍
|
||||
* dans le tooltip hover.
|
||||
*/
|
||||
function _getPinStateForIv(iv) {
|
||||
if (!iv || !iv.actionId) return { isPinned: false };
|
||||
const date = state.currentDate || "";
|
||||
const key = iv.actionId + "|" + date;
|
||||
for (const p of pinnedPopups) {
|
||||
if (!p || !p.el) continue;
|
||||
const aid = p.el.dataset.actionId || "";
|
||||
const d = p.el.dataset.originDate || "";
|
||||
if (aid + "|" + d === key) {
|
||||
return { isPinned: true, popup: p.el };
|
||||
}
|
||||
}
|
||||
return { isPinned: false };
|
||||
}
|
||||
|
||||
/**
|
||||
* Met en forme un texte d'action EasyVista en ajoutant des retours à la ligne
|
||||
* avant chaque étiquette connue ("Date :", "Lieu :", "Contact :", etc.).
|
||||
|
||||
Reference in New Issue
Block a user