Compare commits

..

3 Commits

Author SHA1 Message Date
FroSteel 7e497de40e Version 2026.5.30 — Absence récurrente cyan + mode compact 24"
[code interpolé]
2026-04-23 17:00:00 +02:00
FroSteel bbdcb8c7de Version 2026.5.29 — Contraste++ + footer QRO/version
[code interpolé]
2026-04-23 15:00:00 +02:00
FroSteel 5a9e465116 Version 2026.5.28 — Ajustements visuels absences
- Retrait pastille .tech-name-dot, 'Maladie/Accident', popups 520px fixe
[code interpolé]
2026-04-23 13:00:00 +02:00
3 changed files with 137 additions and 52 deletions
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"manifest_version": 3, "manifest_version": 3,
"name": "Planification", "name": "Planification",
"version": "2026.5.27", "version": "2026.5.30",
"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": {
+17 -12
View File
@@ -2512,11 +2512,12 @@ header.topbar::before {
/* Breakpoint medium : entre 1000 et 1300px, on compacte un peu */ /* Breakpoint medium : entre 1000 et 1300px, on compacte un peu */
@media (max-width: 1300px) { @media (max-width: 1300px) {
.app-clock-date { font-size: 11px; } .app-clock-date { font-size: 18px; }
.app-clock-time { font-size: 20px; } .app-clock-time { font-size: 18px; }
.app-clock-date::after { font-size: 20px; }
.topbar-right .btn-action .btn-action-label, .topbar-right .btn-action .btn-action-label,
.topbar-right .btn-refresh .btn-refresh-label { .topbar-right .btn-refresh .btn-refresh-label {
font-size: 12px; font-size: 13px;
} }
} }
@@ -2524,10 +2525,10 @@ header.topbar::before {
et on réduit encore l'horloge. Les icônes restent, titres restent. */ et on réduit encore l'horloge. Les icônes restent, titres restent. */
@media (max-width: 1000px) { @media (max-width: 1000px) {
.topbar { padding: 8px 14px; gap: 8px; } .topbar { padding: 8px 14px; gap: 8px; }
.topbar h1 { font-size: 16px; } .topbar h1 { font-size: 18px; }
.app-clock { font-size: smaller; } .app-clock-date { font-size: 16px; }
.app-clock-date { font-size: 10px; } .app-clock-time { font-size: 16px; }
.app-clock-time { font-size: 18px; } .app-clock-date::after { font-size: 18px; }
.btn-action .btn-action-label, .btn-action .btn-action-label,
.btn-refresh .btn-refresh-label { .btn-refresh .btn-refresh-label {
display: none; display: none;
@@ -2618,14 +2619,18 @@ header.topbar::before {
v2026.5.19 : refonte — élément .pinned-popup-minref créé à la volée v2026.5.19 : refonte — élément .pinned-popup-minref créé à la volée
v2026.5.21 : agrandi pour que la ref tienne sans déborder v2026.5.21 : agrandi pour que la ref tienne sans déborder
v2026.5.22 : encore agrandi + plus d'espace entre dragbar et topbar v2026.5.22 : encore agrandi + plus d'espace entre dragbar et topbar
v2026.5.23 : refonte complète en style "onglet" single-line, compact
========================================================================== */ ========================================================================== */
.pinned-popup.pinned-popup-minimized { .pinned-popup.pinned-popup-minimized {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
min-width: 300px !important; min-width: 300px !important;
max-width: 360px !important; max-width: 400px !important;
width: 300px !important; width: auto !important;
height: auto !important; height: 36px !important;
min-height: 80px !important; min-height: 36px !important;
padding: 44px 16px 16px 16px !important; padding: 0 6px 0 4px !important;
overflow: visible; overflow: visible;
background: var(--bg-elevated) !important; background: var(--bg-elevated) !important;
border: 1px solid var(--border) !important; border: 1px solid var(--border) !important;
+119 -39
View File
@@ -4855,8 +4855,22 @@ function buildCard(tech, isoDate) {
showTooltip(e, ivCopy, card); showTooltip(e, ivCopy, card);
}); });
card.addEventListener("mouseleave", () => { card.addEventListener("mouseleave", () => {
if (_isHorizontalView()) return;
hideTooltip(); hideTooltip();
}); });
// Hover sur le badge (Congé / Maladie/Accident / Absent) : actif
// SEULEMENT en vue horizontale.
const badgeEl = card.querySelector(".card-tech-badge");
if (badgeEl) {
badgeEl.addEventListener("mouseenter", (e) => {
if (!_isHorizontalView()) return; // bloqué en classique
showTooltip(e, ivCopy, badgeEl);
});
badgeEl.addEventListener("mouseleave", () => {
if (!_isHorizontalView()) return;
hideTooltip();
});
}
} }
} }
@@ -5102,19 +5116,42 @@ function getStatusClass(iv) {
} }
function bindTimelinePopover(el) { function bindTimelinePopover(el) {
el.addEventListener("mouseenter", (e) => showTimelinePopover(e, el)); // v2026.5.33 : en vue horizontale, les interactions sont différentes :
// - hover : ouvre directement la GRANDE popup (pas la petite)
// - clic : ouvre la fiche EasyVista dans un nouvel onglet
// En vue classique, le comportement existant est conservé :
// - hover : petite popup qui suit la souris
// - clic simple : grande popup persistante
// - double-clic : fiche EasyVista nouvel onglet
// - Ctrl+clic : fiche EasyVista en arrière-plan
const _isHorizontalView = () => document.documentElement.classList.contains("view-horizontal");
el.addEventListener("mouseenter", (e) => {
if (_isHorizontalView()) {
// Grande popup directement en vue horizontale
if (el.dataset.ivIdx !== undefined) {
openPersistentTimelinePopup(el);
}
} else {
showTimelinePopover(e, el);
}
});
// v4.2.3 : la petite popup timeline SUIT la souris (différent de la grande // v4.2.3 : la petite popup timeline SUIT la souris (différent de la grande
// popup des lignes d'intervention qui est ancrée). On n'utilise pas // popup des lignes d'intervention qui est ancrée). On n'utilise pas
// moveTooltip() (no-op depuis v4.1.12) mais une fonction dédiée. // moveTooltip() (no-op depuis v4.1.12) mais une fonction dédiée.
el.addEventListener("mousemove", (e) => moveTimelineTooltip(e)); el.addEventListener("mousemove", (e) => {
el.addEventListener("mouseleave", hideTooltip); if (!_isHorizontalView()) {
moveTimelineTooltip(e);
}
});
el.addEventListener("mouseleave", () => {
if (!_isHorizontalView()) {
hideTooltip();
}
// En vue horizontale, la grande popup est persistante donc on ne ferme
// pas au mouseleave (l'user peut interagir avec).
});
// v4.2.3 : clic / double-clic / Ctrl+clic sur un segment timeline
// - clic simple : ferme la petite popup et ouvre la GRANDE popup
// (ancrée juste en dessous de la timeline, persistante pour permettre
// de sélectionner du texte / copier)
// - double-clic : ouvre la fiche EasyVista dans un nouvel onglet actif
// - Ctrl+clic (Cmd+clic sur Mac) : ouvre dans un onglet en arrière-plan
const kind = el.dataset.kind; const kind = el.dataset.kind;
const ivIdxStr = el.dataset.ivIdx; const ivIdxStr = el.dataset.ivIdx;
// Seulement sur les segments avec une interventoin (pas les "hole" libres // Seulement sur les segments avec une interventoin (pas les "hole" libres
@@ -5123,6 +5160,17 @@ function bindTimelinePopover(el) {
let singleClickTimer = null; let singleClickTimer = null;
el.addEventListener("click", (e) => { el.addEventListener("click", (e) => {
// v2026.5.33 : en vue horizontale, tout clic simple = ouvrir la fiche EV
if (_isHorizontalView()) {
e.preventDefault();
e.stopPropagation();
// Ctrl/Cmd/middle → arrière-plan, sinon nouvel onglet actif
const background = !!(e.ctrlKey || e.metaKey || e.button === 1);
openInterventionFromTimeline(el, { background });
return;
}
// Vue classique (inchangé) :
// Ctrl / Cmd / molette → ouvrir fiche en arrière-plan // Ctrl / Cmd / molette → ouvrir fiche en arrière-plan
if (e.ctrlKey || e.metaKey || e.button === 1) { if (e.ctrlKey || e.metaKey || e.button === 1) {
e.preventDefault(); e.preventDefault();
@@ -5140,34 +5188,48 @@ function bindTimelinePopover(el) {
}, 250); }, 250);
}); });
el.addEventListener("dblclick", (e) => { el.addEventListener("dblclick", (e) => {
// Annuler le clic simple en attente // En vue horizontale le clic simple fait déjà l'ouverture, le dblclick
// devient inutile — on le laisse par sécurité (comportement idem).
if (singleClickTimer) { clearTimeout(singleClickTimer); singleClickTimer = null; } if (singleClickTimer) { clearTimeout(singleClickTimer); singleClickTimer = null; }
if (_isHorizontalView()) return;
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
openInterventionFromTimeline(el, { background: false }); openInterventionFromTimeline(el, { background: false });
}); });
} }
// v4.2.3 : positionne la petite popup timeline à côté du curseur /**
* v4.2.3 : positionne la petite popup timeline à côté du curseur.
* Utilisée UNIQUEMENT en vue classique pour la petite popup qui suit la souris
* quand on survole un segment timeline (informations courtes : durée, ref).
*
* v2026.5.34 : documentation + logs. Le clamp dans le viewport reste local
* (pas unifié avec positionTooltipAnchored car la logique "suit-souris" est
* fondamentalement différente d'un ancrage fixe à une source).
*
* @param {MouseEvent} e - événement souris pour position courante
*/
function moveTimelineTooltip(e) { function moveTimelineTooltip(e) {
const tip = tooltipEl(); const tip = tooltipEl();
if (!tip || !tip.classList.contains("visible")) return; if (!tip || !tip.classList.contains("visible")) return;
// La popup ancrée (grande bulle) ne doit pas être déplacée par la souris // La popup ancrée (grande bulle) ne doit pas être déplacée par la souris
if (bulleState.pinned) return; if (bulleState.pinned) return;
// Si la popup affiche une grande bulle d'intervention (classe pinned-like), // Si la popup affiche une grande bulle d'intervention (mode anchored),
// on ne la bouge pas non plus : on la laisse ancrée. // on ne la bouge pas non plus : on la laisse ancrée.
if (tip.dataset.mode === "anchored") return; if (tip.dataset.mode === "anchored") return;
const offsetX = 14, offsetY = 16; const offsetX = 14, offsetY = 16;
let x = e.clientX + offsetX; let x = e.clientX + offsetX;
let y = e.clientY + offsetY; let y = e.clientY + offsetY;
const rect = tip.getBoundingClientRect(); const rect = tip.getBoundingClientRect();
// Ajuster si on sort de la fenêtre
if (x + rect.width > window.innerWidth - 8) x = e.clientX - rect.width - offsetX; // Ajuster si on sort de la fenêtre (logique simple : flip autour du curseur)
if (x + rect.width > window.innerWidth - 8) x = e.clientX - rect.width - offsetX;
if (y + rect.height > window.innerHeight - 8) y = e.clientY - rect.height - offsetY; if (y + rect.height > window.innerHeight - 8) y = e.clientY - rect.height - offsetY;
if (x < 4) x = 4; if (x < 4) x = 4;
if (y < 4) y = 4; if (y < 4) y = 4;
// v4.2.4 : utiliser setTooltipViewportPosition pour bénéficier de la
// détection automatique fixed/abs (et donc de la stabilité au scroll). // setTooltipViewportPosition gère la détection auto fixed vs abs.
setTooltipViewportPosition(x, y); setTooltipViewportPosition(x, y);
} }
@@ -5201,19 +5263,46 @@ function findIvByActionId(actionId) {
// v4.2.3/4 : ouvre la GRANDE popup au clic sur un segment timeline, ancrée // v4.2.3/4 : ouvre la GRANDE popup au clic sur un segment timeline, ancrée
// juste en dessous du segment. Pas épinglée : se ferme sur clic ailleurs, // juste en dessous du segment. Pas épinglée : se ferme sur clic ailleurs,
// Échap, OU quand la souris quitte la popup elle-même (mouseleave). // Échap, OU quand la souris quitte la popup elle-même (mouseleave).
// v4.2.3/4 : ouvre la GRANDE popup au clic sur un segment timeline (vue
// classique) ou au hover (vue horizontale). Ancrée à côté du segment, pas
// sur. Se ferme au clic ailleurs.
//
// v2026.5.34 : utilise positionTooltipAnchored() unifié au lieu de recalculer
// sa propre position. Plus de code dupliqué.
function openPersistentTimelinePopup(el) { function openPersistentTimelinePopup(el) {
if (!el) {
console.warn("[persistentTimeline] segment el null — abandon");
return;
}
const ivIdx = el.dataset.ivIdx; const ivIdx = el.dataset.ivIdx;
if (ivIdx === undefined) return; if (ivIdx === undefined) {
console.log("[persistentTimeline] segment sans ivIdx (hole/absence vide) — abandon");
return;
}
const cardEl = el.closest(".card"); const cardEl = el.closest(".card");
if (!cardEl) return; if (!cardEl) {
console.warn("[persistentTimeline] pas de .card parent trouvée");
return;
}
const row = cardEl.querySelector(`.intervention-v2[data-iv-idx="${ivIdx}"]`); const row = cardEl.querySelector(`.intervention-v2[data-iv-idx="${ivIdx}"]`);
if (!row) return; if (!row) {
console.warn(`[persistentTimeline] row intervention-v2[data-iv-idx="${ivIdx}"] introuvable`);
return;
}
const actionId = row.dataset.actionId; const actionId = row.dataset.actionId;
const iv = findIvByActionId(actionId); const iv = findIvByActionId(actionId);
if (!iv) return; if (!iv) {
console.warn(`[persistentTimeline] iv pour actionId=${actionId} introuvable`);
return;
}
const tip = tooltipEl(); const tip = tooltipEl();
if (!tip) return; if (!tip) {
console.warn("[persistentTimeline] tooltipEl() null");
return;
}
console.log(`[persistentTimeline] ouverture grande popup pour iv actionId=${actionId}`);
// Nettoyer tout état précédent (ancrage, épinglage, timers) // Nettoyer tout état précédent (ancrage, épinglage, timers)
bulleState.pinned = false; bulleState.pinned = false;
@@ -5226,29 +5315,20 @@ function openPersistentTimelinePopup(el) {
tip.innerHTML = buildTooltipHTML(iv); tip.innerHTML = buildTooltipHTML(iv);
tip.classList.remove("hidden"); tip.classList.remove("hidden");
tip.classList.add("visible"); tip.classList.add("visible");
// mode "anchored" : le hover ne doit pas la remplacer par une autre popup // mode "anchored" : le hover timeline ne doit pas la remplacer par la petite popup
tip.dataset.mode = "anchored"; tip.dataset.mode = "anchored";
state.currentTooltipIv = iv; state.currentTooltipIv = iv;
// Position : juste sous le segment timeline. D'abord on reset les coords // v2026.5.34 : utiliser positionTooltipAnchored() unifié, en préférant
// pour que getBoundingClientRect() reflète la vraie taille du nouveau // dessous (sous le segment timeline) via opts.anchorBelow = true.
// contenu. //
// D'abord on reset les coords pour que le tipRect soit correctement mesuré
// avec le nouveau contenu.
tip.style.left = "-9999px"; tip.style.left = "-9999px";
tip.style.top = "0px"; tip.style.top = "0px";
// Forcer un reflow pour que tipRect soit à jour avec le nouveau contenu // Force reflow
const tipRect = tip.getBoundingClientRect(); void tip.offsetWidth;
const r = el.getBoundingClientRect(); positionTooltipAnchored(el, { anchorBelow: true });
let x = r.left;
let y = r.bottom + 8;
if (x + tipRect.width > window.innerWidth - 8) x = window.innerWidth - tipRect.width - 8;
if (x < 4) x = 4;
if (y + tipRect.height > window.innerHeight - 8) {
y = r.top - tipRect.height - 8;
}
if (y < 4) y = 4;
// Positionner proprement (avec détection auto fixed vs abs)
setTooltipViewportPosition(x, y);
} }
function showTimelinePopover(e, el) { function showTimelinePopover(e, el) {