From 06785d712c0ca1b917348d96e5c3e6b4335d27d8 Mon Sep 17 00:00:00 2001 From: Julie Blanc Date: Sat, 14 Feb 2026 16:53:14 +0100 Subject: [PATCH 1/5] deplace corps report to investigation-summary --- assets/css/style.css | 38 +- assets/css/template/_report.scss | 4 +- assets/js/report.js | 135 ---- .../pages/investigation-summary.yml | 29 +- site/blueprints/pages/report.yml | 54 -- site/templates/investigation-summary.php | 171 ++++-- site/templates/report-backup.php | 580 ------------------ site/templates/report.php | 230 ------- 8 files changed, 145 insertions(+), 1096 deletions(-) delete mode 100644 assets/js/report.js delete mode 100644 site/blueprints/pages/report.yml delete mode 100644 site/templates/report-backup.php delete mode 100644 site/templates/report.php diff --git a/assets/css/style.css b/assets/css/style.css index 38b7cb0..f6a30f9 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -2857,23 +2857,23 @@ main .page__header .description-medium { gap: calc(var(--spacing) * 0.25); } -.report__content { +.investigation__content { margin-top: calc(var(--spacing) * 4); } -.report__content .section-content { +.investigation__content .section-content { padding-left: calc(var(--padding-body) * 1.5); padding-right: calc(var(--padding-body) * 1.5); margin-bottom: calc(var(--spacing) * 6); } -.report__content .section-content:target { +.investigation__content .section-content:target { padding-top: calc(var(--header-h) + var(--spacing) * 2); } @media screen and (max-width: 768px) { - .report__content .section-content:target { + .investigation__content .section-content:target { padding-top: calc(var(--header-h) + var(--spacing) * 0.5); } } -.report__content .section-title { +.investigation__content .section-title { max-width: var(--max-w-content); margin-inline: auto; margin-bottom: calc(var(--spacing) * 2); @@ -2883,11 +2883,11 @@ main .page__header .description-medium { max-width: var(--max-w-content); color: var(--color-accent); } -.report__content .section-txt { +.investigation__content .section-txt { max-width: var(--max-w-content); margin-inline: auto; } -.report__content .subsection-w-media { +.investigation__content .subsection-w-media { display: grid; grid-template-columns: 1fr 1fr; gap: var(--padding-body); @@ -2895,7 +2895,7 @@ main .page__header .description-medium { margin-top: calc(var(--spacing) * 2); position: relative; } -.report__content .subsection-w-media .media { +.investigation__content .subsection-w-media .media { margin-inline: auto; max-width: var(--max-w-content); padding-left: var(--padding-inner); @@ -2904,39 +2904,39 @@ main .page__header .description-medium { top: calc(var(--header-h) + var(--spacing)); align-self: start; } -.report__content .subsection-txt { +.investigation__content .subsection-txt { min-height: calc(100vh - var(--header-h)); max-width: var(--max-w-content); padding-left: var(--padding-inner); padding-right: var(--padding-inner); padding-bottom: calc(var(--spacing) * 6); } -.report__content .subsection-w-hscroll { +.investigation__content .subsection-w-hscroll { position: relative; margin-bottom: calc(var(--spacing) * 4); } -.report__content .subsection-w-hscroll .horizontal-scroll { +.investigation__content .subsection-w-hscroll .horizontal-scroll { height: 100vh; width: 100vw; overflow: hidden; display: flex; align-items: center; } -.report__content .subsection-w-hscroll .horizontal-scroll-wrapper { +.investigation__content .subsection-w-hscroll .horizontal-scroll-wrapper { display: flex; flex-wrap: nowrap; will-change: transform; } -.report__content .subsection-w-hscroll .horizontal-scroll-slide { +.investigation__content .subsection-w-hscroll .horizontal-scroll-slide { flex-shrink: 0; width: 90vw; max-width: 700px; padding: 0 calc(var(--spacing) * 1); } -.report__content .subsection-w-hscroll .horizontal-scroll-slide figure, .report__content .subsection-w-hscroll .horizontal-scroll-slide img { +.investigation__content .subsection-w-hscroll .horizontal-scroll-slide figure, .investigation__content .subsection-w-hscroll .horizontal-scroll-slide img { width: 100%; } -.report__content .subsection-w-hscroll .horizontal-scroll-pagination { +.investigation__content .subsection-w-hscroll .horizontal-scroll-pagination { position: fixed; bottom: calc(var(--spacing) * 2); left: 50%; @@ -2945,17 +2945,17 @@ main .page__header .description-medium { gap: 8px; z-index: 10; } -.report__content p { +.investigation__content p { margin: calc(var(--spacing) * 0.75) 0; } -.report__content ul { +.investigation__content ul { padding-left: 3ch; } -.report__content ul li { +.investigation__content ul li { margin: calc(var(--spacing) * 0.5) 0; } -.report__content:target { +.investigation__content:target { padding-top: calc(var(--header-h) * 2 + var(--spacing)) !important; } diff --git a/assets/css/template/_report.scss b/assets/css/template/_report.scss index 4d94e34..08ae9d7 100644 --- a/assets/css/template/_report.scss +++ b/assets/css/template/_report.scss @@ -225,7 +225,7 @@ -.report__content { +.investigation__content { margin-top: calc(var(--spacing) * 4); @@ -351,7 +351,7 @@ } } -.report__content:target { +.investigation__content:target { padding-top: calc(var(--header-h)*2 + var(--spacing)) !important; } diff --git a/assets/js/report.js b/assets/js/report.js deleted file mode 100644 index c7f60d1..0000000 --- a/assets/js/report.js +++ /dev/null @@ -1,135 +0,0 @@ - -import { initSwipers } from './swipers.js'; - -export function report(responsiveSmall) { - if (document.body.dataset.template === 'report') { - - // Initialiser tous les sliders de type before-after - initSliderBeforeAfter(); - - initHorizontalScroll(); - - // Ne fonctionne que pour les écrans plus grands que responsiveSmall - if (window.matchMedia(responsiveSmall).matches) { - // Sur mobile : initialiser les swipers normalement car initMediaDisplay ne sera pas actif - initSwipers(); - return; - } - - - } -} - - -function initSliderBeforeAfter(container = document){ - const slidersBeforeAfter = container.querySelectorAll('.slider-before-after'); - slidersBeforeAfter.forEach(function (sliderContainer, index) { - const sliderInput = sliderContainer.querySelector('.slider'); - if (sliderInput) { - sliderInput.addEventListener('input', (e) => { - console.log('slider value:', e.target.value); - sliderContainer.style.setProperty('--position', `${e.target.value}%`); - }); - } - }); -} - - -function initHorizontalScroll(){ - const sections = document.querySelectorAll('.subsection-w-hscroll'); - - sections.forEach(function (section) { - const container = section.querySelector('.horizontal-scroll'); - if (!container) return; - - const wrapper = container.querySelector('.horizontal-scroll-wrapper'); - if (!wrapper) return; - - const slides = wrapper.querySelectorAll('.horizontal-scroll-slide'); - - // Calculer la distance totale à scroller horizontalement - function calculateScrollDistance() { - const totalSlidesWidth = Array.from(slides).reduce((acc, slide) => acc + slide.offsetWidth, 0); - const endMargin = window.innerWidth * 0.3; // 30vw de marge à la fin - return totalSlidesWidth - window.innerWidth + endMargin; - } - - let scrollDistance = calculateScrollDistance(); - - // Créer un spacer invisible qui crée l'espace de scroll - // Hauteur = scrollDistance + hauteur du viewport pour maintenir le texte en dessous - const spacer = document.createElement('div'); - spacer.className = 'horizontal-scroll-spacer'; - spacer.style.height = `${scrollDistance + window.innerHeight}px`; - spacer.style.width = '100%'; - spacer.style.pointerEvents = 'none'; - - // Insérer le spacer AVANT .horizontal-scroll - section.insertBefore(spacer, container); - - // Calculer la position absolue du spacer une seule fois - function getSpacerTopPosition() { - let element = spacer; - let top = 0; - while (element) { - top += element.offsetTop; - element = element.offsetParent; - } - return top; - } - - let spacerTopPosition = getSpacerTopPosition(); - - // Fonction de mise à jour du scroll horizontal - function updateHorizontalScroll() { - const scrollY = window.pageYOffset || document.documentElement.scrollTop; - - // Début et fin du scroll basé sur le spacer - const scrollStart = spacerTopPosition; - const scrollEnd = spacerTopPosition + scrollDistance; - - console.log('scrollY:', scrollY, 'scrollStart:', scrollStart, 'scrollEnd:', scrollEnd); - - if (scrollY >= scrollStart && scrollY <= scrollEnd) { - // Phase de scroll horizontal : fixer le container - const progress = (scrollY - scrollStart) / scrollDistance; - const translateX = progress * scrollDistance; - - console.log('Horizontal scroll active - progress:', progress); - - wrapper.style.transform = `translateX(-${translateX}px)`; - container.style.position = 'fixed'; - container.style.top = '0'; - container.style.left = '0'; - } else if (scrollY < scrollStart) { - // Avant le spacer : reset - console.log('Before spacer'); - wrapper.style.transform = 'translateX(0)'; - container.style.position = ''; - container.style.top = ''; - container.style.left = ''; - } else { - // Après le spacer : garder le translate final et défixer - console.log('After spacer'); - wrapper.style.transform = `translateX(-${scrollDistance}px)`; - container.style.position = ''; - container.style.top = ''; - container.style.left = ''; - } - } - - // Écouter le scroll - window.addEventListener('scroll', updateHorizontalScroll, { passive: true }); - - // Recalculer au resize - window.addEventListener('resize', function() { - scrollDistance = calculateScrollDistance(); - spacer.style.height = `${scrollDistance + window.innerHeight}px`; - spacerTopPosition = getSpacerTopPosition(); - updateHorizontalScroll(); - }); - - // Initial call - updateHorizontalScroll(); - }); -} \ No newline at end of file diff --git a/site/blueprints/pages/investigation-summary.yml b/site/blueprints/pages/investigation-summary.yml index 69a4c34..2e71d96 100644 --- a/site/blueprints/pages/investigation-summary.yml +++ b/site/blueprints/pages/investigation-summary.yml @@ -67,23 +67,20 @@ tabs: width: 1/3 when: heroType: video - synthesis: - label: Synthèse - type: writer - size: large - headings: - - 4 - nodes: + body: + label: Corps + type: layout + layouts: + - "1/1" + - "1/2, 1/2" + fieldsets: - heading - - bulletlist - - orderedlist - marks: - - bold - - italic - - underline - - link - - '|' - - clear + - text + - image + - beforeafter + - video + # - horizontal-gallery + - gallery metadataTab: label: Métadonnées icon: table diff --git a/site/blueprints/pages/report.yml b/site/blueprints/pages/report.yml deleted file mode 100644 index b7c1f9d..0000000 --- a/site/blueprints/pages/report.yml +++ /dev/null @@ -1,54 +0,0 @@ -title: Investigation -create: - fields: - - subtitle - -tabs: - contentTab: - label: Contenu - icon: page - columns: - - width: 1/4 - fields: - created: - label: Première publication - type: date - display: DD / MM / YYYY - default: today - width: 1/2 - authors: - label: Auteur(s) - type: text - placeholder: INDEX Investigation - default: INDEX Investigation - cover: - label: Visuel de couverture - type: files - multiple: false - min: 1 - required: true - layout: cards - size: full - image: - ratio: 12/7 - cover: true - - width: 3/4 - fields: - subtitle: - label: Sous-titre - type: text - body: - label: Corps - type: layout - layouts: - - "1/1" - - "1/2, 1/2" - fieldsets: - - heading - - text - - image - - beforeafter - - video - # - horizontal-gallery - - gallery - seo: seo/page diff --git a/site/templates/investigation-summary.php b/site/templates/investigation-summary.php index c5a6800..1e9f053 100644 --- a/site/templates/investigation-summary.php +++ b/site/templates/investigation-summary.php @@ -28,60 +28,6 @@ $report = $page->children()->filterBy('intendedTemplate', 'report')->first(); - - - -