v2026.5.17 — Date custom : label localisé (jour de la semaine en français)
This commit is contained in:
Quentin Rouiller
@@ -242,6 +242,7 @@ async function init() {
|
||||
initAppClock(); // v5.0.0 : horloge HH:MM au milieu topbar
|
||||
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
|
||||
|
||||
// Initialiser la date = aujourd'hui
|
||||
state.currentDate = todayISO();
|
||||
@@ -400,7 +401,21 @@ function toggleUserNamePopup() {
|
||||
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");
|
||||
badge.classList.add("open");
|
||||
// Positionne juste en dessous de la pastille
|
||||
@@ -415,6 +430,38 @@ function hideUserNamePopup() {
|
||||
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
|
||||
// ============================================================================
|
||||
@@ -839,21 +886,53 @@ function initAppClock() {
|
||||
setInterval(tick, 30 * 1000);
|
||||
}
|
||||
|
||||
// v2026.5.16 : met à jour le label court du jour affiché à gauche du
|
||||
// date-picker (ex: "Mardi", "Lundi"). Appelé à chaque changement de date.
|
||||
// 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-picker-day");
|
||||
const el = document.getElementById("date-custom-label");
|
||||
if (!el) return;
|
||||
if (!isoDate) { el.textContent = ""; return; }
|
||||
try {
|
||||
const d = isoToDate(isoDate);
|
||||
el.textContent = DAY_NAMES_FULL[d.getDay()];
|
||||
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
|
||||
// UNIQUEMENT quand on affiche aujourd'hui. Appelée à chaque tick de l'horloge
|
||||
// + après chaque render (cf renderFromData).
|
||||
@@ -1043,6 +1122,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);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -2188,12 +2364,11 @@ async function writeCache(isoDate, data) {
|
||||
// ============================================================================
|
||||
|
||||
async function loadForDate(isoDate, opts = {}) {
|
||||
// v4.3.1 : changer de date ferme tous les popups épinglés. Ils réfèrent à
|
||||
// des interventions du jour courant, ils n'ont aucun sens sur un autre jour.
|
||||
// v4.3.1 : changer de date fermait tous les popups épinglés.
|
||||
// v2026.5.17 : les popups épinglés restent maintenant ouverts entre dates,
|
||||
// avec les données qu'ils avaient au moment de l'épinglage. L'utilisateur
|
||||
// peut les fermer manuellement s'il veut.
|
||||
const previousDate = state.currentDate;
|
||||
if (previousDate && previousDate !== isoDate && typeof closeAllPinnedPopups === "function") {
|
||||
closeAllPinnedPopups();
|
||||
}
|
||||
|
||||
state.currentDate = isoDate;
|
||||
document.getElementById("date-picker").value = isoDate;
|
||||
@@ -5991,7 +6166,8 @@ function hideTooltip(opts = {}) {
|
||||
state.currentTooltipIv = null;
|
||||
currentTooltipPos = null;
|
||||
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.
|
||||
@@ -6125,9 +6301,51 @@ function positionTooltipAnchored(rowEl) {
|
||||
}
|
||||
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);
|
||||
}
|
||||
|
||||
/**
|
||||
* 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
|
||||
// ============================================================================
|
||||
@@ -6258,20 +6476,55 @@ function pinTooltip() {
|
||||
popup.dataset.actionId = iv.actionId || "";
|
||||
popup.innerHTML = srcEl.innerHTML;
|
||||
|
||||
// Ajouter un bouton × de fermeture (en plus du 📌)
|
||||
const closeBtn = document.createElement("button");
|
||||
closeBtn.type = "button";
|
||||
closeBtn.className = "pinned-popup-close";
|
||||
closeBtn.innerHTML = "×";
|
||||
closeBtn.title = "Désépingler (reste visible tant que la souris est dessus)";
|
||||
closeBtn.addEventListener("click", (e) => {
|
||||
// v2026.5.17 : masquer l'icône 📌 du contenu cloné (redondante car le
|
||||
// popup a sa propre topbar avec le bouton "désépingler" 📍 explicite)
|
||||
const oldPin = popup.querySelector('.tooltip-pinbtn[data-action="pin"]');
|
||||
if (oldPin) oldPin.remove();
|
||||
|
||||
// v2026.5.17 : topbar avec 3 boutons pour un popup épinglé :
|
||||
// _ = Minimiser (popup reste flottant mais compact, juste la ref)
|
||||
// ▭ = Réduire (docké dans la taskbar du bas)
|
||||
// 📍 = Désépingler (l'icône d'épingle "plantée" ; clic = retire l'épingle)
|
||||
const topbar = document.createElement("div");
|
||||
topbar.className = "pinned-popup-topbar";
|
||||
|
||||
// Bouton Minimiser
|
||||
const minBtn = document.createElement("button");
|
||||
minBtn.type = "button";
|
||||
minBtn.className = "pinned-popup-btn pinned-popup-minimize";
|
||||
minBtn.innerHTML = "_";
|
||||
minBtn.title = "Minimiser (reste flottant mais compact)";
|
||||
minBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_minimizePinnedPopup(popup);
|
||||
});
|
||||
topbar.appendChild(minBtn);
|
||||
|
||||
// Bouton Réduire
|
||||
const reduceBtn = document.createElement("button");
|
||||
reduceBtn.type = "button";
|
||||
reduceBtn.className = "pinned-popup-btn pinned-popup-reduce";
|
||||
reduceBtn.innerHTML = "▭";
|
||||
reduceBtn.title = "Réduire (docké en bas de l'écran)";
|
||||
reduceBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_reducePinnedPopup(popup);
|
||||
});
|
||||
topbar.appendChild(reduceBtn);
|
||||
|
||||
// Bouton Désépingler (icône épingle plantée)
|
||||
const unpinBtn = document.createElement("button");
|
||||
unpinBtn.type = "button";
|
||||
unpinBtn.className = "pinned-popup-btn pinned-popup-unpin";
|
||||
unpinBtn.innerHTML = "📍";
|
||||
unpinBtn.title = "Désépingler (se ferme quand la souris sort)";
|
||||
unpinBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
// Désépinglage "mou" : on marque la popup comme non épinglée mais on la
|
||||
// laisse visible tant que la souris est dessus. Elle disparaît quand la
|
||||
// souris sort.
|
||||
_softUnpinPopup(popup);
|
||||
});
|
||||
popup.appendChild(closeBtn);
|
||||
topbar.appendChild(unpinBtn);
|
||||
|
||||
popup.appendChild(topbar);
|
||||
|
||||
// v4.3.3 : barre de drag en haut, pour déplacer la popup à la souris.
|
||||
// Ancrée en haut à 22px de haut ; le padding-top de la popup est augmenté
|
||||
@@ -6377,6 +6630,11 @@ function _softUnpinPopup(el) {
|
||||
if (dragbar) dragbar.remove();
|
||||
const closeBtn = el.querySelector(".pinned-popup-close");
|
||||
if (closeBtn) closeBtn.remove();
|
||||
// v2026.5.17 : retirer aussi la nouvelle topbar et le conteneur minimisé
|
||||
const topbar = el.querySelector(".pinned-popup-topbar");
|
||||
if (topbar) topbar.remove();
|
||||
el.classList.remove("pinned-popup-minimized");
|
||||
el.classList.remove("pinned-popup-reduced");
|
||||
|
||||
// Helper qui joue l'animation de sortie puis supprime le DOM
|
||||
const animateAndRemove = () => {
|
||||
@@ -6393,6 +6651,164 @@ function _softUnpinPopup(el) {
|
||||
el.addEventListener("mouseleave", animateAndRemove, { once: true });
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// v2026.5.17 : États d'un popup épinglé
|
||||
// - Normal (complet, flottant)
|
||||
// - Minimisé (compact, flottant, juste la ref + topbar)
|
||||
// - Réduit (docké dans la taskbar en bas de l'écran)
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Passe un popup épinglé en mode Minimisé : on ne montre plus que la ref,
|
||||
* dans un petit cadre flottant toujours drag-able.
|
||||
*/
|
||||
function _minimizePinnedPopup(popup) {
|
||||
if (!popup) return;
|
||||
popup.classList.add("pinned-popup-minimized");
|
||||
|
||||
// Adapter les boutons topbar : [_] devient [⬆] (agrandir)
|
||||
const minBtn = popup.querySelector(".pinned-popup-minimize");
|
||||
if (minBtn) {
|
||||
minBtn.innerHTML = "⬆";
|
||||
minBtn.title = "Agrandir";
|
||||
// On retire les anciens listeners en clonant l'élément
|
||||
const newBtn = minBtn.cloneNode(true);
|
||||
minBtn.replaceWith(newBtn);
|
||||
newBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_expandPinnedPopup(popup);
|
||||
});
|
||||
}
|
||||
|
||||
// Clic sur la ref (dans iv-ref-header) = agrandir aussi
|
||||
const refEl = popup.querySelector(".iv-ref-header");
|
||||
if (refEl) {
|
||||
refEl.style.cursor = "pointer";
|
||||
refEl.title = "Cliquer pour agrandir";
|
||||
refEl.addEventListener("click", _onMinimizedRefClick);
|
||||
}
|
||||
}
|
||||
|
||||
function _onMinimizedRefClick(e) {
|
||||
const popup = e.currentTarget.closest(".pinned-popup");
|
||||
if (popup) _expandPinnedPopup(popup);
|
||||
}
|
||||
|
||||
/**
|
||||
* Repasse un popup minimisé en mode Normal (complet).
|
||||
*/
|
||||
function _expandPinnedPopup(popup) {
|
||||
if (!popup) return;
|
||||
popup.classList.remove("pinned-popup-minimized");
|
||||
|
||||
// Restaurer bouton Minimiser
|
||||
const minBtn = popup.querySelector(".pinned-popup-minimize");
|
||||
if (minBtn) {
|
||||
minBtn.innerHTML = "_";
|
||||
minBtn.title = "Minimiser (reste flottant mais compact)";
|
||||
const newBtn = minBtn.cloneNode(true);
|
||||
minBtn.replaceWith(newBtn);
|
||||
newBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_minimizePinnedPopup(popup);
|
||||
});
|
||||
}
|
||||
|
||||
// Retirer listener du clic-agrandir sur la ref
|
||||
const refEl = popup.querySelector(".iv-ref-header");
|
||||
if (refEl) {
|
||||
refEl.style.cursor = "";
|
||||
refEl.title = "";
|
||||
refEl.removeEventListener("click", _onMinimizedRefClick);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Passe un popup épinglé en mode Réduit : il disparaît de son emplacement
|
||||
* flottant et vient s'ajouter dans une taskbar en bas de l'écran sous forme
|
||||
* de pastille cliquable.
|
||||
*/
|
||||
function _reducePinnedPopup(popup) {
|
||||
if (!popup) return;
|
||||
|
||||
// Récupérer la référence pour le label de la pastille
|
||||
const refEl = popup.querySelector(".iv-ref-header");
|
||||
const label = refEl ? (refEl.textContent || "").trim() || "Popup" : "Popup";
|
||||
|
||||
// S'assurer que la taskbar du bas existe
|
||||
let dock = document.getElementById("pinned-popups-dock");
|
||||
if (!dock) {
|
||||
dock = document.createElement("div");
|
||||
dock.id = "pinned-popups-dock";
|
||||
dock.className = "pinned-popups-dock";
|
||||
document.body.appendChild(dock);
|
||||
}
|
||||
|
||||
// Créer la pastille dock
|
||||
const pill = document.createElement("button");
|
||||
pill.type = "button";
|
||||
pill.className = "pinned-popup-dock-pill";
|
||||
pill.textContent = label;
|
||||
pill.title = "Cliquer pour agrandir";
|
||||
|
||||
// Mémoriser la position/taille du popup avant de le masquer
|
||||
const rect = popup.getBoundingClientRect();
|
||||
popup.dataset.prevLeft = popup.style.left || (rect.left + "px");
|
||||
popup.dataset.prevTop = popup.style.top || (rect.top + "px");
|
||||
popup.dataset.prevWidth = popup.style.width || "";
|
||||
|
||||
// Cacher le popup (on le garde en DOM pour conserver son état et restaurer
|
||||
// instantanément)
|
||||
popup.classList.add("pinned-popup-reduced");
|
||||
|
||||
// Associer pill ↔ popup
|
||||
pill._linkedPopup = popup;
|
||||
popup._linkedPill = pill;
|
||||
|
||||
pill.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_restorePinnedPopupFromDock(popup);
|
||||
});
|
||||
|
||||
dock.appendChild(pill);
|
||||
dock.classList.add("visible");
|
||||
}
|
||||
|
||||
/**
|
||||
* Ramène un popup réduit en mode Normal : retire la pastille du dock et
|
||||
* réaffiche le popup flottant à sa position d'avant réduction.
|
||||
*/
|
||||
function _restorePinnedPopupFromDock(popup) {
|
||||
if (!popup) return;
|
||||
popup.classList.remove("pinned-popup-reduced");
|
||||
// Si le popup était minimisé avant d'être réduit, on l'agrandit direct
|
||||
// (la demande était : "Si la reduit et rappeller s'affiche en grand direct")
|
||||
popup.classList.remove("pinned-popup-minimized");
|
||||
const minBtn = popup.querySelector(".pinned-popup-minimize");
|
||||
if (minBtn) {
|
||||
minBtn.innerHTML = "_";
|
||||
minBtn.title = "Minimiser (reste flottant mais compact)";
|
||||
const newBtn = minBtn.cloneNode(true);
|
||||
minBtn.replaceWith(newBtn);
|
||||
newBtn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_minimizePinnedPopup(popup);
|
||||
});
|
||||
}
|
||||
|
||||
// Supprimer la pastille associée
|
||||
if (popup._linkedPill) {
|
||||
popup._linkedPill.remove();
|
||||
popup._linkedPill = null;
|
||||
}
|
||||
|
||||
// Si le dock est vide, le masquer
|
||||
const dock = document.getElementById("pinned-popups-dock");
|
||||
if (dock && dock.children.length === 0) {
|
||||
dock.classList.remove("visible");
|
||||
}
|
||||
}
|
||||
|
||||
/** Ferme toutes les popups épinglées (appelé par Échap ou changement de date). */
|
||||
/**
|
||||
* v5.0.1 : helper pour déclencher la suppression d'une absence ou réservation.
|
||||
|
||||
Reference in New Issue
Block a user