corrigé les pbs sur les encarts + ajouts d'un style de photos + fonts fonctionnent sur chromium

README.md

@@ -52,13 +52,18 @@ saut de ligne dans texte libre (à la fin de chaque ligne) : `<br>`
 
 `[latour]`
 
+`[latour_nohead]`
+
 `[lampe]`
 
+`[lampe_nohead]`
+
 `[bibliographie]`
 
 ### IMAGES
 
 `[imgsmall]`
+`[imgsmall_bottom]`
 ![imgsmall](screenshots/smallimg.png)
 
 `[fullpage2imgs]`
@@ -94,6 +99,11 @@ saut de ligne dans texte libre (à la fin de chaque ligne) : `<br>`
 `[imgfullspreadright_bleed]`
 ![imgfullspreadright_bleed](screenshots/imgfullspreadright_bleed.png)
 
+`[doublepage_bigleft]`
+![doublepage_bigleft](screenshots/doublepage_bigleft.png)
+
+`[doublepage_bigright]`
+
 ### BREAK-PAGE
 
 Pas d'élément avant le bloc : `[breakbefore][/breakbefore]`

user/data/feed/3a6d0284e743dc4a9b86f97d6dd1a3bf.yaml

@@ -1,4 +1,4 @@
-last_checked: 1689988930
+last_checked: 1690072671
 data:
   -
     title: 'macOS 13.0 Ventura Apache Setup: Upgrading Homebrew'
@@ -24,7 +24,7 @@ data:
     title: 'Big changes for Email plugin'
     url: 'https://getgrav.org/blog/new-email-plugin'
     date: 1665048600
-    nicetime: '9 months ago'
+    nicetime: '10 months ago'
   -
     title: 'Skeleton Build Automation'
     url: 'https://getgrav.org/blog/skeletons-build-automation'

user/data/notifications/3a6d0284e743dc4a9b86f97d6dd1a3bf.yaml

@@ -1,4 +1,4 @@
-last_checked: 1689988929
+last_checked: 1690085460
 data:
   feed:
     -

user/themes/carnet-atterrissage/css/mep_carnet.css

@@ -177,6 +177,10 @@ h4 {
   hyphens: auto;
 }
 
+.free {
+  margin-bottom: 12px;
+}
+
 .labeur p:before {
   content: '+ ';
   font-weight: bold;
@@ -196,20 +200,39 @@ h4 {
   padding-left: 3mm;
 }
 
-.latour, .lampe {
+.latour, .lampe,
+.latour_nohead, .lampe_nohead {
   font-family: 'Novel';
   font-weight: normal;
-  margin-top: 20mm;
+  margin-top: 0mm !important;
   margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
   margin-right: -16mm;
-  margin-bottom: 20mm;
+  margin-bottom: 0mm !important;
   line-height: 12pt;
   font-size: 8pt;
-  padding-right: 18mm;
+  padding-right: 23mm;
+  width: 142mm;
   padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  padding-bottom: 10mm;
+  padding-bottom: 8mm;
-  padding-top: 10mm;
+  padding-top: 8mm;
   background-color: beige;
+  max-height: 198mm;
+}
+
+.latour p:last-of-type,
+.lampe p:last-of-type,
+.latour_nohead p:last-of-type,
+.lampe_nohead p:last-of-type {
+  padding-bottom: 0;
+  margin-bottom: 0;
+}
+
+.latour ul, .latour ol,
+.lampe ul, .lampe ol,
+.latour_nohead ul, .latour_nohead ol,
+.lampe_nohead ul, .lampe_nohead ol {
+  padding-left: 0;
+  list-style-position: inside;
 }
 
 .encart-split {
@@ -218,20 +241,13 @@ h4 {
   background-color: beige;
 }
 
-.pagedjs_left_page .latour, .pagedjs_left_page .lampe {
+.pagedjs_left_page .latour, .pagedjs_left_page .lampe,
+.pagedjs_left_page .latour_nohead, .pagedjs_left_page .lampe_nohead {
   padding-right: 10mm;
   width: 128.375mm;
 }
 
-.latour[data-split-original="true"] {
+.encart-header {
-  padding-bottom: 1mm !important;
-}
-
-.latour[data-split-from] {
-  padding-top: 1mm !important;
-}
-
-.latour-header, .lampe-header {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -239,18 +255,12 @@ h4 {
   font-weight: bold;
 }
 
-.latour-header img:first-of-type,
+.encart-header img:first-of-type {
-.lampe-header img:first-of-type {
   margin-top: 1mm;
   margin-right: 2mm;
   width: 8mm;
 }
 
-.lampe {
-  padding-top: 3mm;
-  padding-bottom: 3mm;
-}
-
 .bibliographie {
   column-count: 2;
   column-gap: var(--guts);
@@ -264,11 +274,17 @@ img {
   width: 100%;
 }
 
-.imgsmall {
+.imgsmall,
+.imgsmall_bottom {
   padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
 }
 
-.imgsmall img {
+.imgsmall_bottom {
+  break-after: page;
+}
+
+.imgsmall img,
+.imgsmall_bottom img {
   width: 100%;
 }
 
@@ -329,10 +345,14 @@ img {
   width: calc(62.5% - 2mm);
 }
 
+
+
 .imgfullspreadleft,
 .imgfullspreadright,
 .imgfullspreadright_bleedtop,
-.imgfullspreadright_bleed {
+.imgfullspreadright_bleed,
+.doublepage_bigleft,
+.doublepage_bigright {
   break-before: left;
   break-after: left;
   width: 149mm;
@@ -409,3 +429,59 @@ img {
   width: auto;
   margin-left: -141mm;
 }
+
+
+.doublepage_bigleft,
+.doublepage_bigright {
+  height: 128mm !important;
+}
+
+.doublepage_bigleft img,
+.doublepage_bigright img {
+  height: 100%;
+  width: auto;
+}
+
+.overflow_bigimgleft,
+.overflow_bigimgright {
+  height: 128mm !important;
+}
+
+.overflow_bigimgleft {
+  margin-left: -157mm;
+}
+
+.overflow_bigimgright {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.doublepage_bigright img {
+  margin-left: 106mm;
+}
+
+.overflow_bigimgleft img,
+.overflow_bigimgright img {
+  height: 100%;
+  width: auto;
+}
+
+.dp_sm_img {
+  position: absolute;
+  width: calc((var(--pagedjs-pagebox-width) / var(--cols)) * 4);
+  height: 71mm !important;
+}
+
+.pagedjs_right_page .dp_sm_img {
+  right: 0;
+}
+
+.pagedjs_left_page .dp_sm_img {
+  left: 0;
+}
+
+.dp_sm_img img {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+}

user/themes/carnet-atterrissage/js/layout.js

@@ -43,9 +43,19 @@ class setMarginTexts extends Paged.Handler {
         }
         // images collées en bas
         let bottomImgs = document.querySelectorAll('.bottomimg, .tripleimgs_bottom, .tripleimgs2_bottom');
-        for (let i = 0; i < bottomImgs.length; i++) {
+        for (let bottomImg of bottomImgs) {
-            let page = bottomImgs[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
+            let pageBottom = bottomImg.closest('.pagedjs_area').getBoundingClientRect().bottom;
-            bottomImgs[i].style.transform = 'translateY(' + (page.getBoundingClientRect().bottom - bottomImgs[i].lastElementChild.getBoundingClientRect().bottom) + 'px)';
+            bottomImg.style.transform = 'translateY(' + (pageBottom - bottomImg.lastElementChild.getBoundingClientRect().bottom) + 'px)';
+        }
+        let bottomVignettes = document.querySelectorAll('.imgsmall_bottom'); // pour les images en bas dans les pages avec du texte
+        for (let bottomVignette of bottomVignettes) {
+            let pageBottom = bottomVignette.closest('.pagedjs_area').getBoundingClientRect().bottom;
+            let textBottom = bottomVignette.previousElementSibling.getBoundingClientRect().bottom;
+            let vignetteSize = bottomVignette.getBoundingClientRect().height;
+            if (bottomVignette.previousElementSibling.classList.contains('labeur')) {
+                bottomVignette.style.marginTop = `${(pageBottom - textBottom) - vignetteSize}px`;
+            }
+            bottomVignette.style.transform = 'translateY(12px)';
         }
         // éléments justifiés pas nécessaires
         let justifiedSplitEl = document.querySelectorAll("[data-align-last-split-element='justify']");
@@ -58,10 +68,10 @@ class setMarginTexts extends Paged.Handler {
             }
         }
         // images fullspread
-        let fullspreadEl = document.querySelectorAll('.imgfullspreadleft, .imgfullspreadright, .imgfullspreadright_bleedtop, .imgfullspreadright_bleed');
+        let fullspreadEl = document.querySelectorAll('.imgfullspreadleft, .imgfullspreadright, .imgfullspreadright_bleedtop, .imgfullspreadright_bleed, .doublepage_bigleft, .doublepage_bigright');
         for (let i = 0; i < fullspreadEl.length; i++) {
             let imgSrc = fullspreadEl[i].firstElementChild.getAttribute('src');
-            let nextPage = fullspreadEl[i].closest('.pagedjs_page').nextElementSibling.querySelectorAll('.pagedjs_page_content');
+            let nextPage = fullspreadEl[i].closest('.pagedjs_page').nextElementSibling.querySelector('.pagedjs_page_content');
             let imgOverflowEl = document.createElement('div');
             if (fullspreadEl[i].classList.contains('imgfullspreadleft')) {
                 imgOverflowEl.setAttribute('class', 'imgfullspreadleft-right');
@@ -71,18 +81,37 @@ class setMarginTexts extends Paged.Handler {
                 imgOverflowEl.setAttribute('class', 'imgfullspreadright_bleedtop-right');
             } else if (fullspreadEl[i].classList.contains('imgfullspreadright_bleed')) {
                 imgOverflowEl.setAttribute('class', 'imgfullspreadright_bleed-right');
+            } else if (fullspreadEl[i].classList.contains('doublepage_bigleft')) {
+                imgOverflowEl.setAttribute('class', 'overflow_bigimgleft');
+            } else if (fullspreadEl[i].classList.contains('doublepage_bigright')) {
+                imgOverflowEl.setAttribute('class', 'overflow_bigimgright');
             }
             let imgOverflow = document.createElement('img');
             imgOverflow.src = imgSrc;
             imgOverflowEl.append(imgOverflow);
-            nextPage[0].append(imgOverflowEl);
+            nextPage.append(imgOverflowEl);
             if (fullspreadEl[i].classList.contains('imgfullspreadright')
             || fullspreadEl[i].classList.contains('imgfullspreadright_bleedtop')
             || fullspreadEl[i].classList.contains('imgfullspreadright_bleed')) {
                 let imgMargin = imgOverflowEl.getBoundingClientRect().right - fullspreadEl[i].firstElementChild.getBoundingClientRect().right;
                 fullspreadEl[i].firstElementChild.style.marginLeft = imgMargin + 'px';
             }
+            if (fullspreadEl[i].classList.contains('doublepage_bigleft') || fullspreadEl[i].classList.contains('doublepage_bigright')) {
+                let smallImgSrc = fullspreadEl[i].lastElementChild.getAttribute('src');
+                fullspreadEl[i].lastElementChild.remove();
+                let smallImg = document.createElement('img');
+                smallImg.setAttribute('src', smallImgSrc);
+                let smallImgEl = document.createElement('div');
+                smallImgEl.classList.add('dp_sm_img');
+                smallImgEl.append(smallImg);
+                if (fullspreadEl[i].classList.contains('doublepage_bigleft')) {
+                    nextPage.append(smallImgEl);
+                } else {
+                    fullspreadEl[i].parentElement.append(smallImgEl);
+                }
+            }
         }
+
         // fullpage img page gauche
         let fullPageImg = document.getElementsByClassName('fullpageimage');
         for (let i = 0; i < fullPageImg.length; i++) {
@@ -91,54 +120,40 @@ class setMarginTexts extends Paged.Handler {
                 fullPageImg[i].style.marginLeft = '-22mm';
             }
         }
-        // encarts bleed
+        // encarts
-        let encarts = document.querySelectorAll('.latour, .lampe');
+        let encarts = document.querySelectorAll('.latour, .lampe, .latour_nohead, .lampe_nohead');
-        for (let i = 0; i < encarts.length; i++) {
+        for (let encart of encarts) {
-            if (encarts[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
+            if (encart.previousElementSibling != null) {
-            .classList.contains('pagedjs_right_page')) {
+                encart.style.marginTop = '10mm';
-                encarts[i].style.marginRight = '-22mm';
-                encarts[i].style.paddingRight = '22mm';
             }
-            if (encarts[i].hasAttribute('data-split-original')) {
+            if (encart.nextElementSibling != null) {
+                encart.style.marginBottom = '10mm';
+            }
+            
+            if (encart.hasAttribute('data-split-to')) {
                 let plainColor = document.createElement('div');
-                let plainHeight = encarts[i]
-                .parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
-                .getBoundingClientRect().bottom - encarts[i].getBoundingClientRect().bottom;
                 plainColor.setAttribute('class', 'encart-split');
-                if (encarts[i]
+                let plainHeight = encart.closest('.pagedjs_sheet').getBoundingClientRect().bottom - encart.getBoundingClientRect().bottom;
-                .parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
+                if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
-                .classList.contains('pagedjs_right_page')) {
                     plainColor.style.width = "149mm";
                 } else {
                     plainColor.style.width = "129mm";
                 }
-                plainColor.style.height = plainHeight + "px";
+                plainColor.style.height = `${plainHeight}px`;
-                encarts[i].parentNode.append(plainColor);
+                encart.parentNode.append(plainColor);
-            } else if (encarts[i].hasAttribute('data-split-from')) {
+            }
+
+            if (encart.hasAttribute('data-split-from')) {
                 let plainColor = document.createElement('div');
                 plainColor.setAttribute('class', 'encart-split');
-                if (encarts[i]
+                if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
-                .parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
-                .classList.contains('pagedjs_right_page')) {
                     plainColor.style.width = "149mm";
                 } else {
                     plainColor.style.width = "129mm";
                 }
                 plainColor.style.height = "22mm";
                 plainColor.style.top = "-22mm";
-                encarts[i].parentNode.prepend(plainColor);
+                encart.parentNode.prepend(plainColor);
-            }
-
-            if (encarts[i].previousElementSibling === null) {
-                encarts[i].style.marginTop = '0';
-                if (encarts[i].hasAttribute('data-split-original')) {
-                    encarts[i].parentElement.style.height = '214mm';
-                    encarts[i].style.paddingBottom = '0 !important';
-                    encarts[i].style.height = "100%";
-                    encarts[i].nextElementSibling.style.height = '22mm';
-                    encarts[i].nextElementSibling.style.bottom = '-22mm';
-                    encarts[i].nextElementSibling.style.right = '-28.5mm';
-                }
             }
         }
         
@@ -149,7 +164,6 @@ class setMarginTexts extends Paged.Handler {
                 let coverPhoto;
                 let photoContainer = h3.nextElementSibling;
                 if (h3.nextSibling?.children.length === 2) {
-                    console.log('2 toffs');
                     coverPhoto = h3.nextElementSibling.children[1];
                     let coverDessin = document.createElement('img');
                     coverDessin.setAttribute('src', photoContainer.firstElementChild.getAttribute('src'));
@@ -158,7 +172,6 @@ class setMarginTexts extends Paged.Handler {
                     coverDessin.style.height = 'auto';
                     photoContainer.firstElementChild.remove();
                 } else {
-                    console.log('1 toff');
                     coverPhoto = h3.nextElementSibling.firstChild; 
                 }
                 photoContainer.style.position = 'absolute';
@@ -189,8 +202,6 @@ class setMarginTexts extends Paged.Handler {
                 nextContainer.append(nextImg);
 
                 h3.closest('.pagedjs_page').nextElementSibling?.querySelector('.pagedjs_page_content').append(nextContainer);
-            } else {
-                console.log('0 toff');
             }
             h3.style.position = 'absolute';
             h3.style.top = `${(h3.closest('.pagedjs_page_content').offsetHeight - h3.offsetHeight) / 3}px`;
@@ -335,7 +346,7 @@ class setMarginTexts extends Paged.Handler {
                 link.style.color = partieColor;
             }
             let lightColor = partieColor.slice(0, -1) + ', 0.1)';
-            let encarts = page.querySelectorAll('.lampe, .latour, .encart-split');
+            let encarts = page.querySelectorAll('.lampe, .latour, .lampe_nohead, .latour_nohead, .encart-split');
             for (let encart of encarts) {
                 encart.style.backgroundColor = lightColor;
             }

user/themes/carnet-atterrissage/js/parsing.js

@@ -6,9 +6,12 @@ let baliseWords = [
     'temps',
     'moment',
     'latour',
+    'latour_nohead',
     'lampe',
+    'lampe_nohead',
     'bibliographie',
     'imgsmall',
+    'imgsmall_bottom',
     'fullpage2imgs',
     'fullpageimage',
     'tripleimgs',
@@ -21,7 +24,9 @@ let baliseWords = [
     'imgfullspreadright_bleedtop',
     'imgfullspreadright_bleed',
     'breakbefore',
-    'breakafter'
+    'breakafter',
+    `doublepage_bigright`,
+    `doublepage_bigleft`
 ];
 
 var bodyContent = $('#body').html();
@@ -52,42 +57,46 @@ for(let i = 0; i < moments.length; i++) {
 
 // cleaner le balisage des éléments contenant plusieurs paragraphes
 let contentToParse = [];
-let labeurs = document.getElementsByClassName("labeur");
+let labeurs = document.querySelectorAll('.labeur');
-for(let i = 0; i < labeurs.length; i++) {
+for(let labeur of labeurs) {
-    contentToParse.push(labeurs[i]);
+    contentToParse.push(labeur);
 }
 
 // créer header icons pour encarts 
-let latours = document.getElementsByClassName("latour");
+let encarts = document.querySelectorAll('.latour, .latour_nohead, .lampe, .lampe_nohead');
-for(let i = 0; i < latours.length; i++) {
+for(let encart of encarts) {
-    contentToParse.push(latours[i]);
+  contentToParse.push(encart);
 
-    let headContent = latours[i].firstChild
+  let headContent = encart.firstChild
-    let headerEl = document.createElement('div');
+  let headerEl = document.createElement('div');
-    headerEl.setAttribute('class', 'latour-header')
+  headerEl.setAttribute('class', 'encart-header')
-    let iconImg = document.createElement('img');
+  let iconImg = document.createElement('img');
+  if (encart.classList.contains('latour') || encart.classList.contains('latour')) {
     iconImg.setAttribute('src', '/user/themes/carnet-atterrissage/assets/map.png');
-    headerEl.append(iconImg);
+  } else if (encart.classList.contains('lampe') || encart.classList.contains('lampe_nohead')) {
-    headerEl.append(headContent);
-
-    latours[i].firstChild?.remove();
-    latours[i].prepend(headerEl);
-}
-
-let lampes = document.getElementsByClassName("lampe");
-for(let i = 0; i < lampes.length; i++) {
-    contentToParse.push(lampes[i]);
-
-    let headContent = lampes[i].firstChild
-    let headerEl = document.createElement('div');
-    headerEl.setAttribute('class', 'lampe-header')
-    let iconImg = document.createElement('img');
     iconImg.setAttribute('src', '/user/themes/carnet-atterrissage/assets/lampe.png');
-    headerEl.append(iconImg);
+  }
-    headerEl.append(headContent);
 
-    lampes[i].firstChild?.remove();
+  if (encart.classList.contains('latour_nohead') || encart.classList.contains('lampe_nohead')) {
-    lampes[i].prepend(headerEl);
+    headerEl.style.flexDirection = 'column';
+    headerEl.style.alignItems = 'flex-start';
+    headerEl.style.fontWeight = 'normal';
+    iconImg.style.marginBottom = '2mm';
+    encart.style.paddingTop = '5mm';
+    encart.style.paddingBottom = '5mm';
+    iconImg.style.margin = '0';
+    iconImg.style.marginBottom = '2.5mm';
+  }
+
+  headerEl.append(iconImg);
+  headerEl.append(headContent);
+
+  encart.firstChild?.remove();
+  encart.prepend(headerEl);
+
+  if (encart.querySelector('.encart-header').nextElementSibling == null) {
+    encart.querySelector('.encart-header').style.marginBottom = '0';
+  }
 }
 
 for(let i = 0; i < contentToParse.length; i++) {