Skip to content

Commit b28c3e2

Browse files
cbrousseau1cbrousseau1
committed
draft: sauvegarde intermédiaire 2
1 parent d67f5b5 commit b28c3e2

File tree

8 files changed

+266
-73
lines changed

8 files changed

+266
-73
lines changed

‎_includes/components/page_switcher.njk‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,38 @@
11
{% if navLinks %}
22
{% set flatNav = navLinks | flattenNav %}
3+
{% set activeUrl = eleventyNavigation.sidemenuActive or page.url %}
4+
{% set activeKey = activeUrl | replace('/', '') %}
35
{% set currentIndex = -1 %}
46
{% for item in flatNav %}
5-
{% if item.url == page.url %}
6-
{% set currentIndex = loop.index0 %}
7+
{% if currentIndex == -1 %}
8+
{% set itemKey = (item.url or '') | replace('/', '') %}
9+
{% if itemKey == activeKey %}
10+
{% set currentIndex = loop.index0 %}
11+
{% endif %}
712
{% endif %}
813
{% endfor %}
14+
{% if currentIndex == -1 and activeUrl != page.url %}
15+
{% set fallbackKey = page.url | replace('/', '') %}
16+
{% for item in flatNav %}
17+
{% if currentIndex == -1 %}
18+
{% set itemKey = (item.url or '') | replace('/', '') %}
19+
{% if itemKey == fallbackKey %}
20+
{% set currentIndex = loop.index0 %}
21+
{% endif %}
22+
{% endif %}
23+
{% endfor %}
24+
{% endif %}
925
{% if currentIndex > 0 %}
1026
{% set previousPage = flatNav[currentIndex - 1] %}
1127
{% else %}
1228
{% set previousPage = null %}
1329
{% endif %}
14-
{% if currentIndex < (flatNav | length) - 1 %}
30+
{% if currentIndex != -1 and currentIndex < (flatNav | length) - 1 %}
1531
{% set nextPage = flatNav[currentIndex + 1] %}
1632
{% else %}
1733
{% set nextPage = null %}
1834
{% endif %}
19-
{% if (previousPage or nextPage)
20-
and eleventyNavigation.nav != "main" %}
35+
{% if (previousPage or nextPage) and eleventyNavigation.nav != "main" %}
2136
<div class="page-switcher fr-pt-6w fr-mt-14v" data-pagefind-ignore>
2237
{% if previousPage %}
2338
<p class="fr-mb-0 previous-page">

‎_includes/components/tabnav.njk‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{% if not tabnav %}
2+
{% set tabnav = params %}
3+
{% endif %}
4+
<div class="dsfr-doc-tab-navigation">
5+
<div class="fr-sidemenu" data-fr-js-sidemenu-actionee="true">
6+
<div class="fr-sidemenu__inner">
7+
<button aria-expanded="false" aria-controls="dsfr-doc-tab-navigation--collapse" type="button" class="fr-sidemenu__btn" data-fr-js-collapse-button="true">
8+
{# Affiche le titre de l'onglet actif, sinon le premier onglet #}
9+
{% if tabnav.items and (tabnav.items | length) > 0 %}
10+
{% set activeTab = tabnav.items | selectattr('active') | first %}
11+
{{ activeTab.title if activeTab else tabnav.items[0].title }}
12+
{% else %}
13+
Dans cette rubrique
14+
{% endif %}
15+
</button>
16+
<div class="fr-collapse" id="dsfr-doc-tab-navigation--collapse" data-fr-js-collapse="true">
17+
<ul>
18+
{% for item in tabnav.items %}
19+
<li>
20+
{% if item.active %}
21+
<div aria-current="page" class="dsfr-doc-tab-navigation__tab">
22+
{{ item.title }}
23+
</div>
24+
{% else %}
25+
<a class="dsfr-doc-tab-navigation__tab" href="{{ item.url }}">
26+
{{ item.title }}
27+
</a>
28+
{% endif %}
29+
</li>
30+
{% endfor %}
31+
</ul>
32+
</div>
33+
</div>
34+
</div>
35+
</div>

‎_includes/layouts/partenaire_article.njk‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,10 +59,12 @@ layout: layouts/base.njk
5959
{% endif %}
6060
</div>
6161
</div>
62-
{% if eleventyNavigation.parent != parentInfo.title %}
62+
{% if eleventyNavigation.parent and eleventyNavigation.parent != parentInfo.title %}
6363
<h2 class="fr-mt-2v">{{ eleventyNavigation.parent }}</h2>
64+
<h3 class="fr-mt-2v">{{ title }}</h3>
65+
{% else %}
66+
<h2 class="fr-mt-2v">{{ title }}</h2>
6467
{% endif %}
65-
<h3 class="fr-mt-2v">{{ title }}</h3>
6668
{{ content | safe }}
6769
{% include "components/page_switcher.njk" %}
6870
</div>

‎_includes/templates/sidemenu.njk‎

Lines changed: 97 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -9,56 +9,56 @@
99
</div>
1010
<ul class="fr-sidemenu__list">
1111
{% for link in navLinks %}
12-
{% set linkUrl = link.url | locale_url(lang) %}
13-
{% set level2Id = 'sidemenu-2-' ~ loop.index0 %}
14-
<li class="fr-sidemenu__item">
15-
{% if not link.children | length %}
16-
<a class="fr-sidemenu__link" href={{ linkUrl }} {% if linkUrl == page.url %} aria-current="page"{% endif %}>
12+
{% if not link.sidemenuActive %}
13+
{% set parentIdx = loop.index0 %}
14+
{% set level2Id = 'sidemenu-2-' ~ parentIdx %}
15+
<li class="fr-sidemenu__item">
16+
{% if not link.children | length %}
17+
<a class="fr-sidemenu__link" href={{ link.url | locale_url(lang) }} {% if link.url == page.url %} aria-current="page"{% endif %}>
1718
{{ link.title }}
1819
</a>
19-
{% else %}
20-
<button class="fr-sidemenu__btn" aria-expanded="false" aria-controls={{ level2Id }} data-url={{ linkUrl }}>
20+
{% else %}
21+
<button class="fr-sidemenu__btn" aria-expanded="false" aria-controls="{{ level2Id }}" data-url="{{ link.url | locale_url(lang) }}">
2122
{{ link.title }}
2223
</button>
2324
<div class="fr-collapse" id="{{ level2Id }}">
2425
<ul class="fr-sidemenu__list">
25-
{% for sublink in link.children %}
26-
{% set sublinkUrl = sublink.url | locale_url(lang) or sublink.externalUrl %}
27-
{% set level3Id = 'sidemenu-3-' ~ loop.parent.loop.index0 ~ '-' ~ loop.index0 %}
28-
<li class="fr-sidemenu__item">
29-
{% if not sublink.children | length %}
26+
{% for sublink in link.children %}
27+
{% set level3Id = 'sidemenu-3-' ~ parentIdx ~ '-' ~ loop.index0 %}
28+
<li class="fr-sidemenu__item">
29+
{% if not sublink.children | length %}
30+
<a class="fr-sidemenu__link"
31+
href="{{ sublink.url | locale_url(lang) or sublink.externalUrl }}"
32+
{% if sublink.externalUrl %} target="_blank" rel="noopener"{% endif %}
33+
{% if sublink.url == page.url %} aria-current="page"{% endif %}>
34+
{{ sublink.title }}
35+
</a>
36+
{% else %}
37+
<button class="fr-sidemenu__btn" aria-expanded="false" aria-controls="{{ level3Id }}" data-url="{{ sublink.url | locale_url(lang) or sublink.externalUrl }}">
38+
{{ sublink.title }}
39+
</button>
40+
<div class="fr-collapse" id="{{ level3Id }}">
41+
<ul class="fr-sidemenu__list">
42+
{% for subsublink in sublink.children %}
43+
<li class="fr-sidemenu__item">
3044
<a class="fr-sidemenu__link"
31-
href="{{ sublinkUrl }}"
32-
{% if sublink.externalUrl %} target="_blank" rel="noopener"{% endif %}
33-
{% if sublinkUrl == page.url %} aria-current="page"{% endif %}>
34-
{{ sublink.title }}
45+
href="{{ subsublink.url | locale_url(lang) or subsublink.externalUrl }}"
46+
{% if subsublink.externalUrl %} target="_blank" rel="noopener"{% endif %}
47+
{% if subsublink.url == page.url %} aria-current="page"{% endif %}>
48+
{{ subsublink.title }}
3549
</a>
36-
{% else %}
37-
<button class="fr-sidemenu__btn" aria-expanded="false" aria-controls={{ level3Id }} data-url={{ sublinkUrl }}>
38-
{{ sublink.title }}
39-
</button>
40-
<div class="fr-collapse" id={{ level3Id }}>
41-
<ul class="fr-sidemenu__list">
42-
{% for subsublink in sublink.children %}
43-
{% set subsublinkUrl = subsublink.url | locale_url(lang) or subsublink.externalUrl %}
44-
<li class="fr-sidemenu__item">
45-
<a class="fr-sidemenu__link"
46-
href="{{ subsublinkUrl }}"
47-
{% if subsublink.externalUrl %} target="_blank" rel="noopener"{% endif %}
48-
{% if subsublinkUrl == page.url %} aria-current="page"{% endif %}>
49-
{{ subsublink.title }}
50-
</a>
51-
</li>
52-
{% endfor %}
53-
</ul>
54-
</div>
55-
{% endif %}
56-
</li>
57-
{% endfor %}
50+
</li>
51+
{% endfor %}
52+
</ul>
53+
</div>
54+
{% endif %}
55+
</li>
56+
{% endfor %}
5857
</ul>
5958
</div>
60-
{% endif %}
61-
</li>
59+
{% endif %}
60+
</li>
61+
{% endif %}
6262
{% endfor %}
6363
</ul>
6464
</div>
@@ -67,50 +67,86 @@
6767

6868
<script>
6969
(() => {
70-
const currentPath = window.location.pathname;
70+
const normalize = (p) => {
71+
if (!p) return "";
72+
p = String(p).trim();
73+
try { p = new URL(p, location.origin).pathname; } catch(e) {}
74+
75+
if (p.length > 1 && p.endsWith("/")) p = p.slice(0, -1);
76+
if (p && !p.startsWith("/")) p = "/" + p;
77+
return p;
78+
};
79+
80+
const hrefPath = (el) => normalize(el.getAttribute("href") || el.href || "");
81+
82+
const currentPath = normalize(location.pathname);
83+
const sidemenuActive = normalize("{{ eleventyNavigation.sidemenuActive or '' }}");
84+
85+
const links = [...document.querySelectorAll(".fr-sidemenu__link")];
86+
const buttons = [...document.querySelectorAll(".fr-sidemenu__btn[data-url]")];
87+
88+
const activeParentBtn = buttons.find(btn =>
89+
normalize(btn.dataset.url) === currentPath
90+
);
91+
92+
let activeLink = null;
93+
94+
if (sidemenuActive) {
95+
activeLink = links.find(a => hrefPath(a) === sidemenuActive);
96+
}
97+
98+
if (!activeLink) {
99+
activeLink = links.find(a => hrefPath(a) === currentPath);
100+
}
101+
102+
if (activeParentBtn) {
103+
activeLink = null;
104+
}
71105
72106
function expandParents(element) {
73107
let parent = element.closest(".fr-collapse");
74108
while (parent) {
75-
if (parent.id === "fr-sidemenu-wrapper") {
76-
break;
77-
}
78-
const toggleButton = parent.previousElementSibling;
79-
if (toggleButton?.classList.contains("fr-sidemenu__btn")) {
80-
toggleButton.setAttribute("aria-expanded", "true");
109+
if (parent.id === "fr-sidemenu-wrapper") break;
110+
111+
const toggle = parent.previousElementSibling;
112+
if (toggle?.classList.contains("fr-sidemenu__btn")) {
113+
toggle.setAttribute("aria-expanded", "true");
81114
parent.classList.add("fr-collapse--expanded");
82115
}
83116
parent = parent.parentElement.closest(".fr-collapse");
84117
}
85118
}
86119
87-
const activeLink = [...document.querySelectorAll('.fr-sidemenu__link')]
88-
.find(link => currentPath.endsWith(link.getAttribute("href")));
120+
document.querySelectorAll(".fr-sidemenu__link[aria-current]")
121+
.forEach(l => l.removeAttribute("aria-current"));
89122
90123
if (activeLink) {
91124
activeLink.setAttribute("aria-current", "page");
92125
expandParents(activeLink);
93126
}
94127
95-
const activeBtn = [...document.querySelectorAll('.fr-sidemenu__btn')]
96-
.find(btn => currentPath.endsWith(btn.dataset.url));
128+
else if (activeParentBtn) {
129+
activeParentBtn.setAttribute("aria-expanded", "true");
97130
98-
if (activeBtn) {
99-
activeBtn.setAttribute("aria-expanded", "true");
100-
const panel = activeBtn.nextElementSibling;
131+
const panel = activeParentBtn.nextElementSibling;
101132
if (panel?.classList.contains("fr-collapse")) {
102133
panel.classList.add("fr-collapse--expanded");
103134
}
104-
expandParents(activeBtn);
135+
136+
activeParentBtn.classList.add("fr-sidemenu__btn--current");
137+
138+
expandParents(activeParentBtn);
105139
}
106140
107-
document
108-
.querySelectorAll(".fr-sidemenu__link")
109-
.forEach(link => link.addEventListener("click", (e) => {
141+
links.forEach((link) => {
142+
link.addEventListener("click", (e) => {
110143
document
111-
.querySelectorAll(".fr-sidemenu__link")
112-
.forEach(l => l.removeAttribute("aria-current"));
144+
.querySelectorAll(".fr-sidemenu__link[aria-current]")
145+
.forEach((l) => l.removeAttribute("aria-current"));
146+
113147
e.currentTarget.setAttribute("aria-current", "page");
114-
}));
148+
});
149+
});
150+
115151
})();
116152
</script>

‎content/fr/partenaires/ign.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ layout: layouts/partenaire_accueil.njk
77
tags:
88
- IGNF
99
image:
10-
path: /img/partenaires/ign.png
10+
path: /img/partenaires/ign/ign.png
1111
alt: Logo IGN
1212
pictogram: custom/ign.png
1313
tileTag:

‎content/fr/partenaires/ign/imagerie/decouverte-imagerie.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,12 @@ eleventyNavigation:
77
order: 1
88
nav: ign
99
---
10+
11+
{% from "components/component.njk" import component with context %}
12+
13+
{% set tabnavLinks = [
14+
{ title: "Présentation", active: true },
15+
{ title: "Choisir mon produit", url: "./produit-imagerie" }
16+
] %}
17+
18+
{{ component("tabnav", { items: tabnavLinks }) }}

‎content/fr/partenaires/ign/imagerie/decouverte-imagerie/produit-imagerie.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
---
2+
title: Découverte de l’offre produit
3+
eleventyNavigation:
4+
nav: ign
5+
sidemenuActive: /fr/partenaires/ign/imagerie/decouverte-imagerie
6+
---
7+
8+
{% from "components/component.njk" import component with context %}
9+
10+
{% set tabnavLinks = [
11+
{ title: "Présentation", url: "../" },
12+
{ title: "Choisir mon produit", active: true }
13+
] %}
14+
15+
{{ component("tabnav", { items: tabnavLinks }) }}
16+
17+
:::info Page en cours de rédaction
18+
Cette page sera complétée prochainement.
19+
:::

0 commit comments

Comments
 (0)