correction bug paragraphes latour/lampe qui sautent et suppression des espaces blancs avant les paragraphes où ça n'est pas nécessaire

2023-06-16 15:09:53 +02:00
parent 587e900bf1
commit 2d3da66526
16 changed files with 262 additions and 30 deletions
@@ -63,20 +63,90 @@
    }

    // cleaner le balisage des éléments contenant plusieurs paragraphes
+    let contentToParse = [];
    let labeurs = document.getElementsByClassName("labeur");
    for(let i = 0; i < labeurs.length; i++) {
-        if (labeurs[i].childNodes.length == 1) {
-            labeurs[i].innerHTML = '<p>' + labeurs[i].innerHTML + '</p>';
+        contentToParse.push(labeurs[i]);
+    }
+    let latours = document.getElementsByClassName("latour");
+    for(let i = 0; i < latours.length; i++) {
+        contentToParse.push(latours[i]);
+    }
+    let lampes = document.getElementsByClassName("lampe");
+    for(let i = 0; i < lampes.length; i++) {
+        contentToParse.push(lampes[i]);
+    }
+
+    for(let i = 0; i < contentToParse.length; i++) {
+        if (contentToParse[i].childNodes.length == 1) {
+            contentToParse[i].innerHTML = '<p>' + contentToParse[i].innerHTML + '</p>';
        } else {
-            labeurs[i].innerHTML = "<p>" + labeurs[i].innerHTML.replace("<p>", "");
+            contentToParse[i].innerHTML = "<p>" + contentToParse[i].innerHTML.replace("<p>", "");
        }
-        for(j = 0; j < labeurs[i].childNodes.length; j++) {
-            if (labeurs[i].childNodes[j].innerHTML != undefined) {
-                labeurs[i].childNodes[j].innerHTML = labeurs[i].childNodes[j].innerHTML.replaceAll(' :', '&nbsp;:');
+        // headers latour / lampe
+        if (contentToParse[i].classList.contains("latour")) {
+            contentToParse[i].childNodes[0].innerHTML = "<div class='latour-header'><div><img src='{{ url('theme://assets/map.png') }}' alt='carte'></div><div>" + contentToParse[i].childNodes[0].innerHTML + "</div></div>";
+        } else if (contentToParse[i].classList.contains("lampe")) {
+            contentToParse[i].childNodes[0].innerHTML = "<div class='lampe-header'><div><img src='{{ url('theme://assets/lampe.png') }}' alt='lampe'></div><div>" + contentToParse[i].childNodes[0].innerHTML + "</div></div>";
+        }
+        // micro-typo
+        for(j = 0; j < contentToParse[i].childNodes.length; j++) {
+            let contentHTML = contentToParse[i].childNodes[j].innerHTML;
+            if (contentHTML != undefined) {
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll(' :', '&nbsp;:');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll(' ?', '&nbsp;?');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll(' !', '&nbsp;!');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll('« ', '«&nbsp;');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll(' »', '&nbsp;»');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll('“', '«&nbsp;');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll('”', '&nbsp;»');
+                contentToParse[i].childNodes[j].innerHTML = contentToParse[i].childNodes[j].innerHTML.replaceAll(' min', '&nbsp;min');
            }
        }
-    }   
+    }  

+    // fonction s'éxecute après le rendu de pagedJS
+    // cf https://pagedjs.org/documentation/10-handlers-hooks-and-custom-javascript/
+    class setMarginTexts extends Paged.Handler {
+        constructor(chunker, polisher, caller) {
+            super(chunker, polisher, caller);
+        }
+
+        afterPreview(pages) {
+            // afficher correctement les éléments en marge
+            let topLeftBoxes = document.getElementsByClassName('pagedjs_margin-left-top');
+            for (let i = 0; i < topLeftBoxes.length; i++) {
+                topLeftBoxes[i].childNodes[0].style.marginTop = topLeftBoxes[i].childNodes[0].offsetWidth / 2 - topLeftBoxes[i].childNodes[0].offsetHeight / 2 + "px";
+            }
+            let bottomLeftBoxes = document.getElementsByClassName('pagedjs_margin-left-bottom');
+            for (let i = 0; i < bottomLeftBoxes.length; i++) {
+                bottomLeftBoxes[i].childNodes[0].style.marginBottom = bottomLeftBoxes[i].childNodes[0].offsetWidth / 2 - bottomLeftBoxes[i].childNodes[0].offsetHeight / 2 + "px";
+            }
+
+            // cleaner pour que les paragraphes tombent sur la marge haute
+            for(let i = 0; i < labeurs.length; i++) {
+                if (labeurs[i] == labeurs[i].parentNode.firstElementChild
+                    && !labeurs[i].firstElementChild.hasAttribute("data-split-from")) {
+                    labeurs[i].firstElementChild.style.marginTop = "0px";
+                }
+            }
+            // pareil pour les titres temps
+            for (let i = 0; i < moments.length; i++) {
+                if (moments[i].previousElementSibling?.tagName === "P"
+                    && moments[i].previousElementSibling == moments[i].parentNode.firstElementChild) {
+                        moments[i].parentNode.removeChild(moments[i].parentNode.firstElementChild);
+                    }
+            }
+            // images collées en bas
+            let bottomImgs = document.getElementsByClassName('bottomimg');
+            for (let i = 0; i < bottomImgs.length; i++) {
+                let page = bottomImgs[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
+                bottomImgs[i].style.transform = 'translateY(' + (page.getBoundingClientRect().bottom - bottomImgs[i].firstElementChild.getBoundingClientRect().bottom) + 'px)';
+            }
+        }
+    }
+    Paged.registerHandlers(setMarginTexts);
+ 
 </script>
 </body>
 </html>