From bd993ea6cac509c434c1570109f6121b22c68784 Mon Sep 17 00:00:00 2001 From: Ruben Date: Thu, 26 Feb 2026 21:40:56 +0100 Subject: [PATCH] Increase petition map animation duration to 30 seconds Add lazy initialization for petition map Update documentation with new positioning guidance Note full-width section rendering behavior --- custom/assets/petition-map.js | 2 +- custom/plugins/page/petiton-map.docs.md | 7 +++++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/custom/assets/petition-map.js b/custom/assets/petition-map.js index 358c7a3..db79afa 100644 --- a/custom/assets/petition-map.js +++ b/custom/assets/petition-map.js @@ -292,7 +292,7 @@ [allDots[i], allDots[j]] = [allDots[j], allDots[i]]; } - const duration = 6000; // ms total animation window + const duration = 30000; // ms total animation window const msPerDot = Math.max(1, duration / Math.max(1, allDots.length)); allDots.forEach((dot, i) => { diff --git a/custom/plugins/page/petiton-map.docs.md b/custom/plugins/page/petiton-map.docs.md index bb90614..21d2f67 100644 --- a/custom/plugins/page/petiton-map.docs.md +++ b/custom/plugins/page/petiton-map.docs.md @@ -10,12 +10,14 @@ In a page's `metadata.ini` (must also have petition-form loaded first): plugins = "petition-form, petition-map" ``` -Embed in a content file (e.g. `85-kart.php`): +Embed in a content file (e.g. `90-form.php`, between the form and the signatures list): ```php ``` +The plugin renders a `
` which breaks out of the content grid to fill the full page width. + ## Architecture ``` @@ -87,7 +89,8 @@ petition-map.js (client-side) - **Point placement**: rejection sampling within fylke polygon bounding box, ray-casting point-in-polygon test, 4% edge inset - **Label rendering**: `L.tooltip({ permanent: true })` bound to invisible zero-size `L.marker` in a custom `dots` pane (z-index 450) -- **Initial animation**: all labels shuffled (Fisher-Yates) and staggered over 4.5s +- **Lazy init**: map initialises only when `#petition-map` enters the viewport (IntersectionObserver, 10% threshold); falls back to immediate init on older browsers +- **Initial animation**: all labels shuffled (Fisher-Yates) and staggered over 6s - **Polling**: fetches data JSON every 60s with cache-bust timestamp; new signers added immediately - **Fylke interaction**: hover highlights polygon, click shows popup with fylke name + count