forked from FroSteel/Planification
Compare commits
4 Commits
v2026.5.33
...
v2026.5.37
| Author | SHA1 | Date | |
|---|---|---|---|
 FroSteel
|
0fbc1997bb | ||
|
FroSteel
|
cd54764dd5 | ||
|
FroSteel
|
a92e3429b2 | ||
|
FroSteel
|
1ecc60e160 |
+2
-15
@@ -1,19 +1,8 @@
|
||||
{
|
||||
"manifest_version": 3,
|
||||
"name": "Planification",
|
||||
"version": "2026.5.33",
|
||||
"version": "2026.5.37",
|
||||
"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": {
|
||||
"id": "planification@vd.ch",
|
||||
"strict_min_version": "140.0",
|
||||
"data_collection_permissions": {
|
||||
"required": [
|
||||
"none"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"permissions": [
|
||||
"activeTab",
|
||||
"scripting",
|
||||
@@ -29,9 +18,7 @@
|
||||
"default_title": "Ouvrir la Planification"
|
||||
},
|
||||
"background": {
|
||||
"scripts": [
|
||||
"background.js"
|
||||
]
|
||||
"service_worker": "background.js"
|
||||
},
|
||||
"icons": {
|
||||
"16": "icons/icon16.png",
|
||||
|
||||
+1052
-12
File diff suppressed because it is too large
Load Diff
@@ -1046,10 +1046,253 @@ function _toggleView() {
|
||||
_setCurrentView(next);
|
||||
}
|
||||
|
||||
/**
|
||||
* v2026.5.36 : applique le mode de vue (classique/horizontal) en déplaçant
|
||||
* physiquement les éléments de la topbar vers/depuis une sidebar verticale
|
||||
* à gauche de l'écran.
|
||||
*
|
||||
* En vue horizontale :
|
||||
* - Sidebar gauche verticale contenant (haut → bas) :
|
||||
* · Navigation date (prev / date / next / aujourd'hui)
|
||||
* · Horloge + date (compacte, une par ligne)
|
||||
* · Info de synchro
|
||||
* · Stats globales (interventions/techs/absents)
|
||||
* · Boutons actions (Absence, Douchette, Actualiser, Tout recharger, Vider cache)
|
||||
* - Topbar réduite à : user-badge + titre + theme-toggle
|
||||
*
|
||||
* En vue classique :
|
||||
* - Tout est remis dans la topbar comme avant (topbar-left / topbar-right)
|
||||
*
|
||||
* On mémorise les parents d'origine sur chaque élément (data-orig-parent)
|
||||
* pour restaurer proprement en vue classique.
|
||||
*
|
||||
* Logs [viewMode] pour debug.
|
||||
*/
|
||||
function _applyViewMode() {
|
||||
const mode = _getCurrentView();
|
||||
console.log(`[viewMode] application de la vue : ${mode}`);
|
||||
|
||||
// Mettre à jour la classe sur <html> pour les règles CSS
|
||||
document.documentElement.classList.remove("view-classic", "view-horizontal");
|
||||
document.documentElement.classList.add("view-" + mode);
|
||||
|
||||
// Liste des IDs à déplacer entre topbar (classique) et sidebar (horizontal)
|
||||
// Ordre = ordre visuel dans la sidebar en mode horizontal (haut → bas)
|
||||
// v2026.5.37 : user-badge, app-title, theme-toggle déplacés aussi → la topbar
|
||||
// devient vide en vue horizontale.
|
||||
const ELEMENTS_TO_RELOCATE = [
|
||||
"user-badge", // tout en haut de la sidebar
|
||||
"app-title", // juste après user-badge
|
||||
"date-nav", // (pas un id mais une classe, traité à part)
|
||||
"app-clock",
|
||||
"capture-info",
|
||||
"stats", // conteneur stats globales (généré dynamiquement)
|
||||
"absence-btn",
|
||||
"douchette-btn",
|
||||
"refresh-partial-btn",
|
||||
"refresh-btn",
|
||||
"abort-btn",
|
||||
"clear-cache-btn",
|
||||
"theme-toggle" // tout en bas de la sidebar
|
||||
];
|
||||
|
||||
if (mode === "horizontal") {
|
||||
_moveElementsToSidebar(ELEMENTS_TO_RELOCATE);
|
||||
} else {
|
||||
_restoreElementsToTopbar(ELEMENTS_TO_RELOCATE);
|
||||
}
|
||||
|
||||
console.log(`[viewMode] application terminée (mode=${mode})`);
|
||||
}
|
||||
|
||||
/**
|
||||
* v2026.5.36 : crée ou retrouve la sidebar, et y déplace les éléments listés.
|
||||
* Les éléments sont déplacés dans l'ordre du tableau.
|
||||
*/
|
||||
function _moveElementsToSidebar(ids) {
|
||||
// Créer (ou retrouver) le wrapper qui contiendra sidebar + main côte à côte
|
||||
let wrapper = document.getElementById("horizontal-wrapper");
|
||||
const mainEl = document.getElementById("main");
|
||||
if (!wrapper) {
|
||||
wrapper = document.createElement("div");
|
||||
wrapper.id = "horizontal-wrapper";
|
||||
wrapper.className = "horizontal-wrapper";
|
||||
// Placer le wrapper à la place de <main>, puis mettre <main> DEDANS
|
||||
if (mainEl && mainEl.parentNode) {
|
||||
mainEl.parentNode.insertBefore(wrapper, mainEl);
|
||||
wrapper.appendChild(mainEl);
|
||||
console.log("[viewMode] wrapper créé, <main> encapsulé");
|
||||
} else {
|
||||
console.warn("[viewMode] <main> introuvable, wrapper ajouté à <body>");
|
||||
document.body.appendChild(wrapper);
|
||||
}
|
||||
}
|
||||
|
||||
// Créer la sidebar si elle n'existe pas, et la mettre EN PREMIER dans le wrapper
|
||||
let sidebar = document.getElementById("horizontal-sidebar");
|
||||
if (!sidebar) {
|
||||
sidebar = document.createElement("aside");
|
||||
sidebar.id = "horizontal-sidebar";
|
||||
sidebar.className = "horizontal-sidebar";
|
||||
wrapper.insertBefore(sidebar, wrapper.firstChild);
|
||||
console.log("[viewMode] sidebar créée et insérée en tête du wrapper");
|
||||
} else if (sidebar.parentNode !== wrapper) {
|
||||
// Sidebar existe ailleurs, on la remet dans le wrapper
|
||||
wrapper.insertBefore(sidebar, wrapper.firstChild);
|
||||
}
|
||||
|
||||
// Traitement spécial : .date-nav (classe, pas id)
|
||||
// v2026.5.37 : en vue horizontale, on décompose .date-nav pour :
|
||||
// - Mettre btn-today en haut
|
||||
// - Intercaler app-clock entre btn-today et date-custom
|
||||
// - Grouper les 2 flèches dans un wrapper #sidebar-arrows pour qu'elles
|
||||
// soient côte à côte et même largeur
|
||||
const dateNav = document.querySelector(".date-nav");
|
||||
if (dateNav) {
|
||||
_memorizeOriginalParent(dateNav);
|
||||
sidebar.appendChild(dateNav);
|
||||
console.log("[viewMode] déplacé dans sidebar : .date-nav");
|
||||
|
||||
// Créer le wrapper des flèches si pas déjà fait, et y mettre prev + next
|
||||
let arrowsWrap = document.getElementById("sidebar-arrows");
|
||||
if (!arrowsWrap) {
|
||||
arrowsWrap = document.createElement("div");
|
||||
arrowsWrap.id = "sidebar-arrows";
|
||||
sidebar.appendChild(arrowsWrap);
|
||||
console.log("[viewMode] wrapper flèches #sidebar-arrows créé");
|
||||
}
|
||||
const prevBtn = document.getElementById("nav-prev");
|
||||
const nextBtn = document.getElementById("nav-next");
|
||||
if (prevBtn && !arrowsWrap.contains(prevBtn)) {
|
||||
_memorizeOriginalParent(prevBtn);
|
||||
arrowsWrap.appendChild(prevBtn);
|
||||
}
|
||||
if (nextBtn && !arrowsWrap.contains(nextBtn)) {
|
||||
_memorizeOriginalParent(nextBtn);
|
||||
arrowsWrap.appendChild(nextBtn);
|
||||
}
|
||||
}
|
||||
|
||||
// Pour chaque ID listé, trouver et déplacer
|
||||
for (const id of ids) {
|
||||
if (id === "date-nav") continue; // déjà traité
|
||||
const el = document.getElementById(id);
|
||||
if (!el) {
|
||||
console.log(`[viewMode] élément #${id} introuvable (optionnel) — skip`);
|
||||
continue;
|
||||
}
|
||||
_memorizeOriginalParent(el);
|
||||
sidebar.appendChild(el);
|
||||
console.log(`[viewMode] déplacé dans sidebar : #${id}`);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* v2026.5.36 : restaure chaque élément à son parent d'origine (mémorisé dans
|
||||
* data-orig-parent). Utilisé quand on revient en vue classique.
|
||||
*/
|
||||
function _restoreElementsToTopbar(ids) {
|
||||
// v2026.5.37 : d'abord remettre les flèches dans .date-nav (avant de
|
||||
// restaurer .date-nav à son parent d'origine), puis supprimer le wrapper
|
||||
// #sidebar-arrows.
|
||||
const dateNav = document.querySelector(".date-nav");
|
||||
const prevBtn = document.getElementById("nav-prev");
|
||||
const nextBtn = document.getElementById("nav-next");
|
||||
if (dateNav && prevBtn && !dateNav.contains(prevBtn)) {
|
||||
// Remettre prev en premier dans date-nav
|
||||
dateNav.insertBefore(prevBtn, dateNav.firstChild);
|
||||
}
|
||||
if (dateNav && nextBtn && !dateNav.contains(nextBtn)) {
|
||||
// Remettre next après date-custom-wrapper (position d'origine) :
|
||||
// l'ordre d'origine est [prev, date-custom-wrapper, next, today].
|
||||
const dateCustomWrap = dateNav.querySelector(".date-custom-wrapper");
|
||||
if (dateCustomWrap && dateCustomWrap.nextSibling) {
|
||||
dateNav.insertBefore(nextBtn, dateCustomWrap.nextSibling);
|
||||
} else {
|
||||
dateNav.appendChild(nextBtn);
|
||||
}
|
||||
}
|
||||
// Supprimer le wrapper des flèches (normalement vide maintenant)
|
||||
const arrowsWrap = document.getElementById("sidebar-arrows");
|
||||
if (arrowsWrap) {
|
||||
arrowsWrap.remove();
|
||||
console.log("[viewMode] wrapper #sidebar-arrows supprimé");
|
||||
}
|
||||
|
||||
// Restaurer .date-nav à son parent d'origine
|
||||
if (dateNav) _restoreToOriginalParent(dateNav, ".date-nav");
|
||||
|
||||
for (const id of ids) {
|
||||
if (id === "date-nav") continue;
|
||||
const el = document.getElementById(id);
|
||||
if (!el) continue;
|
||||
_restoreToOriginalParent(el, "#" + id);
|
||||
}
|
||||
|
||||
// Supprimer la sidebar si elle existe et est vide
|
||||
const sidebar = document.getElementById("horizontal-sidebar");
|
||||
if (sidebar && sidebar.children.length === 0) {
|
||||
sidebar.remove();
|
||||
console.log("[viewMode] sidebar supprimée (vide)");
|
||||
}
|
||||
|
||||
// Sortir <main> du wrapper et supprimer le wrapper
|
||||
const wrapper = document.getElementById("horizontal-wrapper");
|
||||
if (wrapper) {
|
||||
const mainEl = wrapper.querySelector("#main");
|
||||
if (mainEl && wrapper.parentNode) {
|
||||
wrapper.parentNode.insertBefore(mainEl, wrapper);
|
||||
console.log("[viewMode] <main> restauré hors du wrapper");
|
||||
}
|
||||
wrapper.remove();
|
||||
console.log("[viewMode] wrapper supprimé");
|
||||
}
|
||||
}
|
||||
|
||||
function _memorizeOriginalParent(el) {
|
||||
if (el.dataset.origParent) return; // déjà mémorisé
|
||||
const parent = el.parentNode;
|
||||
if (!parent || !parent.id) {
|
||||
// Parent sans id : on mémorise par selector (parent tag + classes)
|
||||
let selector = parent.tagName.toLowerCase();
|
||||
if (parent.className) {
|
||||
const cls = parent.className.split(/\s+/)[0];
|
||||
if (cls) selector += "." + cls;
|
||||
}
|
||||
el.dataset.origParent = "SEL:" + selector;
|
||||
} else {
|
||||
el.dataset.origParent = "ID:" + parent.id;
|
||||
}
|
||||
// Mémoriser aussi l'index d'origine pour restaurer l'ordre
|
||||
const siblings = Array.from(parent.children);
|
||||
el.dataset.origIndex = String(siblings.indexOf(el));
|
||||
}
|
||||
|
||||
function _restoreToOriginalParent(el, label) {
|
||||
const orig = el.dataset.origParent;
|
||||
if (!orig) {
|
||||
console.log(`[viewMode] ${label} n'a pas de parent d'origine mémorisé — skip`);
|
||||
return;
|
||||
}
|
||||
let parent = null;
|
||||
if (orig.startsWith("ID:")) {
|
||||
parent = document.getElementById(orig.substring(3));
|
||||
} else if (orig.startsWith("SEL:")) {
|
||||
parent = document.querySelector(orig.substring(4));
|
||||
}
|
||||
if (!parent) {
|
||||
console.warn(`[viewMode] parent d'origine pour ${label} introuvable (orig=${orig})`);
|
||||
return;
|
||||
}
|
||||
// Insérer à l'index d'origine si possible
|
||||
const idx = parseInt(el.dataset.origIndex || "0", 10);
|
||||
const refChild = parent.children[idx] || null;
|
||||
if (refChild && refChild !== el) {
|
||||
parent.insertBefore(el, refChild);
|
||||
} else {
|
||||
parent.appendChild(el);
|
||||
}
|
||||
console.log(`[viewMode] restauré à ${orig} : ${label}`);
|
||||
}
|
||||
|
||||
// v5.0.0 : horloge HH:MM au milieu de la topbar. Mise à jour toutes les 30s
|
||||
@@ -7596,24 +7839,34 @@ function _reducePinnedPopup(popup) {
|
||||
|
||||
// Créer la pastille dock
|
||||
// v2026.5.18 : le fond de la pastille prend la couleur de catégorie
|
||||
// (via la classe color-XXX déjà utilisée ailleurs dans le CSS)
|
||||
// v2026.5.19 : pastille à 2 lignes — ref (gras) + date origine (petit)
|
||||
// v2026.5.25 : pastille à 3 lignes — lieu (fort), service (petit), date (petit)
|
||||
// La référence est affichée dans le mini-menu au survol.
|
||||
const pill = document.createElement("button");
|
||||
pill.type = "button";
|
||||
pill.className = "pinned-popup-dock-pill color-" + colorKey;
|
||||
pill.title = "Cliquer pour agrandir";
|
||||
|
||||
const pillRef = document.createElement("span");
|
||||
pillRef.className = "pinned-popup-dock-pill-ref";
|
||||
pillRef.textContent = label;
|
||||
pill.appendChild(pillRef);
|
||||
// Ligne 1 : lieu (ou ref si pas de lieu)
|
||||
const pillLieu = document.createElement("span");
|
||||
pillLieu.className = "pinned-popup-dock-pill-lieu";
|
||||
pillLieu.textContent = popup.dataset.lieu || label || "—";
|
||||
pill.appendChild(pillLieu);
|
||||
|
||||
// Date d'origine (ex: "21.04")
|
||||
// Ligne 2 : service (2 dernières parties)
|
||||
const serviceTxt = popup.dataset.service || "";
|
||||
if (serviceTxt) {
|
||||
const pillService = document.createElement("span");
|
||||
pillService.className = "pinned-popup-dock-pill-service";
|
||||
pillService.textContent = serviceTxt;
|
||||
pill.appendChild(pillService);
|
||||
}
|
||||
|
||||
// Ligne 3 : date "Mardi 22.04"
|
||||
const originDate = popup.dataset.originDate || "";
|
||||
if (originDate) {
|
||||
const pillDate = document.createElement("span");
|
||||
pillDate.className = "pinned-popup-dock-pill-date";
|
||||
pillDate.textContent = _formatDateShort(originDate);
|
||||
pillDate.textContent = _formatDateForPill(originDate);
|
||||
pill.appendChild(pillDate);
|
||||
}
|
||||
|
||||
@@ -7632,12 +7885,18 @@ function _reducePinnedPopup(popup) {
|
||||
popup._linkedPill = pill;
|
||||
|
||||
pill.addEventListener("click", (e) => {
|
||||
// v2026.5.23 : si on était en train de drag, ne pas déclencher le clic
|
||||
if (pill._justDragged) {
|
||||
pill._justDragged = false;
|
||||
return;
|
||||
}
|
||||
e.stopPropagation();
|
||||
_restorePinnedPopupFromDock(popup);
|
||||
});
|
||||
|
||||
// v2026.5.20 : mini-menu au survol (Agrandir / Fermer)
|
||||
pill.addEventListener("mouseenter", () => {
|
||||
if (pill._dragging) return; // pas de menu pendant le drag
|
||||
_showPillHoverMenu(pill, popup);
|
||||
});
|
||||
pill.addEventListener("mouseleave", (e) => {
|
||||
@@ -7645,6 +7904,9 @@ function _reducePinnedPopup(popup) {
|
||||
_schedulePillMenuClose();
|
||||
});
|
||||
|
||||
// v2026.5.23 : drag & drop — réordonne dans le dock, ou restaure hors du dock
|
||||
_attachPillDragHandler(pill, popup);
|
||||
|
||||
dock.appendChild(pill);
|
||||
dock.classList.add("visible");
|
||||
|
||||
@@ -7680,6 +7942,15 @@ function _showPillHoverMenu(pill, popup) {
|
||||
menu._linkedPill = pill;
|
||||
menu._linkedPopup = popup;
|
||||
|
||||
// v2026.5.25 : REF en haut du menu (info seulement, centrée)
|
||||
const refText = popup.dataset.ref || "";
|
||||
if (refText) {
|
||||
const refLabel = document.createElement("div");
|
||||
refLabel.className = "pill-hover-menu-ref";
|
||||
refLabel.textContent = refText;
|
||||
menu.appendChild(refLabel);
|
||||
}
|
||||
|
||||
const restoreBtn = document.createElement("button");
|
||||
restoreBtn.type = "button";
|
||||
restoreBtn.className = "pill-hover-menu-btn";
|
||||
@@ -7791,15 +8062,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;
|
||||
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; // si popup plus large que viewport
|
||||
|
||||
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
|
||||
|
||||
@@ -7821,6 +8103,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.
|
||||
@@ -7842,6 +8303,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).
|
||||
@@ -8216,6 +8695,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 });
|
||||
@@ -8363,6 +8867,7 @@ function bindTooltipInteractions() {
|
||||
}
|
||||
|
||||
function buildTooltipHTML(iv) {
|
||||
if (!iv) return '<dl><dt>Info</dt><dd>—</dd></dl>';
|
||||
const i = iv.infobulle || {};
|
||||
const rows = [];
|
||||
|
||||
@@ -8561,10 +9066,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) {}
|
||||
}
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
|
||||
Reference in New Issue
Block a user