Compare commits

...

4 Commits

Author SHA1 Message Date
FroSteel c74d52c40c Version 2026.5.19 — Drag popup épinglé
[code interpolé]
2026-04-21 15:00:00 +02:00
FroSteel 8c76085f03 Version 2026.5.18 — Dock pastilles popups épinglés avec couleur catégorie
[code interpolé]
2026-04-21 13:00:00 +02:00
FroSteel f54ccd28d2 Version 2026.5.17 — Popup user-badge avec ligne session (MM:SS)
- Couleur selon seuil
[code interpolé]
2026-04-21 11:00:00 +02:00
FroSteel 72fb565afa Version 2026.5.16 — Passage au versionning par année (YYYY.M.PATCH)
- Format : YYYY.M.PATCH (2026.5.16 succède à 5.0.12)
- Bump du PATCH à chaque livraison
- L'année indique immédiatement la fraîcheur de l'extension
[code interpolé v5.0.12 → v2026.5.22]
2026-04-21 09:00:00 +02:00
5 changed files with 692 additions and 90 deletions
+103 -28
View File
@@ -157,6 +157,16 @@ async function fetchXhr2(origin, phpsessid, actionId) {
async function fetchFicheHtml(origin, phpsessid, formLink) { async function fetchFicheHtml(origin, phpsessid, formLink) {
const url = `${origin}/index.php?${formLink}&PHPSESSID=${encodeURIComponent(phpsessid)}`; const url = `${origin}/index.php?${formLink}&PHPSESSID=${encodeURIComponent(phpsessid)}`;
console.log("[bg] fetchFicheHtml →", url.substring(0, 120)); console.log("[bg] fetchFicheHtml →", url.substring(0, 120));
// v2026.5.16 : juste après une reconnexion SSO, EasyVista retourne parfois
// une page intermédiaire tronquée (~8 Ko au lieu de ~250 Ko), le temps que
// les cookies SSO/Kerberos se propagent. On fait jusqu'à 3 tentatives avec
// 1.5s entre chaque si on détecte une taille suspecte.
const MAX_RETRIES = 3;
const RETRY_DELAY_MS = 1500;
const MIN_VALID_SIZE = 20000; // < 20 Ko = probablement page intermédiaire
for (let attempt = 1; attempt <= MAX_RETRIES; attempt++) {
const r = await evFetch(url, origin); const r = await evFetch(url, origin);
if (!r.ok) { if (!r.ok) {
const err = new Error("HTTP " + r.status); const err = new Error("HTTP " + r.status);
@@ -165,11 +175,26 @@ async function fetchFicheHtml(origin, phpsessid, formLink) {
throw err; throw err;
} }
const html = await r.text(); const html = await r.text();
console.log("[bg] fiche status =", r.status, "| taille =", html.length); console.log(`[bg] fiche status = ${r.status} | taille = ${html.length}${attempt > 1 ? ` (tentative ${attempt}/${MAX_RETRIES})` : ""}`);
// Si réponse clairement une redirection courte → login expiré, inutile de retry
if (html.length < 500) { if (html.length < 500) {
console.warn("[bg] ⚠ fiche très courte, contenu =", JSON.stringify(html)); console.warn("[bg] ⚠ fiche très courte, contenu =", JSON.stringify(html));
}
return html; return html;
}
// Si taille suspecte (< 20 Ko), probable page intermédiaire SSO : retry
if (html.length < MIN_VALID_SIZE && attempt < MAX_RETRIES) {
console.warn(`[bg] ⚠ fiche anormalement petite (${html.length} octets), retry dans ${RETRY_DELAY_MS} ms...`);
await new Promise(res => setTimeout(res, RETRY_DELAY_MS));
continue;
}
// Sinon : on retourne ce qu'on a
return html;
}
// Ne devrait pas arriver (la boucle fait return avant)
throw new Error("fetchFicheHtml: max retries reached");
} }
// v4.1.7 : API timeline EasyVista. Renvoie le JSON des actions d'une fiche, // v4.1.7 : API timeline EasyVista. Renvoie le JSON des actions d'une fiche,
@@ -375,6 +400,67 @@ function originForContext(context) {
: "https://itsma.vd.ch"; : "https://itsma.vd.ch";
} }
/**
* v2026.5.16 : surveille un onglet ouvert pour détecter si le Windows SSO
* a échoué et rediriger vers la bonne page.
*
* Quand la session portail Canton est expirée, EasyVista redirige vers
* https://portail.etat-de-vaud.ch/iamlogin/?spEntityID=...
* (page de login manuel moche). On préfère rediriger vers
* https://portail.etat-de-vaud.ch/iam/accueil/
* qui déclenche le Windows Kerberos SSO automatique.
*
* @param {number} tabId - ID de l'onglet à surveiller
*/
function watchReconnectTabForIamLogin(tabId) {
let redirected = false;
const timeoutMs = 60000; // surveille max 60s
const listener = (updatedTabId, changeInfo, tab) => {
if (updatedTabId !== tabId) return;
if (redirected) return;
const url = changeInfo.url || (tab && tab.url) || "";
if (!url) return;
// Détecter la page de login manuel
// Patterns : portail.etat-de-vaud.ch/iamlogin/ ou www.portail.vd.ch/iamlogin/
if (/\/iamlogin\//i.test(url) && /portail\./i.test(url)) {
redirected = true;
// Choisir le domaine de redirection :
// - si on voit portail.etat-de-vaud.ch → rester sur interne
// - si on voit www.portail.vd.ch → rester sur externe
let targetUrl;
if (/portail\.etat-de-vaud\.ch/i.test(url)) {
targetUrl = "https://portail.etat-de-vaud.ch/iam/accueil/";
} else {
targetUrl = "https://www.portail.vd.ch/iam/accueil/";
}
console.log(`[bg] watchReconnectTab : iamlogin détecté, redirection vers ${targetUrl}`);
chrome.tabs.update(tabId, { url: targetUrl }).catch(e => {
console.warn("[bg] watchReconnectTab : update failed", e);
});
}
};
chrome.tabs.onUpdated.addListener(listener);
// Stop la surveillance après 60s pour ne pas accumuler des listeners morts
setTimeout(() => {
try {
chrome.tabs.onUpdated.removeListener(listener);
} catch (e) {}
}, timeoutMs);
// Si l'onglet est fermé, stop aussi
const closeListener = (closedTabId) => {
if (closedTabId === tabId) {
try { chrome.tabs.onUpdated.removeListener(listener); } catch (e) {}
try { chrome.tabs.onRemoved.removeListener(closeListener); } catch (e) {}
}
};
chrome.tabs.onRemoved.addListener(closeListener);
}
// ============================================================================ // ============================================================================
// v4.2 : récupération de l'utilisateur connecté // v4.2 : récupération de l'utilisateur connecté
// ============================================================================ // ============================================================================
@@ -644,33 +730,18 @@ async function submitDouchette(origin, phpsessid, opts) {
async function deletePlanningItem(origin, phpsessid, actionId, kind) { async function deletePlanningItem(origin, phpsessid, actionId, kind) {
if (!actionId) throw new Error("actionId manquant"); if (!actionId) throw new Error("actionId manquant");
// v5.0.1 : plusieurs function_name à tester dans l'ordre (du plus probable // v5.0.14 : confirmé par capture Network réelle — EasyVista utilise
// au moins probable). Le premier qui renvoie 200 ET non-login est considéré OK. // "Planning_delete_absence" pour TOUS les types d'entrée planning (absences,
const fnNames = kind === "reservation" // réservations, événements, etc.). Réponse XML : <Planning_delete_absence>true</...>
? [ // On met donc ce nom en PREMIER pour tout, et on garde les autres en fallback.
const fnNames = [
"Planning_delete_absence", // ← le seul qui marche vraiment côté EV
// Fallbacks historiques (au cas où EV change un jour) :
"Planning_delete_reservation", "Planning_delete_reservation",
"delete_reservation",
"fc_delete_reservation",
"delete_act_reservation",
"delete_planning_reservation",
"remove_reservation",
// v5.0.2 : réservations sont parfois traitées comme absences côté API
"Planning_delete_absence",
"delete_absence", "delete_absence",
"fc_delete_absence" "delete_reservation",
] "fc_delete_absence",
: [ "fc_delete_reservation"
// v5.0.2 : élargir la liste, on a essayé 3 sans succès. Les variantes
// plausibles vues dans les API EasyVista :
"Planning_delete_absence", // le plus "officiel"
"delete_absence", // le nom JS dans le onclick
"fc_delete_absence", // pattern fc_*
"delete_act_absence", // parfois "act_" dans les noms
"Planning_delete_holiday", // en anglais
"delete_holiday",
"fc_delete_holiday",
"delete_planning_absence", // variation complète
"remove_absence"
]; ];
let lastErr = null; let lastErr = null;
@@ -684,7 +755,11 @@ async function deletePlanningItem(origin, phpsessid, actionId, kind) {
console.log(`[bg] deletePlanningItem → tente function_name=${fn}`, url.substring(0, 180)); console.log(`[bg] deletePlanningItem → tente function_name=${fn}`, url.substring(0, 180));
try { try {
const r = await fetch(url, { method: "GET", credentials: "include" }); // v5.0.13 : utiliser evFetch() au lieu de fetch() brut pour que les
// headers Referer + X-Requested-With soient envoyés — sinon EV renvoie
// un <script> de redirection CSRF qui ne ressemble pas à une erreur et
// notre heuristique le prenait à tort pour un succès.
const r = await evFetch(url, origin, { method: "GET" });
const body = await r.text(); const body = await r.text();
console.log(`[bg] status=${r.status} | body (200 premiers chars) : ${(body || "").substring(0, 200)}`); console.log(`[bg] status=${r.status} | body (200 premiers chars) : ${(body || "").substring(0, 200)}`);
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"manifest_version": 3, "manifest_version": 3,
"name": "Planification", "name": "Planification",
"version": "5.0.12", "version": "2026.5.19",
"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.", "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": { "browser_specific_settings": {
"gecko": { "gecko": {
+81 -6
View File
@@ -320,8 +320,57 @@ html, body {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
flex-wrap: nowrap;
} }
/* v2026.5.17 : faux input date custom avec nom du jour */
.date-custom-wrapper {
position: relative;
display: inline-flex;
align-items: center;
}
.date-custom {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 5px 10px 5px 12px;
border: 1px solid var(--border);
border-radius: 6px;
background: var(--bg-muted);
color: var(--text);
font-family: inherit;
font-size: 13px;
font-weight: 500;
cursor: pointer;
white-space: nowrap;
user-select: none;
transition: border-color 0.15s, background 0.15s;
}
.date-custom:hover {
border-color: var(--border-strong);
background: var(--bg-hover);
}
.date-custom:focus {
outline: 2px solid var(--accent);
outline-offset: -1px;
}
.date-custom-icon {
font-size: 13px;
opacity: 0.7;
}
.date-input-hidden {
position: absolute;
top: 100%;
left: 0;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
/* v2026.5.17 : masquer l'ancien date-picker-day s'il traîne (compat) */
.date-picker-day { display: none; }
.btn-nav { .btn-nav {
padding: 6px 10px; padding: 6px 10px;
font-size: 13px; font-size: 13px;
@@ -689,12 +738,9 @@ html, body {
.timeline-slot.status-resolved { background: var(--c-resolved); } .timeline-slot.status-resolved { background: var(--c-resolved); }
.timeline-slot.kind-absence { .timeline-slot.kind-absence {
background: repeating-linear-gradient( /* v5.0.15 : uni gris-noir au lieu de rayé, plus lisible */
45deg, background: #2a2f36;
var(--text-faint) 0 6px, border-right: 1px solid var(--bg-elevated);
var(--bg-muted) 6px 12px
);
opacity: 0.6;
} }
.timeline-slot:hover, .timeline-slot:hover,
@@ -969,6 +1015,12 @@ html, body {
opacity: 0; opacity: 0;
transition: opacity 0.1s, background 0.1s, color 0.1s; transition: opacity 0.1s, background 0.1s, color 0.1s;
font-family: inherit; font-family: inherit;
/* v2026.5.17 : figer largeur/hauteur pour que le changement 📋 → ✓ pendant
la copie ne fasse pas bouger le titre centré dans la grid */
min-width: 28px;
min-height: 22px;
text-align: center;
box-sizing: border-box;
} }
.intervention-v2:hover .intervention-copy { opacity: 1; } .intervention-v2:hover .intervention-copy { opacity: 1; }
.intervention-copy:hover { .intervention-copy:hover {
@@ -1117,6 +1169,26 @@ html, body {
color: var(--c-reservation); color: var(--c-reservation);
font-family: var(--font); font-family: var(--font);
letter-spacing: 0.02em; letter-spacing: 0.02em;
/* v5.0.15 : étendre le titre sur toute la largeur de la carte pour le
vrai centrage (sinon il n'est centré que dans sa colonne grid) */
grid-column: 1 / -1;
text-align: center;
padding-left: 62px; /* compense la colonne time (58px + gap) */
padding-right: 0;
}
/* v5.0.15 : absence partielle (demi-journée) affichée comme une row */
.iv-ref-header.is-absence-title {
color: var(--c-absence, #a0a8b2);
font-family: var(--font);
letter-spacing: 0.02em;
grid-column: 1 / -1;
text-align: center;
padding-left: 62px;
padding-right: 0;
}
.intervention-v2.color-absence .intervention-dot {
background: var(--c-absence, #2a2f36);
} }
.iv-reservation-par { .iv-reservation-par {
font-size: 13px; font-size: 13px;
@@ -1920,6 +1992,9 @@ body.modal-open {
/* ───────────────────────────────────────────────────────────────────────── /* ─────────────────────────────────────────────────────────────────────────
v5.0.0 : horloge au milieu de la topbar (HH:MM, pas de secondes) 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) */
.app-clock { .app-clock {
position: absolute; position: absolute;
left: 50%; left: 50%;
+8 -1
View File
@@ -16,7 +16,14 @@
<h1 id="app-title">Planification</h1> <h1 id="app-title">Planification</h1>
<div class="date-nav"> <div class="date-nav">
<button id="nav-prev" class="btn btn-nav" title="Jour précédent" aria-label="Jour précédent"></button> <button id="nav-prev" class="btn btn-nav" title="Jour précédent" aria-label="Jour précédent"></button>
<input type="date" id="date-picker" class="date-input"> <!-- v2026.5.17 : input date custom qui affiche "Vendredi 24.04.2026" -->
<div class="date-custom-wrapper">
<div id="date-custom" class="date-custom" role="button" tabindex="0" title="Choisir une date">
<span id="date-custom-label"></span>
<span class="date-custom-icon">📅</span>
</div>
<input type="date" id="date-picker" class="date-input-hidden">
</div>
<button id="nav-next" class="btn btn-nav" title="Jour suivant" aria-label="Jour suivant"></button> <button id="nav-next" class="btn btn-nav" title="Jour suivant" aria-label="Jour suivant"></button>
<button id="nav-today" class="btn btn-today" title="Aujourd'hui">Auj.</button> <button id="nav-today" class="btn btn-today" title="Aujourd'hui">Auj.</button>
</div> </div>
+478 -33
View File
@@ -131,6 +131,7 @@ function deriveShortTitle(iv) {
function deriveColorKey(iv) { function deriveColorKey(iv) {
if (iv.type === "AL-Reservation") return "reservation"; if (iv.type === "AL-Reservation") return "reservation";
if (iv.type === "AL-Absence") return "absence"; // v5.0.15 : couleur noire/gris foncé
if (iv.ref && /^I\d/.test(iv.ref)) return "incident"; if (iv.ref && /^I\d/.test(iv.ref)) return "incident";
if (isRollOut(iv)) return "rollout"; if (isRollOut(iv)) return "rollout";
if (isRecupAction(iv)) return "recup"; if (isRecupAction(iv)) return "recup";
@@ -241,10 +242,12 @@ async function init() {
initAppClock(); // v5.0.0 : horloge HH:MM au milieu topbar initAppClock(); // v5.0.0 : horloge HH:MM au milieu topbar
initAdminMenu(); // v5.0.0 : menu admin caché (5 clics sur titre) initAdminMenu(); // v5.0.0 : menu admin caché (5 clics sur titre)
initSessionTimer(); // v5.0.9 : compteur de session EV (tick 1s) initSessionTimer(); // v5.0.9 : compteur de session EV (tick 1s)
initDateCustomPicker(); // v2026.5.17 : faux input date avec jour
// Initialiser la date = aujourd'hui // Initialiser la date = aujourd'hui
state.currentDate = todayISO(); state.currentDate = todayISO();
document.getElementById("date-picker").value = state.currentDate; document.getElementById("date-picker").value = state.currentDate;
updateDatePickerDayLabel(state.currentDate); // v2026.5.16 : label "Mardi"
// v5.0.11 : détecter le contexte réseau en arrière-plan (non bloquant) // v5.0.11 : détecter le contexte réseau en arrière-plan (non bloquant)
detectNetworkContextAsync(); detectNetworkContextAsync();
@@ -398,7 +401,21 @@ function toggleUserNamePopup() {
return; return;
} }
if (!state.currentUser || !state.currentUser.name) return; if (!state.currentUser || !state.currentUser.name) return;
popup.textContent = state.currentUser.name;
// v2026.5.17 : afficher aussi le temps restant de la session (MM:SS) avec
// une couleur qui dépend du seuil (vert/jaune/rouge).
popup.innerHTML = "";
const nameEl = document.createElement("div");
nameEl.className = "user-name-popup-name";
nameEl.textContent = state.currentUser.name;
popup.appendChild(nameEl);
const sessEl = document.createElement("div");
sessEl.className = "user-name-popup-session";
sessEl.id = "user-name-popup-session";
_renderUserPopupSessionLine(sessEl);
popup.appendChild(sessEl);
popup.classList.remove("hidden"); popup.classList.remove("hidden");
badge.classList.add("open"); badge.classList.add("open");
// Positionne juste en dessous de la pastille // Positionne juste en dessous de la pastille
@@ -413,6 +430,38 @@ function hideUserNamePopup() {
if (badge) badge.classList.remove("open"); if (badge) badge.classList.remove("open");
} }
// v2026.5.17 : remplit la ligne "Session : MM:SS" avec couleur selon seuil.
// Recalcule à chaque appel — appelée aussi par le tick session pour rafraîchir.
function _renderUserPopupSessionLine(el) {
if (!el) return;
const remainingMs = _getSessionRemainingMs();
if (remainingMs == null) {
el.textContent = "Session : —";
el.className = "user-name-popup-session";
return;
}
const mins = Math.floor(remainingMs / 60000);
const secs = Math.floor((remainingMs % 60000) / 1000);
const txt = `Session : ${String(mins).padStart(2, "0")}:${String(secs).padStart(2, "0")}`;
el.textContent = txt;
el.className = "user-name-popup-session";
if (remainingMs <= SESSION_CRITICAL_THRESHOLD_MS) {
el.classList.add("session-critical");
} else if (remainingMs <= SESSION_WARN_THRESHOLD_MS) {
el.classList.add("session-warn");
} else {
el.classList.add("session-ok");
}
}
// v2026.5.17 : récupère en ms le temps restant avant expiration de la session.
// Retourne null si on ne connaît pas encore (pas de session ouverte).
function _getSessionRemainingMs() {
if (!state.sessionExpireAt) return null;
const remaining = state.sessionExpireAt - Date.now();
return remaining > 0 ? remaining : 0;
}
// ============================================================================ // ============================================================================
// Thème clair/sombre // Thème clair/sombre
// ============================================================================ // ============================================================================
@@ -516,18 +565,65 @@ function bindTopbar() {
} }
} }
}); });
// v2026.5.20 : nouveau comportement de la touche Échap
// - Appui court : ferme uniquement le popup SOUS la souris (normal ou
// minimisé). Si la souris n'est sur aucun popup, ne fait rien.
// Ferme aussi le popup user-badge et la grande bulle anchored.
// - Maintenu ≥ 3 secondes : ferme TOUS les popups flottants, mais garde
// les pastilles dock (popups "réduits" en bas).
let _escHoldTimer = null;
let _escHoldTriggered = false;
const ESC_HOLD_MS = 3000;
document.addEventListener("keydown", (e) => { document.addEventListener("keydown", (e) => {
if (e.key === "Escape") { if (e.key !== "Escape") return;
// keydown peut se répéter si la touche est maintenue ; on ignore les répétitions.
if (e.repeat) return;
// Armer le timer "maintenu 3s"
_escHoldTriggered = false;
if (_escHoldTimer) clearTimeout(_escHoldTimer);
_escHoldTimer = setTimeout(() => {
_escHoldTriggered = true;
_escHoldTimer = null;
// Fermer TOUS les popups flottants (normaux + minimisés) mais pas les dockés
document.querySelectorAll(".pinned-popup:not(.pinned-popup-reduced)").forEach(p => {
try { p.remove(); } catch (err) {}
});
// Nettoyer la liste
for (let i = pinnedPopups.length - 1; i >= 0; i--) {
if (!document.body.contains(pinnedPopups[i].el)) {
pinnedPopups.splice(i, 1);
}
}
_ensureDockCloseAllBtn();
}, ESC_HOLD_MS);
});
document.addEventListener("keyup", (e) => {
if (e.key !== "Escape") return;
if (_escHoldTimer) {
clearTimeout(_escHoldTimer);
_escHoldTimer = null;
}
if (_escHoldTriggered) {
// On a déjà fait l'action "maintenu", ne rien faire de plus
_escHoldTriggered = false;
return;
}
// Appui court : fermer le popup sous la souris si applicable
hideUserNamePopup(); hideUserNamePopup();
// v4.2.4 : Échap ferme aussi la grande bulle anchored
const tip = tooltipEl(); const tip = tooltipEl();
if (tip && tip.dataset.mode === "anchored" && tip.classList.contains("visible")) { if (tip && tip.dataset.mode === "anchored" && tip.classList.contains("visible")) {
hideTooltip({ force: true }); hideTooltip({ force: true });
} }
// v4.3.0 : Échap ferme TOUS les popups épinglés (le user veut tout fermer) // Quel popup est sous la souris ? Utiliser :hover pour détecter
if (typeof closeAllPinnedPopups === "function") { const hovered = document.querySelector(".pinned-popup:hover");
closeAllPinnedPopups(); if (hovered && !hovered.classList.contains("pinned-popup-reduced")) {
} // Retirer aussi de pinnedPopups
const idx = pinnedPopups.findIndex(p => p.el === hovered);
if (idx >= 0) pinnedPopups.splice(idx, 1);
hovered.remove();
_ensureDockCloseAllBtn();
} }
}); });
@@ -798,11 +894,37 @@ function initAppFooter() {
function initAppClock() { function initAppClock() {
const el = document.getElementById("app-clock"); const el = document.getElementById("app-clock");
if (!el) return; 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 = () => { const tick = () => {
const d = new Date(); const d = new Date();
const h = String(d.getHours()).padStart(2, "0"); const h = String(d.getHours()).padStart(2, "0");
const m = String(d.getMinutes()).padStart(2, "0"); const m = String(d.getMinutes()).padStart(2, "0");
el.textContent = `${h}:${m}`; const timeStr = `${h}:${m}`;
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)
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}`;
if (dateStr !== lastDateStr) {
dateEl.textContent = dateStr;
lastDateStr = dateStr;
}
}
// v5.0.0 : profite du tick pour mettre à jour la ligne rouge "now" // v5.0.0 : profite du tick pour mettre à jour la ligne rouge "now"
updateNowLine(); updateNowLine();
}; };
@@ -811,6 +933,53 @@ function initAppClock() {
setInterval(tick, 30 * 1000); setInterval(tick, 30 * 1000);
} }
// v2026.5.17 : met à jour le faux input date custom (ex: "Vendredi 24.04.2026")
// Remplace l'ancien updateDatePickerDayLabel. L'input date natif reste présent
// mais caché, et son onChange continue de déclencher le chargement.
const DAY_NAMES_FULL = ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
function updateDatePickerDayLabel(isoDate) {
const el = document.getElementById("date-custom-label");
if (!el) return;
if (!isoDate) { el.textContent = ""; return; }
try {
const d = isoToDate(isoDate);
const day = DAY_NAMES_FULL[d.getDay()];
const dd = String(d.getDate()).padStart(2, "0");
const mm = String(d.getMonth() + 1).padStart(2, "0");
const yyyy = d.getFullYear();
el.textContent = `${day} ${dd}.${mm}.${yyyy}`;
} catch (e) {
el.textContent = "";
}
}
// v2026.5.17 : brancher le faux input date — clic dessus ouvre le vrai input
// caché pour choisir une date.
function initDateCustomPicker() {
const custom = document.getElementById("date-custom");
const picker = document.getElementById("date-picker");
if (!custom || !picker) return;
const openPicker = () => {
try {
if (typeof picker.showPicker === "function") {
picker.showPicker();
} else {
picker.focus();
picker.click();
}
} catch (e) {
picker.focus();
}
};
custom.addEventListener("click", openPicker);
custom.addEventListener("keydown", (e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
openPicker();
}
});
}
// v5.0.0 : ligne verticale rouge "heure actuelle" sur la timeline, visible // v5.0.0 : ligne verticale rouge "heure actuelle" sur la timeline, visible
// UNIQUEMENT quand on affiche aujourd'hui. Appelée à chaque tick de l'horloge // UNIQUEMENT quand on affiche aujourd'hui. Appelée à chaque tick de l'horloge
// + après chaque render (cf renderFromData). // + après chaque render (cf renderFromData).
@@ -1000,6 +1169,103 @@ function updateSessionIndicator() {
} }
}; };
} }
// v2026.5.17 : si le popup user-badge est ouvert, rafraîchir la ligne "Session : MM:SS"
const sessLineInPopup = document.getElementById("user-name-popup-session");
if (sessLineInPopup) _renderUserPopupSessionLine(sessLineInPopup);
// v2026.5.17 : popup d'alerte "glissante" depuis le haut gauche
// - à 5 min : alerte standard (si pas encore affichée ni "plus tard")
// - à 2 min : alerte urgente (si pas encore affichée)
_handleSessionSlideAlerts(remainingMs);
}
/**
* v2026.5.17 : gère les 2 alertes popup glissant depuis le haut gauche.
* - Première alerte à 5 min (SESSION_WARN_THRESHOLD_MS). Reste affichée jusqu'à
* action manuelle (Prolonger ou Plus tard).
* - Si "Plus tard", une 2e alerte plus urgente réapparait à 2 min
* (SESSION_CRITICAL_THRESHOLD_MS).
*/
function _handleSessionSlideAlerts(remainingMs) {
if (remainingMs == null) return;
// Alerte à 5 min
if (remainingMs <= SESSION_WARN_THRESHOLD_MS
&& remainingMs > SESSION_CRITICAL_THRESHOLD_MS
&& !state._slideAlert5minShown) {
state._slideAlert5minShown = true;
_showSessionSlideAlert({ urgent: false });
}
// Alerte à 2 min (si déjà "Plus tard" sur l'alerte 5 min OU alerte 5 min jamais affichée)
if (remainingMs <= SESSION_CRITICAL_THRESHOLD_MS
&& !state._slideAlert2minShown) {
state._slideAlert2minShown = true;
// Cacher éventuellement l'ancienne alerte pour ré-afficher la nouvelle
_hideSessionSlideAlert();
_showSessionSlideAlert({ urgent: true });
}
}
function _showSessionSlideAlert({ urgent }) {
// Retirer l'ancienne si elle existe
_hideSessionSlideAlert();
const el = document.createElement("div");
el.id = "session-slide-alert";
el.className = "session-slide-alert" + (urgent ? " urgent" : "");
const title = urgent ? "⚠ Session expire dans 2 minutes !" : "⏱ Session expire dans 5 minutes";
el.innerHTML = `
<div class="session-slide-alert-title">${title}</div>
<div class="session-slide-alert-actions">
<button type="button" class="session-slide-alert-extend">🔄 Prolonger</button>
<button type="button" class="session-slide-alert-later">Plus tard</button>
</div>
`;
document.body.appendChild(el);
// Déclenche l'animation de slide-in (petite tempo pour que la transition parte)
requestAnimationFrame(() => el.classList.add("visible"));
// Action "Prolonger"
el.querySelector(".session-slide-alert-extend").addEventListener("click", async () => {
const extendBtn = el.querySelector(".session-slide-alert-extend");
extendBtn.disabled = true;
extendBtn.textContent = "…";
try {
const resp = await sendMessage({ type: "extendSession" });
if (resp && resp.ok && typeof resp.remainingMs === "number") {
state.sessionExpireAt = Date.now() + resp.remainingMs;
state.sessionPingDone = false;
state._criticalModalShown = false;
// Reset des flags d'alerte pour le prochain cycle
state._slideAlert5minShown = false;
state._slideAlert2minShown = false;
showToast("Session prolongée", "30 minutes de plus");
updateSessionIndicator();
_hideSessionSlideAlert();
} else {
throw new Error((resp && resp.error) || "erreur inconnue");
}
} catch (err) {
extendBtn.disabled = false;
extendBtn.textContent = "🔄 Prolonger";
}
});
// Action "Plus tard"
el.querySelector(".session-slide-alert-later").addEventListener("click", () => {
_hideSessionSlideAlert();
// Si c'est l'alerte 5 min qu'on dismissa, l'alerte 2 min reviendra
// automatiquement (state._slideAlert2minShown toujours false).
});
}
function _hideSessionSlideAlert() {
const el = document.getElementById("session-slide-alert");
if (!el) return;
el.classList.remove("visible");
setTimeout(() => { try { el.remove(); } catch (e) {} }, 250);
} }
/** /**
@@ -2145,15 +2411,19 @@ async function writeCache(isoDate, data) {
// ============================================================================ // ============================================================================
async function loadForDate(isoDate, opts = {}) { async function loadForDate(isoDate, opts = {}) {
// v4.3.1 : changer de date ferme tous les popups épinglés. Ils réfèrent à // v4.3.1 : changer de date fermait tous les popups épinglés.
// des interventions du jour courant, ils n'ont aucun sens sur un autre jour. // v2026.5.17 : les popups épinglés restent maintenant ouverts entre dates,
// avec les données qu'ils avaient au moment de l'épinglage.
// v2026.5.18 : au changement de date, on réduit tous les popups épinglés
// dans la taskbar du bas (l'user peut les re-agrandir au clic).
const previousDate = state.currentDate; const previousDate = state.currentDate;
if (previousDate && previousDate !== isoDate && typeof closeAllPinnedPopups === "function") { if (previousDate && previousDate !== isoDate) {
closeAllPinnedPopups(); _reduceAllPinnedPopups();
} }
state.currentDate = isoDate; state.currentDate = isoDate;
document.getElementById("date-picker").value = isoDate; document.getElementById("date-picker").value = isoDate;
updateDatePickerDayLabel(isoDate); // v2026.5.16 : label "Mardi" à côté
if (!state.session) { if (!state.session) {
// v4.2.5 : afficher le cache + bannière, plutôt que l'écran "session" // v4.2.5 : afficher le cache + bannière, plutôt que l'écran "session"
@@ -4188,6 +4458,12 @@ function compareTechs(a, b, targetDate) {
return aLast.localeCompare(bLast, "fr"); return aLast.localeCompare(bLast, "fr");
} }
// v5.0.13 : un tech est considéré "absent toute la journée" uniquement si une
// absence couvre RÉELLEMENT du matin au soir (ou quasi), pas juste s'il a des
// absences (éventuellement partielles). Avant, une absence matin 08-12 seule
// faisait passer le tech en "absent toute la journée" car il n'avait QUE des
// absences. Maintenant on check explicitement que l'absence couvre ≥ 90% de
// la plage 08:00-18:00.
function isTechAbsent(tech, isoDate) { function isTechAbsent(tech, isoDate) {
const recurring = RECURRING_ABSENCES[tech.id]; const recurring = RECURRING_ABSENCES[tech.id];
if (recurring) { if (recurring) {
@@ -4195,7 +4471,26 @@ function isTechAbsent(tech, isoDate) {
if (recurring.includes(day)) return true; if (recurring.includes(day)) return true;
} }
if (tech.interventions.length === 0) return false; if (tech.interventions.length === 0) return false;
return tech.interventions.every(iv => iv.type === "AL-Absence" && !iv.isPompier); // Parmi les absences (hors pompier), est-ce qu'une seule couvre la journée ?
const fullDayAbsences = tech.interventions.filter(iv => {
if (iv.type !== "AL-Absence" || iv.isPompier) return false;
const startMin = timeToMinutes(iv.startTime);
const endMin = timeToMinutes(iv.endTime);
if (startMin == null || endMin == null) {
// Si on n'a pas d'horaires, on considère que c'est toute la journée
// (cas des absences multi-jours sans horaires précis)
return true;
}
// Absence couvre toute la journée si son créneau déborde largement
// la plage affichée (≥ 90%). Une demi-journée (4h) sur 10h = 40% → ne
// passera pas, donc on ne marquera pas le tech comme absent toute la journée.
const DAY_LEN_MIN = 10 * 60; // 08:00 → 18:00 = 10h
const clampedStart = Math.max(startMin, 8 * 60);
const clampedEnd = Math.min(endMin, 18 * 60);
const coveredMin = Math.max(0, clampedEnd - clampedStart);
return coveredMin >= 0.9 * DAY_LEN_MIN;
});
return fullDayAbsences.length > 0;
} }
// ============================================================================ // ============================================================================
@@ -4323,7 +4618,21 @@ function buildCard(tech, isoDate) {
return card; return card;
} }
if (realInterventions.length === 0 && !isPompier) { // v5.0.14 : si le tech n'a aucune intervention mais a des absences
// partielles (demi-journée) ou pompier, on veut quand même afficher la
// timeline avec les blocs absence visibles. Sans ça, une absence 08-12
// seule n'apparaissait jamais sur la carte (affichait juste "Pas
// d'intervention planifiée").
const hasPartialAbsences = absenceBlocks.some(ab => {
if (ab.isPompier) return false;
const s = timeToMinutes(ab.startTime);
const e = timeToMinutes(ab.endTime);
if (s === null || e === null) return false;
// Absence qui couvre PAS toute la journée → c'est partiel
return !(s <= DAY_START && e >= DAY_END);
});
if (realInterventions.length === 0 && !isPompier && !hasPartialAbsences) {
if (isPillonelFriday) { if (isPillonelFriday) {
const note = document.createElement("div"); const note = document.createElement("div");
note.className = "tech-absence-recurring"; note.className = "tech-absence-recurring";
@@ -4373,6 +4682,25 @@ function buildCard(tech, isoDate) {
body.appendChild(buildInterventionRow(iv, card)); body.appendChild(buildInterventionRow(iv, card));
} }
// v5.0.15 : afficher aussi les absences partielles (demi-journée) comme
// des rows, avec le même style que les réservations mais en gris foncé.
// Les absences qui couvrent toute la journée sont déjà traitées plus haut
// (carte "Absent toute la journée") et ne doivent pas être dupliquées ici.
if (!isAbsent) {
const partialAbsences = absenceBlocks.filter(ab => {
if (ab.isPompier) return false;
const s = timeToMinutes(ab.startTime);
const e = timeToMinutes(ab.endTime);
if (s === null || e === null) return false;
return !(s <= DAY_START && e >= DAY_END);
});
// Trier par heure de début
partialAbsences.sort((a, b) => (a.startTime || "").localeCompare(b.startTime || ""));
for (const ab of partialAbsences) {
body.appendChild(buildInterventionRow(ab, card));
}
}
card.appendChild(body); card.appendChild(body);
return card; return card;
} }
@@ -4734,7 +5062,7 @@ function buildInterventionRow(iv, cardEl) {
cardEl._rowIdxCounter = ivIdx + 1; cardEl._rowIdxCounter = ivIdx + 1;
row.dataset.ivIdx = ivIdx; row.dataset.ivIdx = ivIdx;
if (iv.formLink && !iv.ghost) { if (iv.formLink && !iv.ghost && iv.type !== "AL-Absence") {
row.classList.add("clickable"); row.classList.add("clickable");
// v4.1.8 : plus de title au survol (info déjà dans le tooltip en bas) // v4.1.8 : plus de title au survol (info déjà dans le tooltip en bas)
@@ -4772,6 +5100,10 @@ function buildInterventionRow(iv, cardEl) {
if (iv.type === "AL-Reservation") { if (iv.type === "AL-Reservation") {
refHeader.textContent = "Réservation"; refHeader.textContent = "Réservation";
refHeader.classList.add("is-reservation-title"); refHeader.classList.add("is-reservation-title");
} else if (iv.type === "AL-Absence") {
// v5.0.15 : absence partielle (demi-journée) affichée comme une row
refHeader.textContent = "Absence";
refHeader.classList.add("is-absence-title");
} else if (iv.ref) { } else if (iv.ref) {
refHeader.textContent = iv.ref; refHeader.textContent = iv.ref;
} else { } else {
@@ -4780,8 +5112,8 @@ function buildInterventionRow(iv, cardEl) {
} }
row.appendChild(refHeader); row.appendChild(refHeader);
// Check ✓ + bouton copier à droite de la ref (pas pour réservation) // Check ✓ + bouton copier à droite de la ref (pas pour réservation / absence)
if (statusClass && iv.type !== "AL-Reservation") { if (statusClass && iv.type !== "AL-Reservation" && iv.type !== "AL-Absence") {
const statusEl = document.createElement("div"); const statusEl = document.createElement("div");
statusEl.className = "iv-status-check"; statusEl.className = "iv-status-check";
// v4.2.5 : ✓✓ double pour clôturé/résolu (statut officiel EasyVista) // v4.2.5 : ✓✓ double pour clôturé/résolu (statut officiel EasyVista)
@@ -4794,7 +5126,7 @@ function buildInterventionRow(iv, cardEl) {
} }
row.appendChild(statusEl); row.appendChild(statusEl);
} }
if (iv.ref && iv.type !== "AL-Reservation") { if (iv.ref && iv.type !== "AL-Reservation" && iv.type !== "AL-Absence") {
const copyBtn = document.createElement("button"); const copyBtn = document.createElement("button");
copyBtn.className = "intervention-copy"; copyBtn.className = "intervention-copy";
copyBtn.type = "button"; copyBtn.type = "button";
@@ -4874,6 +5206,40 @@ function buildInterventionRow(iv, cardEl) {
return row; return row;
} }
// v5.0.15 : absence partielle (demi-journée) affichée comme une row au
// même style que les réservations mais en gris foncé, avec le type d'absence
// (Congés, Maladie, Pompier) comme sujet.
if (iv.type === "AL-Absence") {
// Bloc "Par Nom, Prénom" si on a un créateur
if (iv.reservationCreator) {
const parEl = document.createElement("div");
parEl.className = "iv-reservation-par";
parEl.textContent = "Par " + iv.reservationCreator;
rightCol.appendChild(parEl);
}
// Type d'absence (Congés, Maladie, Pompier) si dispo dans label
const absenceTypeMatch = (iv.label || "").match(/^([^/]+?)\s*(?:\/|$)/);
const absenceType = absenceTypeMatch ? absenceTypeMatch[1].trim() : null;
if (absenceType) {
const sujetEl = document.createElement("div");
sujetEl.className = "iv-reservation-sujet";
sujetEl.textContent = "Type : " + absenceType;
rightCol.appendChild(sujetEl);
}
row.appendChild(rightCol);
// Tooltip au hover (avec bouton supprimer)
row.addEventListener("mouseenter", (e) => {
showTooltip(e, iv, row);
highlightIntervention(cardEl, ivIdx, true);
});
row.addEventListener("mouseleave", () => {
hideTooltip();
highlightIntervention(cardEl, ivIdx, false);
});
return row;
}
// v4.1.2 : priorité à iv.infobulle (venant du xhr2 = données réelles vérifiées // v4.1.2 : priorité à iv.infobulle (venant du xhr2 = données réelles vérifiées
// par le tech sur place) puis fallback sur iv.bulleContact/iv.bulleLieu // par le tech sur place) puis fallback sur iv.bulleContact/iv.bulleLieu
// (venant de attr1/attr2 = planification initiale, parfois incorrecte). // (venant de attr1/attr2 = planification initiale, parfois incorrecte).
@@ -5269,7 +5635,10 @@ function splitOneContact(raw) {
// Prénom 41XXXXXXXXX → extraire 41XXXXXXXXX puis reformater en // Prénom 41XXXXXXXXX → extraire 41XXXXXXXXX puis reformater en
// +41 XX XXX XX XX). On exige exactement 11 chiffres collés pour // +41 XX XXX XX XX). On exige exactement 11 chiffres collés pour
// éviter de matcher des codes postaux ou autres nombres. // éviter de matcher des codes postaux ou autres nombres.
const rxLong = /(\+41\s?\d(?:[\d\s.\-]*\d)?|\+33\s?\d(?:[\d\s.\-]*\d)?|0\d(?:[\d\s.\-]*\d)?|(?<!\d)41\d{9}(?!\d)|(?<!\d)33\d{9}(?!\d))/g; // v2026.5.16 : ne PAS matcher si le numéro est précédé d'une lettre ou
// d'un underscore (identifiants style XXXX_NNNNNNNN, ABC123456,
// SERIAL_0123456789). On ajoute un lookbehind négatif (?<![A-Za-z_]).
const rxLong = /(?<![A-Za-z_])(\+41\s?\d(?:[\d\s.\-]*\d)?|\+33\s?\d(?:[\d\s.\-]*\d)?|0\d(?:[\d\s.\-]*\d)?|(?<!\d)41\d{9}(?!\d)|(?<!\d)33\d{9}(?!\d))/g;
// SHORT : numéro interne court (5 chiffres). // SHORT : numéro interne court (5 chiffres).
// - v4.1.20 : accepte "12345Texte" (pas de séparateur après) // - v4.1.20 : accepte "12345Texte" (pas de séparateur après)
// - v4.2.3 : accepte aussi les formats AVEC ESPACES au sein du numéro, // - v4.2.3 : accepte aussi les formats AVEC ESPACES au sein du numéro,
@@ -5318,6 +5687,26 @@ function splitOneContact(raw) {
} }
name = cleanContactName(name); name = cleanContactName(name);
// v2026.5.16 : dernier garde-fou — rejeter les "noms" qui ressemblent
// à des fragments de description technique plutôt qu'à des vrais contacts.
// Exemples rejetés :
// - "1x" (quantité isolée)
// - "1x pc" (quantité + type matériel)
// - "pc XNNNNNN" (type + numéro de série)
// - "XXXX_NNNNNNNN" (identifiant matériel)
// Critères d'un vrai nom : contient au moins un mot qui commence par une
// majuscule ET n'est pas juste un identifiant technique.
if (name) {
const looksLikeIdentifier = /^[A-Z]{2,}[_\-]\d+$/.test(name); // XXXX_NNNNNNNN
const startsWithQuantity = /^\d+x(\s|$)/i.test(name); // "1x" ou "1x pc"
const noCapitalWord = !/\b[A-ZÉÈÀÂÎÔÛÇ][a-zéèàâîôûç]+/.test(name); // aucun mot "Xxxxx"
const hasOnlyTechTokens = /^(\d+x|pc|mac|t[ée]l[ée]phone|ecran|docking|rollout)(\s+(\d+x|pc|mac|t[ée]l[ée]phone|ecran|docking|rollout|[A-Z]\d+))*\s*$/i.test(name);
if (looksLikeIdentifier || startsWithQuantity || hasOnlyTechTokens || (noCapitalWord && !phone)) {
name = null;
}
}
return { name, phone }; return { name, phone };
} }
@@ -5416,22 +5805,34 @@ function splitLieu(raw) {
// Retirer un / final (avec ou sans espaces) // Retirer un / final (avec ou sans espaces)
s = s.replace(/\s*\/\s*$/, "").trim(); s = s.replace(/\s*\/\s*$/, "").trim();
if (!s) return { ville: null, adresse: null }; if (!s) return { ville: null, adresse: null };
const idx = s.indexOf("/");
// v2026.5.16 : le format EasyVista peut avoir jusqu'à 3 parties séparées
// par "/" : VILLE / ADRESSE / PRÉCISIONS (étage, bureau, indications).
// Exemple : "LAUSANNE / Av. de Beaulieu 19 / 4eme en face de l'ascenseur"
// On ne garde que VILLE + ADRESSE. Les précisions (3e partie et suivantes)
// sont strippées — elles alourdissent la carte et sont disponibles dans
// le tooltip détaillé.
const parts = s.split("/").map(p => p.trim()).filter(Boolean);
let ville, adresse; let ville, adresse;
if (idx < 0) { if (parts.length === 0) {
return { ville: null, adresse: null };
} else if (parts.length === 1) {
// Pas de slash : tout est l'adresse
ville = null; ville = null;
adresse = s; adresse = parts[0];
} else { } else {
ville = s.substring(0, idx).trim(); // 2+ parties : ville = 1ère, adresse = 2e, on ignore le reste
adresse = s.substring(idx + 1).trim(); ville = parts[0];
adresse = parts[1];
} }
// Capitaliser la 1ère lettre des mots de voie (Rue, Chemin, Route, Avenue, // Capitaliser la 1ère lettre des mots de voie (Rue, Chemin, Route, Avenue,
// Boulevard, Place, Quai, Impasse + abréviations Av., Ch., Rte, Bd) // Boulevard, Place, Quai, Impasse + abréviations Av., Ch., Rte, Bd)
if (adresse) { if (adresse) {
adresse = adresse.replace( adresse = adresse.replace(
/\b(rue|chemin|route|avenue|boulevard|place|quai|impasse|ruelle|allée|allee|passage|sentier|av\.?|ch\.?|rte\.?|bd\.?)\b/gi, /\b(rue|chemin|route|avenue|boulevard|place|quai|impasse|ruelle|allée|allee|passage|sentier|av\.?|ch\.?|rte\.?|bd\.?)\b/gi,
(match) => { (match) => {
// Conserver la casse existante si déjà majuscule, sinon capitaliser
if (/^[A-ZÉÈÀÂÎÔÛÇ]/.test(match)) return match; if (/^[A-ZÉÈÀÂÎÔÛÇ]/.test(match)) return match;
return match.charAt(0).toUpperCase() + match.slice(1).toLowerCase(); return match.charAt(0).toUpperCase() + match.slice(1).toLowerCase();
} }
@@ -5740,6 +6141,11 @@ let bulleState = {
}; };
function showTooltip(e, iv, rowEl) { function showTooltip(e, iv, rowEl) {
// v2026.5.19 : pendant qu'un popup épinglé est en cours de drag, on ignore
// les mouseenter sur les cartes — sinon en survolant une carte on déclenche
// l'ouverture d'un nouveau tooltip par-dessus ce qu'on est en train de bouger.
if (state._popupDragging) return;
// v4.1.15 : si la bulle est épinglée sur une autre iv, on NE REMPLACE PAS // v4.1.15 : si la bulle est épinglée sur une autre iv, on NE REMPLACE PAS
// son contenu (l'user veut garder la fiche épinglée même en survolant // son contenu (l'user veut garder la fiche épinglée même en survolant
// d'autres cartes). // d'autres cartes).
@@ -5816,7 +6222,8 @@ function hideTooltip(opts = {}) {
state.currentTooltipIv = null; state.currentTooltipIv = null;
currentTooltipPos = null; currentTooltipPos = null;
tooltipPositionMode = null; // re-détecter à la prochaine ouverture tooltipPositionMode = null; // re-détecter à la prochaine ouverture
}, 120); }, 1000); // v2026.5.17 : délai 1s au lieu de 120ms pour laisser le temps
// à l'user d'atteindre le popup depuis la carte
} }
// v4.2 : détecte si l'utilisateur a une sélection de texte active dans la bulle. // v4.2 : détecte si l'utilisateur a une sélection de texte active dans la bulle.
@@ -5950,9 +6357,51 @@ function positionTooltipAnchored(rowEl) {
} }
if (y < 4) y = 4; if (y < 4) y = 4;
// v2026.5.17 : éviter le chevauchement avec les popups épinglés existants.
// On teste la position candidate, et si elle chevauche un popup épinglé,
// on essaie d'autres candidats (gauche de la carte, au-dessous, au-dessus).
const tipW = tipRect.width || 320;
const tipH = tipRect.height || 200;
const pinnedRects = _getPinnedPopupsViewportRects();
if (pinnedRects.length) {
const candidates = [
{ x, y, label: "right" },
{ x: rowRect.left - tipW - pad, y: rowRect.top, label: "left" },
{ x: rowRect.left, y: rowRect.bottom + pad, label: "below" },
{ x: rowRect.left, y: rowRect.top - tipH - pad, label: "above" }
];
for (const c of candidates) {
// Borne dans le viewport
if (c.x < 4) c.x = 4;
if (c.x + tipW > window.innerWidth - 8) c.x = window.innerWidth - tipW - 8;
if (c.y < 4) c.y = 4;
if (c.y + tipH > window.innerHeight - 8) c.y = window.innerHeight - tipH - 8;
const testRect = { left: c.x, top: c.y, right: c.x + tipW, bottom: c.y + tipH };
const overlaps = pinnedRects.some(pr => _rectsOverlap(testRect, pr));
if (!overlaps) {
x = c.x; y = c.y;
break;
}
}
}
setTooltipViewportPosition(x, y); setTooltipViewportPosition(x, y);
} }
/**
* v2026.5.17 : retourne les rectangles (en coords viewport) de tous les popups
* actuellement épinglés et visibles (non réduits). Utilisé pour anti-chevauchement.
*/
function _getPinnedPopupsViewportRects() {
const rects = [];
document.querySelectorAll(".pinned-popup").forEach(p => {
if (p.classList.contains("pinned-popup-reduced")) return; // docké, pas à l'écran
const r = p.getBoundingClientRect();
if (r.width > 0 && r.height > 0) rects.push(r);
});
return rects;
}
// ============================================================================ // ============================================================================
// v4.3.0 : système de popups épinglés détachés // v4.3.0 : système de popups épinglés détachés
// ============================================================================ // ============================================================================
@@ -5997,18 +6446,14 @@ function _rectsOverlap(a, b) {
function _findFreePopupPosition(rowEl, w, h) { function _findFreePopupPosition(rowEl, w, h) {
const pad = 14; const pad = 14;
const rowRect = rowEl.getBoundingClientRect(); const rowRect = rowEl.getBoundingClientRect();
const viewportW = window.innerWidth; // v2026.5.20 : utiliser la safe area (en dessous topbar, au-dessus dock)
const viewportH = window.innerHeight; const safe = _getPopupSafeArea();
// 4 candidats, en coords viewport // 4 candidats d'abord, autour de la row source (en coords viewport)
const candidates = [ const candidates = [
// Droite
{ x: rowRect.right + pad, y: rowRect.top, name: "droite" }, { x: rowRect.right + pad, y: rowRect.top, name: "droite" },
// Gauche
{ x: rowRect.left - w - pad, y: rowRect.top, name: "gauche" }, { x: rowRect.left - w - pad, y: rowRect.top, name: "gauche" },
// Dessous
{ x: rowRect.left, y: rowRect.bottom + pad, name: "dessous" }, { x: rowRect.left, y: rowRect.bottom + pad, name: "dessous" },
// Dessus
{ x: rowRect.left, y: rowRect.top - h - pad, name: "dessus" } { x: rowRect.left, y: rowRect.top - h - pad, name: "dessus" }
]; ];