Version 2026.5.35 — Fix popup épinglé position vue horizontale + stats gauche

This commit is contained in:
2026-04-25 10:00:00 +02:00
parent 1ecc60e160
commit a92e3429b2
3 changed files with 899 additions and 18 deletions
+254 -8
View File
@@ -7819,15 +7819,26 @@ function _clampPopupInSafeArea(popup) {
const vTop = rect.top;
// Calcul des coords viewport cibles après clamp
// v2026.5.28 : si le popup est plus large que la zone dispo (fenêtre rétrécie
// depuis le côté droit), on le garde à sa position actuelle —
// l'user redimensionnera ou bougera manuellement. On préfère
// "déborder" à droite plutôt que rétrécir le popup.
let newVLeft = vLeft;
let newVTop = vTop;
if (newVLeft < safe.left) newVLeft = safe.left;
if (newVLeft + w > safe.right) newVLeft = safe.right - w;
if (newVLeft < safe.left) newVLeft = safe.left; // si popup plus large que viewport
if (newVTop < safe.top) newVTop = safe.top;
if (newVTop + h > safe.bottom) newVTop = safe.bottom - h;
if (newVTop < safe.top) newVTop = safe.top;
const safeWidth = safe.right - safe.left;
const safeHeight = safe.bottom - safe.top;
if (w <= safeWidth) {
// Popup rentre : on clamp normalement
if (newVLeft < safe.left) newVLeft = safe.left;
if (newVLeft + w > safe.right) newVLeft = safe.right - w;
if (newVLeft < safe.left) newVLeft = safe.left;
}
// Sinon : popup plus large que la zone → on laisse où il est, user libre
if (h <= safeHeight) {
if (newVTop < safe.top) newVTop = safe.top;
if (newVTop + h > safe.bottom) newVTop = safe.bottom - h;
if (newVTop < safe.top) newVTop = safe.top;
}
if (newVLeft === vLeft && newVTop === vTop) return; // rien à faire
@@ -7849,6 +7860,185 @@ function _reclampAllFloatingPopups() {
});
}
/**
* v2026.5.23 : drag & drop d'une pastille du dock.
* - Drag dans le dock : réordonne les pastilles (drop = insérer à la nouvelle
* position). Les autres se décalent en live.
* - Drop HORS du dock : restaure le popup en mode Normal à la position de la
* souris.
* Semi-transparent pendant le drag.
*/
function _attachPillDragHandler(pill, popup) {
const DRAG_THRESHOLD = 4; // px avant de considérer un vrai drag
let isDown = false;
let isDragging = false;
let startX = 0, startY = 0;
let ghostEl = null;
let pillOriginalNext = null; // voisin d'origine pour restaurer l'ordre
const onMouseMove = (e) => {
if (!isDown) return;
const dx = e.clientX - startX;
const dy = e.clientY - startY;
if (!isDragging) {
if (Math.abs(dx) < DRAG_THRESHOLD && Math.abs(dy) < DRAG_THRESHOLD) return;
// Début du drag
isDragging = true;
pill._dragging = true;
pill._justDragged = true;
_hidePillHoverMenu();
pill.classList.add("pill-dragging");
// Créer un "ghost" flottant qui suit la souris
const r = pill.getBoundingClientRect();
ghostEl = pill.cloneNode(true);
ghostEl.style.position = "fixed";
ghostEl.style.left = r.left + "px";
ghostEl.style.top = r.top + "px";
ghostEl.style.width = r.width + "px";
ghostEl.style.height = r.height + "px";
ghostEl.style.zIndex = "1100";
ghostEl.style.opacity = "0.85";
ghostEl.style.pointerEvents = "none";
ghostEl.classList.add("pill-dragging-ghost");
document.body.appendChild(ghostEl);
// Mémoriser le voisin d'origine pour restaurer si drop hors dock
pillOriginalNext = pill.nextSibling;
}
// Déplacer le ghost avec la souris
if (ghostEl) {
ghostEl.style.left = (e.clientX - ghostEl.offsetWidth / 2) + "px";
ghostEl.style.top = (e.clientY - ghostEl.offsetHeight / 2) + "px";
}
// Détecter si on est au-dessus du dock
const dock = document.getElementById("pinned-popups-dock");
if (!dock) return;
const dockRect = dock.getBoundingClientRect();
const insideDock = (
e.clientX >= dockRect.left && e.clientX <= dockRect.right &&
e.clientY >= dockRect.top && e.clientY <= dockRect.bottom
);
if (insideDock) {
// Trouver où insérer parmi les autres pastilles
const pills = Array.from(dock.querySelectorAll(".pinned-popup-dock-pill"))
.filter(p => p !== pill);
let inserted = false;
for (const other of pills) {
const or = other.getBoundingClientRect();
const midX = or.left + or.width / 2;
if (e.clientX < midX) {
dock.insertBefore(pill, other);
inserted = true;
break;
}
}
if (!inserted) {
// Insérer juste avant le bouton "Fermer tous" s'il existe, sinon en fin
const closeAllBtn = document.getElementById("pinned-popups-close-all");
if (closeAllBtn) {
dock.insertBefore(pill, closeAllBtn);
} else {
dock.appendChild(pill);
}
}
}
};
const onMouseUp = (e) => {
if (!isDown) return;
isDown = false;
document.removeEventListener("mousemove", onMouseMove);
document.removeEventListener("mouseup", onMouseUp);
if (!isDragging) return; // juste un clic simple, pas un drag
isDragging = false;
setTimeout(() => { pill._dragging = false; }, 10);
pill.classList.remove("pill-dragging");
if (ghostEl) {
try { ghostEl.remove(); } catch (err) {}
ghostEl = null;
}
// Vérifier si drop dans le dock ou hors
const dock = document.getElementById("pinned-popups-dock");
let insideDock = false;
if (dock) {
const dockRect = dock.getBoundingClientRect();
insideDock = (
e.clientX >= dockRect.left && e.clientX <= dockRect.right &&
e.clientY >= dockRect.top && e.clientY <= dockRect.bottom
);
}
if (insideDock) {
// Drop dans le dock = réordonnage déjà fait pendant onMouseMove. OK.
return;
}
// Drop HORS du dock : restaurer le popup en mode Normal à la position souris
// Le popup est actuellement en état "réduit" — on le réaffiche.
popup.classList.remove("pinned-popup-reduced");
popup.classList.remove("pinned-popup-minimized");
// Positionner à la souris (coords document)
const popupW = popup.offsetWidth || 320;
const popupH = popup.offsetHeight || 200;
const docX = _viewportToDocumentX(e.clientX - popupW / 2);
const docY = _viewportToDocumentY(e.clientY - 20);
popup.style.left = docX + "px";
popup.style.top = docY + "px";
// Clamper dans la safe area
_clampPopupInSafeArea(popup);
// Retirer la pastille et nettoyer le dock si vide
try { pill.remove(); } catch (err) {}
popup._linkedPill = null;
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();
}
// Restaurer le bouton Minimiser (si c'était en mode minimisé avant réduction)
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", (ev) => {
ev.stopPropagation();
_minimizePinnedPopup(popup);
});
}
// v2026.5.23 : mettre à jour le rect dans pinnedPopups pour que l'anti-
// chevauchement tienne compte de la nouvelle position
const entry = pinnedPopups.find(p => p.el === popup);
if (entry) {
const l = parseFloat(popup.style.left) || 0;
const t = parseFloat(popup.style.top) || 0;
const w = popup.offsetWidth;
const h = popup.offsetHeight;
entry.rect = { left: l, top: t, right: l + w, bottom: t + h };
}
};
pill.addEventListener("mousedown", (e) => {
if (e.button !== 0) return;
isDown = true;
isDragging = false;
startX = e.clientX;
startY = e.clientY;
document.addEventListener("mousemove", onMouseMove);
document.addEventListener("mouseup", onMouseUp);
});
}
/**
* v2026.5.19 : réduit TOUS les popups épinglés actuellement ouverts (en mode
* normal ou minimisé) dans la taskbar du bas. Appelé au changement de date.
@@ -7870,6 +8060,24 @@ function _formatDateShort(iso) {
return `${m[3]}.${m[2]}`;
}
/**
* v2026.5.25 : formatte une date ISO en "Mardi 22.04" pour la pastille dock.
*/
function _formatDateForPill(iso) {
if (!iso) return "";
const m = String(iso).match(/^(\d{4})-(\d{2})-(\d{2})$/);
if (!m) return iso;
try {
const d = new Date(parseInt(m[1]), parseInt(m[2]) - 1, parseInt(m[3]));
const dayName = (typeof DAY_NAMES_FULL !== "undefined" && DAY_NAMES_FULL[d.getDay()])
? DAY_NAMES_FULL[d.getDay()]
: "";
return (dayName ? dayName + " " : "") + m[3] + "." + m[2];
} catch (e) {
return m[3] + "." + m[2];
}
}
/**
* v2026.5.18 : ajoute (ou met à jour) le bouton "Fermer tous" dans le dock
* quand au moins 2 popups épinglés existent (réduits OU affichés).
@@ -8244,6 +8452,31 @@ function bindTooltipInteractions() {
const el = tooltipEl();
if (!el) return;
// v2026.5.27 : quand la souris entre dans un popup épinglé, fermer tout
// popup non-épinglé (tooltip live ou soft-unpinned) pour garder l'écran clair.
document.addEventListener("mouseover", (e) => {
const target = e.target;
if (!target || !target.closest) return;
const pinned = target.closest(".pinned-popup");
if (!pinned) return;
// On survole un popup épinglé → fermer tooltip live s'il n'est pas pinned
if (!bulleState.pinned) {
const tip = tooltipEl();
if (tip && tip.classList.contains("visible")) {
tip.classList.remove("visible");
tip.classList.add("hidden");
if (tip.dataset) delete tip.dataset.mode;
state.currentTooltipIv = null;
currentTooltipPos = null;
tooltipPositionMode = null;
}
}
// Fermer les soft-unpinned qui traînent
document.querySelectorAll(".soft-unpinned").forEach(el => {
try { el.remove(); } catch (err) {}
});
});
// v4.1.17 : ré-applique la position au scroll de la page (safety net
// contre un ancêtre qui casserait position:fixed silencieusement).
window.addEventListener("scroll", reapplyTooltipPosition, { passive: true });
@@ -8391,6 +8624,7 @@ function bindTooltipInteractions() {
}
function buildTooltipHTML(iv) {
if (!iv) return '<dl><dt>Info</dt><dd>—</dd></dl>';
const i = iv.infobulle || {};
const rows = [];
@@ -8589,10 +8823,22 @@ function escapeHtml(s) {
}
function highlightIntervention(cardEl, ivIdx, on) {
const row = cardEl.querySelector(`.intervention[data-iv-idx="${ivIdx}"]`);
// v2026.5.29 : chercher .intervention-v2 (nouveau nom) et fallback .intervention
const row = cardEl.querySelector(`.intervention-v2[data-iv-idx="${ivIdx}"]`)
|| cardEl.querySelector(`.intervention[data-iv-idx="${ivIdx}"]`);
const slot = cardEl.querySelector(`.timeline-slot[data-iv-idx="${ivIdx}"]`);
if (row) row.classList.toggle("highlight", on);
if (slot) slot.classList.toggle("highlight", on);
// v2026.5.29 : quand on active le highlight (typiquement depuis un slot
// timeline), faire scroller la row dans la vue pour que l'user voie la
// carte correspondante sans avoir à chercher. On évite de scroller le
// body, on scroll juste la row à l'intérieur de la carte si elle déborde.
if (on && row && typeof row.scrollIntoView === "function") {
try {
row.scrollIntoView({ block: "nearest", inline: "nearest", behavior: "smooth" });
} catch (e) {}
}
}
// ============================================================================