territories-dashboard-lib 0.1.38__py3-none-any.whl → 1.1.1.dev10__py3-none-any.whl

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/anchor.mjs

@@ -0,0 +1,43 @@
+function enableAnchorLinks() {
+    document.querySelectorAll("button.anchor-link").forEach((button) => {
+        button.addEventListener("click", () => {
+            const anchor = button.dataset.anchor;
+            window.history.replaceState(undefined, undefined, "#" + anchor);
+            navigator.clipboard.writeText(window.location.href);
+            setTimeout(() => {
+                // to close the tooltip and not trigger it again when reloading the URL
+                button.parentElement.click();
+            }, 500);
+        });
+    });
+}
+
+function trackAnchorLinks() {
+    const buttons = document.querySelectorAll('button[data-track="true"]');
+    if (buttons.length === 0) return;
+
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach((entry) => {
+            if (entry.isIntersecting) {
+                fetch("/api/tracking/event/", {
+                    method: "POST",
+                    body: JSON.stringify({
+                        indicator: entry.target.dataset.indicator,
+                        event: "vue-resume-indicateur",
+                    }),
+                });
+                observer.unobserve(entry.target);
+            }
+        });
+    });
+
+    window.addEventListener(
+        "scroll",
+        () => {
+            buttons.forEach((button) => observer.observe(button));
+        },
+        { once: true }
+    );
+}
+
+export { enableAnchorLinks, trackAnchorLinks };

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/comparaison/page.mjs

@@ -2,10 +2,12 @@
 import { callData, getSearchParams } from "./data.mjs";
 import { delaySpinner, getClosestIndicator } from "../dom.mjs";
 import { handleFilterClick, initializeFilters } from "../filters.mjs";
-import { addSidePanelListener, openMethodoSidePanel } from "../side_panel.mjs";
+import { addSidePanelListener } from "../side_panel.mjs";
 
 import { exportImageAsync } from "../export-graph.mjs";
 import { exportToCSV } from "../export.mjs";
+import { enableAnchorLinks, trackAnchorLinks } from "../anchor.mjs";
+import { trackVisibleIndicators } from "../track-visible-indicators.mjs";
 
 Chart.register(
     Chart.CategoryScale,
@@ -43,14 +45,6 @@ document.querySelectorAll(".indicator-card").forEach((indicatorCard) => {
             callData(indicator);
         });
     });
-
-    indicatorCard
-        .querySelectorAll('button[aria-controls="slide-panel-methodo"]')
-        .forEach((button) => {
-            button.addEventListener("click", () => {
-                openMethodoSidePanel(indicator, button);
-            });
-        });
 });
 
 document
@@ -105,3 +99,7 @@ document.addEventListener("DOMContentLoaded", () => {
     });
     addSidePanelListener();
 });
+
+enableAnchorLinks();
+trackAnchorLinks();
+trackVisibleIndicators();

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/details/page.mjs

@@ -7,7 +7,7 @@ import {
     updateFiltersReminder,
     updateUrlWithFilters,
 } from "../filters.mjs";
-import { addSidePanelListener, openMethodoSidePanel } from "../side_panel.mjs";
+import { addSidePanelListener } from "../side_panel.mjs";
 
 import { exportImageAsync } from "../export-graph.mjs";
 import { exportToCSV } from "../export.mjs";
@@ -33,12 +33,7 @@ initializeFilters(indicator);
 callData(indicator);
 makeMap(indicator);
 makeSankeyGraph(indicator);
-const openMethodoButton = document.querySelector(
-    'button[aria-controls="slide-panel-methodo"]'
-);
-openMethodoButton.addEventListener("click", () => {
-    openMethodoSidePanel(indicator, openMethodoButton);
-});
+
 document.querySelectorAll(".filter-tag").forEach((button) => {
     button.addEventListener("click", async () => {
         await handleFilterClick(indicator);

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/dom.mjs

@@ -1,17 +1,3 @@
-function fillMethodoSidePanel(indicator) {
-    const container = document.getElementById(
-        "slide-panel-content-methodo-markdown"
-    );
-    container.innerHTML = indicator.methodo_html;
-    const exportButton = document.getElementById("methodo-export-button");
-    exportButton.dataset.indicatorName = indicator.name;
-    exportButton.dataset.indicatorTitle = indicator.title;
-    document.getElementById("slide-panel-methodo-indicator-title").textContent =
-        indicator.title;
-    document.getElementById("slide-panel-methodo-theme-title").textContent =
-        indicator.theme;
-}
-
 function getClosestIndicator(element) {
     const indicatorId = element.closest(".indicator-card").dataset.indicator;
     return JSON.parse(document.getElementById(indicatorId).textContent);
@@ -81,7 +67,6 @@ function delaySpinner() {
 export {
     delaySpinner,
     getClosestIndicator,
-    fillMethodoSidePanel,
     makeIndicatorDataScript,
     getIndicatorDataScript,
     getIsAlternativeUnit,

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/enums.mjs

@@ -2,11 +2,12 @@ const THOUSANDS = "k";
 const MILLIONS = "M";
 
 const MeshLevel = {
-    National: "fr",
-    Region: "reg",
-    Department: "dep",
-    Epci: "epci",
-    Town: "com",
+    fr: "fr",
+    reg: "reg",
+    dep: "dep",
+    epci: "epci",
+    com: "com",
+    aom: "aom",
 };
 
 const COLORS = {
@@ -76,16 +77,18 @@ const PATTERNS = [
 
 function getMeshLevelTitle(meshLevel) {
     switch (meshLevel) {
-        case MeshLevel.Region:
+        case MeshLevel.reg:
             return "Région";
-        case MeshLevel.Department:
+        case MeshLevel.dep:
             return "Département";
-        case MeshLevel.Epci:
+        case MeshLevel.epci:
             return "Intercommunalité";
-        case MeshLevel.Town:
+        case MeshLevel.com:
             return "Commune";
-        case MeshLevel.National:
+        case MeshLevel.fr:
             return "France entière";
+        case MeshLevel.aom:
+            return "AOM";
     }
 }
 

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/side_panel.mjs

@@ -1,22 +1,13 @@
-import { fillMethodoSidePanel } from "./dom.mjs";
-
 let buttonWhichOpenedPanel = null;
 
 function closeSidePanel() {
     const sidePanelGeo = document.getElementById("slide-panel-geo");
-    const sidePanelMethodo = document.getElementById("slide-panel-methodo");
     sidePanelGeo.classList.remove("tdbmd-slide-panel--show");
-    sidePanelMethodo.classList.remove("tdbmd-slide-panel--show");
     if (sidePanelGeo.style.display === "block") {
         setTimeout(() => {
             sidePanelGeo.style.display = "none";
         }, 500);
     }
-    if (sidePanelMethodo.style.display === "block") {
-        setTimeout(() => {
-            sidePanelMethodo.style.display = "none";
-        }, 500);
-    }
     document.querySelectorAll(".validate-territory-btn").forEach((btn) => {
         delete btn.dataset.comparison;
     });
@@ -73,11 +64,6 @@ function releaseFocusTrap() {
     document.removeEventListener("keydown", focusTrapListener);
 }
 
-function openMethodoSidePanel(indicator, button) {
-    fillMethodoSidePanel(indicator);
-    openSidePanel(button, "methodo");
-}
-
 function addSidePanelListener() {
     const button = document.querySelector(
         'button[aria-controls="slide-panel-geo"][data-comparison="false"]'
@@ -100,4 +86,4 @@ function addSidePanelListener() {
         });
 }
 
-export { openMethodoSidePanel, addSidePanelListener };
+export { addSidePanelListener };

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/theme/page.mjs

@@ -13,7 +13,7 @@ import {
     handleFilterClick,
     initializeFilters,
 } from "../filters.mjs";
-import { addSidePanelListener, openMethodoSidePanel } from "../side_panel.mjs";
+import { addSidePanelListener } from "../side_panel.mjs";
 
 import { exportImageAsync } from "../export-graph.mjs";
 import { exportToCSV } from "../export.mjs";
@@ -21,6 +21,8 @@ import { exportToCSV } from "../export.mjs";
 import { updateHistoryDOM } from "./history.mjs";
 import { updateMainValueDOM } from "./main-value.mjs";
 import { updateStatisticsDOM } from "./statistics.mjs";
+import { enableAnchorLinks, trackAnchorLinks } from "../anchor.mjs";
+import { trackVisibleIndicators } from "../track-visible-indicators.mjs";
 
 Chart.register(
     Chart.CategoryScale,
@@ -117,14 +119,6 @@ document.querySelectorAll(".indicator-card").forEach((indicatorCard) => {
             toggleIndicatorUnit(event.target);
         });
     });
-
-    indicatorCard
-        .querySelectorAll('button[aria-controls="slide-panel-methodo"]')
-        .forEach((button) => {
-            button.addEventListener("click", () => {
-                openMethodoSidePanel(indicator, button);
-            });
-        });
 });
 
 document.addEventListener("DOMContentLoaded", () => {
@@ -162,3 +156,7 @@ document
             button.removeAttribute("disabled");
         });
     });
+
+enableAnchorLinks();
+trackAnchorLinks();
+trackVisibleIndicators();

territories_dashboard_lib/website_lib/static/territories_dashboard_lib/website/js/pages/indicators/track-visible-indicators.mjs

@@ -0,0 +1,121 @@
+function trackVisibleIndicators() {
+    // Track the most visible card over time
+    let currentMostVisibleId = null;
+    let mostVisibleCounter = 0;
+    let lastTrackedIndicator = null;
+    const REQUIRED_CONSECUTIVE_CHECKS = 3; // 3 seconds at 1 check per second
+
+    function resetTracking() {
+        currentMostVisibleId = null;
+        mostVisibleCounter = 0;
+    }
+
+    function fetchTracking(indicatorId) {
+        fetch("/api/tracking/event/", {
+            method: "POST",
+            body: JSON.stringify({
+                indicator: indicatorId,
+                event: "attention-sur-resume-indicateur",
+            }),
+        });
+    }
+
+    function getMostVisibleIndicatorCard() {
+        const indicatorCards = document.querySelectorAll(".indicator-card");
+        const visibilityData = [];
+
+        indicatorCards.forEach((card, index) => {
+            const rect = card.getBoundingClientRect();
+            const windowHeight =
+                window.innerHeight || document.documentElement.clientHeight;
+            const windowWidth =
+                window.innerWidth || document.documentElement.clientWidth;
+
+            // Calculate the visible portion of the card
+            const visibleTop = Math.max(0, rect.top);
+            const visibleBottom = Math.min(windowHeight, rect.bottom);
+            const visibleLeft = Math.max(0, rect.left);
+            const visibleRight = Math.min(windowWidth, rect.right);
+
+            // Calculate visible area (only if card is actually visible)
+            const visibleHeight = Math.max(0, visibleBottom - visibleTop);
+            const visibleWidth = Math.max(0, visibleRight - visibleLeft);
+            const visibleArea = visibleHeight * visibleWidth;
+
+            // Calculate total card area
+            const totalArea = rect.width * rect.height;
+
+            const visibilityRatio = visibleArea / totalArea;
+
+            let isVisible = visibleArea > 0;
+            // Check if visible area is at least 20% of total area
+            if (visibilityRatio < 0.2) {
+                isVisible = false;
+            }
+            // 40% for the first card
+            if (index == 0 && visibilityRatio < 0.4) {
+                isVisible = false;
+            }
+            if (isVisible) {
+                visibilityData.push({
+                    card,
+                    visibleArea,
+                    totalArea,
+                });
+            }
+        });
+
+        // No visible cards - reset tracking
+        if (visibilityData.length === 0) {
+            resetTracking();
+            return;
+        }
+
+        // Sort by visible area (descending)
+        visibilityData.sort((a, b) => b.visibleArea - a.visibleArea);
+
+        const mostVisible = visibilityData[0];
+
+        // Check if there are other visible cards and if the most visible is at least twice as visible
+        if (visibilityData.length > 1) {
+            const secondMostVisible = visibilityData[1];
+            if (mostVisible.visibleArea < 2 * secondMostVisible.visibleArea) {
+                resetTracking();
+                return;
+            }
+        }
+
+        const indicatorId = mostVisible.card.getAttribute("data-indicator");
+
+        // Check if it's the same card as before
+        if (indicatorId === currentMostVisibleId) {
+            mostVisibleCounter++;
+
+            // Add the class only after 3 consecutive seconds
+            if (
+                mostVisibleCounter >= REQUIRED_CONSECUTIVE_CHECKS &&
+                indicatorId !== lastTrackedIndicator
+            ) {
+                fetchTracking(indicatorId);
+                lastTrackedIndicator = indicatorId;
+            }
+        } else {
+            // Different card - reset counter
+            currentMostVisibleId = indicatorId;
+            mostVisibleCounter = 1;
+        }
+    }
+
+    // Start tracking only after first scroll
+    window.addEventListener(
+        "scroll",
+        () => {
+            setInterval(() => {
+                getMostVisibleIndicatorCard();
+            }, 1000);
+        },
+        { once: true }
+    );
+}
+
+export { trackVisibleIndicators };