refactor code + propre

user/config/system.yaml

@@ -1,12 +1,11 @@
 absolute_urls: false
-timezone: ''
-default_locale: null
+timezone: null
 param_sep: ':'
 wrapped_site: false
 reverse_proxy_setup: false
 force_ssl: false
 force_lowercase_urls: true
-custom_base_url: ''
+custom_base_url: null
 username_regex: '^[a-z0-9_-]{3,16}$'
 pwd_regex: '(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}'
 intl_enabled: true
@@ -16,7 +15,7 @@ http_x_forwarded:
   port: true
   ip: true
 languages:
-  supported: {  }
+  supported: null
   default_lang: null
   include_default_lang: true
   include_default_lang_file_extension: true
@@ -25,7 +24,6 @@ languages:
   session_store_active: false
   http_accept_language: false
   override_locale: false
-  content_fallback: {  }
   pages_fallback_only: false
   debug: false
 home:
@@ -76,13 +74,13 @@ pages:
     - json
     - rss
     - atom
-  append_url_extension: ''
+  append_url_extension: null
   expires: 604800
   cache_control: null
   last_modified: false
   etag: true
   vary_accept_encoding: false
-  redirect_default_code: 302
+  redirect_default_code: '302'
   redirect_trailing_slash: 1
   redirect_default_route: 0
   ignore_files:
@@ -113,9 +111,17 @@ cache:
   gzip: false
   allow_webserver_gzip: false
   redis:
-    socket: false
+    socket: '0'
     password: null
     database: null
+    server: null
+    port: null
+  memcache:
+    server: null
+    port: null
+  memcached:
+    server: null
+    port: null
 twig:
   cache: true
   debug: true
@@ -145,7 +151,7 @@ assets:
   collections:
     jquery: 'system://assets/jquery/jquery-3.x.min.js'
 errors:
-  display: true
+  display: 1
   log: true
 log:
   handler: file
@@ -153,7 +159,7 @@ log:
     facility: local6
     tag: grav
 debugger:
-  enabled: true
+  enabled: false
   provider: debugbar
   censored: false
   shutdown:
@@ -169,7 +175,7 @@ images:
   cls:
     auto_sizes: false
     aspect_ratio: false
-    retina_scale: 1
+    retina_scale: '1'
   defaults:
     loading: auto
   watermark:
@@ -180,10 +186,10 @@ images:
     watermark_all: false
 media:
   enable_media_timestamp: false
-  unsupported_inline_types: {  }
-  allowed_fallback_types: {  }
+  unsupported_inline_types: null
+  allowed_fallback_types: null
   auto_metadata_exif: false
-  upload_limit: 8388608
+  upload_limit: 4294967296
 session:
   enabled: true
   initialize: true

user/config/versions.yaml

@@ -1,6 +1,6 @@
 core:
   grav:
-    version: 1.7.42.3
+    version: 1.7.44
     schema: 1.7.0_2020-11-20_1
     history:
       - { version: 1.7.41.1, date: '2023-05-25 20:58:44' }
@@ -15,3 +15,6 @@ core:
       - { version: 1.7.42.1, date: '2023-07-06 22:48:42' }
       - { version: 1.7.42.1, date: '2023-07-06 23:08:22' }
       - { version: 1.7.42.3, date: '2023-07-18 20:38:16' }
+      - { version: 1.7.43, date: '2023-11-24 05:34:31' }
+      - { version: 1.7.43, date: '2024-01-02 05:32:30' }
+      - { version: 1.7.44, date: '2024-02-05 19:45:49' }

user/data/feed/3a6d0284e743dc4a9b86f97d6dd1a3bf.yaml

@@ -1,40 +1,40 @@
-last_checked: 1690504495
+last_checked: 1707227268
 data:
   -
-    title: 'macOS 13.0 Ventura Apache Setup: Upgrading Homebrew'
+    title: 'macOS 14.0 Sonoma Apache Setup: Upgrading Homebrew'
     url: 'https://getgrav.org/blog/macos-ventura-apache-upgrade-homebrew'
-    date: 1671969600
-    nicetime: '7 months ago'
+    date: 1697803200
+    nicetime: '4 months ago'
   -
-    title: 'macOS 13.0 Ventura Apache Setup: LetsEncrypt SSL'
-    url: 'https://getgrav.org/blog/macos-ventura-apache-ssl'
-    date: 1671966180
-    nicetime: '7 months ago'
+    title: 'macOS 14.0 Sonoma Apache Setup: LetsEncrypt SSL'
+    url: 'https://getgrav.org/blog/macos-sonoma-apache-ssl'
+    date: 1697799780
+    nicetime: '4 months ago'
   -
-    title: 'macOS 13.0 Ventura Apache Setup: MySQL, Xdebug & More...'
-    url: 'https://getgrav.org/blog/macos-ventura-apache-mysql-vhost-apc'
-    date: 1671966000
-    nicetime: '7 months ago'
+    title: 'macOS 14.0 Sonoma Apache Setup: MySQL, Xdebug & More...'
+    url: 'https://getgrav.org/blog/macos-sonoma-apache-mysql-vhost-apc'
+    date: 1697799600
+    nicetime: '4 months ago'
   -
-    title: 'macOS 13.0 Ventura Apache Setup: Multiple PHP Versions'
-    url: 'https://getgrav.org/blog/macos-ventura-apache-multiple-php-versions'
-    date: 1671962400
-    nicetime: '7 months ago'
+    title: 'macOS 14.0 Sonoma Apache Setup: Multiple PHP Versions'
+    url: 'https://getgrav.org/blog/macos-sonoma-apache-multiple-php-versions'
+    date: 1697796000
+    nicetime: '4 months ago'
   -
     title: 'Big changes for Email plugin'
     url: 'https://getgrav.org/blog/new-email-plugin'
     date: 1665048600
-    nicetime: '10 months ago'
+    nicetime: '1 years ago'
   -
     title: 'Skeleton Build Automation'
     url: 'https://getgrav.org/blog/skeletons-build-automation'
     date: 1614347940
-    nicetime: '2 years ago'
+    nicetime: '3 years ago'
   -
     title: 'Using Grav''s new built-in Web Server'
     url: 'https://getgrav.org/blog/using-builtin-webserver'
     date: 1612186320
-    nicetime: '2 years ago'
+    nicetime: '3 years ago'
   -
     title: 'Grav 1.7 CLI Self-Upgrade Bug'
     url: 'https://getgrav.org/blog/grav-170-cli-self-upgrade-bug'

user/data/notifications/3a6d0284e743dc4a9b86f97d6dd1a3bf.yaml

@@ -1,4 +1,4 @@
-last_checked: 1690504263
+last_checked: 1707227267
 data:
   feed:
     -

user/themes/carnet-atterrissage/css/mep/back-cover.css

@@ -0,0 +1,27 @@
+.last-page {
+/*   background-image: url(../../assets/bruit_couv.png), linear-gradient(to left, 
+    #95a358 0%, 
+    #9ca151 14%, 
+    #a59d4a 28%, 
+    #af9944 42%, 
+    #b8963d 57%, 
+    #c19238 71%, 
+    #cb8e31 85%); */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.last-page .has-children div h3,
+.last-page .has-children div div {
+    display: none;
+}
+
+.last-page .has-children div p {
+    width: 75%;
+    padding-bottom: 20mm;
+    font-size: 11pt;
+    color: white;
+    line-height: 1.5;
+}
+    

user/themes/carnet-atterrissage/css/mep/front-cover.css

@@ -0,0 +1,55 @@
+.pagedjs_first_page {
+    background-image: url(../../assets/bruit_couv.png), linear-gradient(to left, 
+    #5595a1 0%, 
+    #5f9796 14%, 
+    #65998d 28%, 
+    #6f9b80 42%, 
+    #799e75 57%, 
+    #83a16b 71%, 
+    #8ba460 85%);
+  }
+  
+  .pagedjs_first_page img[alt="img_couv"] {
+    position: absolute;
+    width: 80mm;
+    left: 34.5mm;
+    top: 10mm;
+  }
+  
+  .pagedjs_first_page img[alt="logo_rivage"] {
+    position: absolute;
+    width: 30mm;
+    bottom: 0;
+    left: 59.5mm;
+  }
+  
+  .pagedjs_first_page h2 {
+    position: absolute;
+    font-size: 36pt;
+    font-weight: bold;
+    left: -8mm;
+    width: 165mm;
+    top: 73mm;
+    line-height: 1.1 !important;
+  }
+  
+  .pagedjs_first_page .free {
+    margin: 0;
+    text-align: center;
+    font-family: 'Ortica';
+    font-weight: bold;
+    color: white;
+    font-size: 10pt;
+    line-height: 1.3;
+    position: absolute;
+    padding: 0;
+    margin-left: -8mm;
+    width: 165mm;
+    top: 110mm;
+  }
+  
+  .pagedjs_first_page .free p {
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  

user/themes/carnet-atterrissage/css/mep/general.css

@@ -0,0 +1,78 @@
+:root {
+    --cols: 8;
+    --rows: 8;
+    --guts: 4mm;
+}
+
+@page {
+    size: 165mm 230mm;
+    margin-top: 16mm;
+    margin-bottom: 16mm;
+    bleed: 0mm;
+    color: black;
+    marks: crop;
+}
+
+@page:left {
+    margin-left: 16mm;
+    margin-right: 8mm;
+
+    @left-middle {
+        content: counter(page);
+        display: flex;
+        justify-content: center;
+        align-items: center; 
+        font-family: 'Ortica';
+        font-weight: bold;
+        font-size: 8pt;
+        height: 30mm;
+    }
+
+    @left-top {
+        content: '';
+        white-space: nowrap;
+        font-family: 'Ortica';
+        font-weight: lighter;
+        font-size: 7pt;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: flex-start;
+        text-align: right;
+    }
+
+    @left-bottom {
+        content: '';
+        white-space: nowrap;
+        font-family: 'Ortica';
+        font-weight: lighter;
+        font-size: 7pt;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: flex-end;
+    }
+}
+
+.pagedjs_margin-left-top div, .pagedjs_margin-left-bottom div {
+    display: block;
+    min-width: max-content;
+    transform: rotate(-90deg);
+}
+
+@page:right {
+    margin-left: 8mm;
+    margin-right: 16mm;
+}
+  
+body {
+    font-family: 'Public';
+}
+
+.breakbefore {
+    break-before: page;
+}
+
+.breakafter {
+    break-after: page;
+}

user/themes/carnet-atterrissage/css/mep/imgs.css

@@ -0,0 +1,214 @@
+img {
+    width: 100%;
+}
+  
+.imgsmall,
+.imgsmall_bottom {
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+}
+  
+.imgsmallsmall {
+    padding-left: calc((var(--pagedjs-pagebox-width) / var(--cols)) + 10mm);
+}
+  
+.imgsmall_bottom {
+    break-after: page;
+}
+  
+.imgsmall img,
+.imgsmall_bottom img {
+    width: 100%;
+}
+  
+.fullpage2imgs {
+    width: 140mm;
+    height: 210mm;
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+}
+  
+.fullpageimage {
+    margin-top: -22mm;
+    margin-left: -10mm;
+    width: 171mm;
+    height: 230mm;
+}
+  
+.bottomimg {
+    width: 100%;
+    break-after: page;
+}
+  
+.bottomimg img {
+    height: 100%;
+}
+  
+  /* .tripleimgs,
+  .tripleimgs_bottom {
+   break-before: page; 
+   break-after: page
+  } */
+  
+.tripleimgs img:nth-of-type(2),
+.tripleimgs_bottom img:first-of-type {
+    width: calc(50% - 2mm);
+    margin-right: 4mm;
+}
+  
+.tripleimgs img:last-of-type,
+.tripleimgs_bottom img:nth-of-type(2) {
+    width: calc(50% - 2mm);
+}
+  
+  /* .tripleimgs2,
+  .tripleimgs2_bottom {
+    break-before: page; 
+    break-after: page
+  } */
+  
+.tripleimgs2 img:nth-of-type(2),
+.tripleimgs2_bottom img:first-of-type {
+    width: calc(37.5% - 2mm);
+    margin-right: 4mm;
+}
+  
+.tripleimgs2 img:last-of-type,
+.tripleimgs2_bottom img:nth-of-type(2) {
+    width: calc(62.5% - 2mm);
+}
+  
+.imgfullspreadleft,
+.imgfullspreadright,
+.imgfullspreadright_bleedtop,
+.imgfullspreadright_bleed,
+.doublepage_bigleft,
+.doublepage_bigright {
+  /*   break-before: left;
+   */  break-after: left;
+    width: 149mm;
+    overflow: hidden;
+}
+  
+.imgfullspreadright_bleedtop {
+    margin-top: -22mm;
+    height: 220mm;
+}
+  
+.imgfullspreadright_bleed {
+    margin-top: -22mm;
+    height: 242mm;
+}
+  
+.imgfullspreadleft img,
+.imgfullspreadright img {
+    height: 198mm;
+    width: auto;
+}
+  
+.imgfullspreadright_bleedtop img {
+    height: 220mm;
+    width: auto;
+}
+  
+.imgfullspreadright_bleed img {
+    height: 242mm;
+    width: auto;
+}
+  
+.imgfullspreadleft-right {
+    width: 149mm;
+    overflow: hidden;
+    margin-left: -16mm;
+}
+  
+.imgfullspreadright-right {
+    width: 143mm;
+    margin-left: -8mm;
+    overflow: hidden;
+    display: flex;
+    justify-content: flex-end;
+}
+  
+.imgfullspreadright_bleedtop-right, .imgfullspreadright_bleed-right {
+    width: 173mm;
+    height: 220mm !important;
+    margin-top: -22mm;
+    margin-left: -8mm;
+    overflow: hidden;
+    display: flex;
+    justify-content: flex-end;
+}
+  
+.imgfullspreadright_bleed-right, .imgfullspreadright_bleed-right img {
+    height: 242mm !important;
+}
+  
+.imgfullspreadright_bleedtop-right img, .imgfullspreadright_bleed-right img {
+    height: 220mm;
+    width: auto;
+}
+  
+.imgfullspreadright-right img {
+    height: 198mm;
+    width: auto;
+}
+  
+.imgfullspreadleft-right img {
+    height: 198mm;
+    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/css/mep/inserts.css

@@ -0,0 +1,69 @@
+.latour, .lampe,
+.latour_nohead, .lampe_nohead {
+  font-family: 'Novel';
+  font-weight: normal;
+  margin-top: 5mm !important;
+  margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+  margin-right: -16mm;
+  margin-bottom: 5mm;
+  line-height: 12pt;
+  font-size: 8pt;
+  padding-right: 23mm;
+  width: 142mm;
+  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+  padding-bottom: 8mm;
+  padding-top: 8mm;
+  background-color: beige;
+  max-height: 198mm;
+}
+
+.pagedjs_page_content section div div div div:first-child:is(.latour),
+.pagedjs_page_content section div div div div:nth-child(2):is(.latour[data-split-from]) {
+  margin-top: 0mm !important;
+}
+
+.pagedjs_page_content section div div div div:last-child:is(.latour) {
+  margin-bottom: 0mm !important;
+}
+
+.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 {
+  position: absolute;
+  margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+  background-color: beige;
+}
+
+.pagedjs_left_page .latour, .pagedjs_left_page .lampe,
+.pagedjs_left_page .latour_nohead, .pagedjs_left_page .lampe_nohead {
+  padding-right: 10mm;
+  width: 128.375mm;
+}
+
+.encart-header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-bottom: 3mm;
+  font-weight: bold;
+}
+
+.encart-header img:first-of-type {
+  margin-top: 1mm;
+  margin-right: 2mm;
+  width: 8mm;
+}

user/themes/carnet-atterrissage/css/mep/notes-biblios.css

@@ -0,0 +1,35 @@
+.note {
+    font-family: 'Ortica';
+    font-weight: bold;
+    font-size: 6pt;
+    color: red;
+    vertical-align: top;
+}
+  
+.note_texte_number {
+    font-family: 'Ortica';
+    font-weight: bold;
+    color: red;
+}
+  
+.note_text {
+    line-height: 12pt;
+    font-size: 9pt;
+    text-align: justify;
+}
+  
+.bibliographie {
+    column-count: 2;
+    column-gap: var(--guts);
+    column-fill: auto;
+    line-height: 12pt;
+    font-size: 9pt;
+    font-weight: bold;
+    z-index: 1;
+    position: relative;
+}
+  
+.bibliographie a {
+    word-break: break-all;
+}
+  

user/themes/carnet-atterrissage/css/mep/titles.css

@@ -0,0 +1,65 @@
+
+h2 {
+    font-family: 'Ortica';
+    font-weight: lighter;
+    padding: 0 8%;
+    font-size: 24pt;
+    color: white;
+    margin: 0;
+    line-height: 1.2 !important;
+    text-align: center;
+    break-before: left;
+}
+
+.partie_cover_page:first-child {
+    background-color: #4a90b2;
+}
+
+.partie_cover_page_right {
+    background-color: #4a90b2;
+}
+
+.partie_cover_page .pagedjs_page_content > div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.partie_count {
+    font-size: 55pt;
+    color: white;
+    font-family: 'Ortica';
+    font-weight: bold;
+    width: 100%;
+    text-align: center;
+    line-height: 1;
+    margin-bottom: 33pt;
+}
+
+h3 {
+    break-before: left;
+    font-family: 'Ortica';
+    font-weight: lighter;
+    font-size: 28pt;
+    line-height: 1.3;
+    margin: 0;
+    width: 60%;
+}
+
+h3 .gros-chiffre {
+    font-size: 54pt;
+    font-family: 'Ortica';
+    font-weight: bold;
+    margin-bottom: -5mm;
+}
+
+h4 {
+    break-before: left;
+    margin-top: 0;
+    font-size: 16pt;
+    line-height: 1.1;
+    color: black;
+    font-family: 'Ortica';
+    font-weight: bold;
+}
+  

user/themes/carnet-atterrissage/css/mep/typographie.css

@@ -0,0 +1,92 @@
+a {
+    text-decoration: underline;
+}
+
+.moment {
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+    display: block;
+    font-size: 11pt;
+    font-weight: bold;
+    line-height: 1.1; /* LA IL FAUT AJUSTER CF TEMPS 14 */
+}
+
+.moment + .moment {
+    margin-bottom: 14pt;
+}
+
+.moment .first-letter {
+    font-size: 18pt;
+}
+
+.temps {
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+    font-size: 9pt;
+    margin-top: -1pt;
+    margin-bottom: 8pt;
+    font-weight: 500;
+}
+
+.temps:before {
+    content: "> ";
+}
+
+.labeur, .free, .free_left, .citation {
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
+    line-height: 12pt;
+    font-size: 9pt;
+    hyphens: none;
+    text-align: left;
+}
+
+.labeur p:before {
+    content: '+ ';
+    font-weight: bold;
+}
+
+.labeur li {
+    margin-bottom: 4pt;
+}
+
+.labeur li:before {
+    content: '× ';
+    font-weight: bold;
+}
+
+.labeur ul {
+    list-style: none;
+    padding-left: 6mm;
+}
+
+.free, .free_left {
+    margin-bottom: 12px;
+}
+
+.free_left {
+    padding-left: 0;
+}
+
+.citation {
+    padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols) + 6.5mm);
+    text-align: justify;
+    padding-right: 16mm;
+    hyphens: auto;
+    font-style: italic;
+    margin-top: 4mm;
+}
+
+.citation .guillement_ouvrant {
+    position: absolute;
+    font-size: 58pt;
+    margin-left: -15mm;
+    margin-top: 5mm;
+}
+
+.citation .guillement_fermant {
+    position: absolute;
+    font-size: 58pt;
+    right: 3mm;
+}
+
+.citation ul {
+    padding: 0;
+}

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

@@ -1,645 +1,10 @@
-:root {
-  --cols: 8;
-  --rows: 8;
-  --guts: 4mm;
-}
+@import url('mep/general.css');
+@import url('mep/front-cover.css');
+@import url('mep/back-cover.css');
+@import url('mep/titles.css');
+@import url('mep/typographie.css');
+@import url('mep/inserts.css');
+@import url('mep/notes-biblios.css');
+@import url('mep/imgs.css');
 
-@page {
-    size: 165mm 230mm;
-    margin-top: 16mm;
-    margin-bottom: 16mm;
-    bleed: 0mm;
-    color: black;
-    marks: crop;
-}
 
-@page:left {
-  margin-left: 16mm;
-  margin-right: 8mm;
-  @left-middle {
-    content: counter(page);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-family: 'Ortica';
-    font-weight: bold;
-    font-size: 8pt;
-    height: 30mm;
-  }
-  @left-top {
-    content: '';
-    white-space: nowrap;
-    font-family: 'Ortica';
-    font-weight: lighter;
-    font-size: 7pt;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: flex-start;
-    text-align: right;
-  }
-  @left-bottom {
-    content: '';
-    white-space: nowrap;
-    font-family: 'Ortica';
-    font-weight: lighter;
-    font-size: 7pt;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: flex-end;
-  }
-}
-
-.pagedjs_margin-left-top div, .pagedjs_margin-left-bottom div {
-  display: block;
-  min-width: max-content;
-  transform: rotate(-90deg);
-}
-
-@page:right {
-  margin-left: 8mm;
-  margin-right: 16mm;
-}
-
-.pagedjs_first_page {
-  background-image: url(../assets/bruit_couv.png), linear-gradient(to left, 
-  #5595a1 0%, 
-  #5f9796 14%, 
-  #65998d 28%, 
-  #6f9b80 42%, 
-  #799e75 57%, 
-  #83a16b 71%, 
-  #8ba460 85%);
-}
-
-.pagedjs_first_page img[alt="img_couv"] {
-  position: absolute;
-  width: 80mm;
-  left: 34.5mm;
-  top: 10mm;
-}
-
-.pagedjs_first_page img[alt="logo_rivage"] {
-  position: absolute;
-  width: 30mm;
-  bottom: 0;
-  left: 59.5mm;
-}
-
-.pagedjs_first_page h2 {
-  position: absolute;
-  font-size: 36pt;
-  font-weight: bold;
-  left: -8mm;
-  width: 165mm;
-  top: 73mm;
-  line-height: 1.1 !important;
-}
-
-.pagedjs_first_page .free {
-  margin: 0;
-  text-align: center;
-  font-family: 'Ortica';
-  font-weight: bold;
-  color: white;
-  font-size: 10pt;
-  line-height: 1.3;
-  position: absolute;
-  padding: 0;
-  margin-left: -8mm;
-  width: 165mm;
-  top: 110mm;
-}
-
-.pagedjs_first_page .free p {
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-.last-page {
-/*   background-image: url(../assets/bruit_couv.png), linear-gradient(to left, 
-  #95a358 0%, 
-  #9ca151 14%, 
-  #a59d4a 28%, 
-  #af9944 42%, 
-  #b8963d 57%, 
-  #c19238 71%, 
-  #cb8e31 85%); */
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.last-page .has-children div h3,
-.last-page .has-children div div {
-    display: none;
-}
-
-.last-page .has-children div p {
-  width: 75%;
-  padding-bottom: 20mm;
-  font-size: 11pt;
-  color: white;
-  line-height: 1.5;
-}
-
-body {
-  font-family: 'Public';
-}
-
-#chargement {
-  position: fixed;
-  background-color: chocolate;
-  padding: 5px;
-  color: white;
-  top: 10px;
-  left: 10px;
-  opacity: 1;
-  transition: opacity 0.3s ease-out;
-  z-index: 9999;
-}
-
-a {
-  text-decoration: underline;
-}
-
-h2 {
-  font-family: 'Ortica';
-  font-weight: lighter;
-  padding: 0 8%;
-  font-size: 24pt;
-  break-before: left;
-  color: white;
-  margin: 0;
-  line-height: 1.2 !important;
-  text-align: center;
-}
-
-.partie_cover_page:first-child {
-  background-color: #4a90b2;
-}
-
-.partie_cover_page_right {
-  background-color: #4a90b2;
-}
-
-.partie_cover_page .pagedjs_page_content > div {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.partie_count {
-  font-size: 55pt;
-  color: white;
-  font-family: 'Ortica';
-  font-weight: bold;
-  width: 100%;
-  text-align: center;
-  line-height: 1;
-  margin-bottom: 33pt;
-}
-
-h3 {
-  break-before: left;
-  font-family: 'Ortica';
-  font-weight: lighter;
-  font-size: 28pt;
-  line-height: 1.3;
-  margin: 0;
-  width: 60%;
-}
-
-h3 .gros-chiffre {
-  font-size: 54pt;
-  font-family: 'Ortica';
-  font-weight: bold;
-  margin-bottom: -5mm;
-}
-
-h4 {
-  break-before: left;
-  margin-top: 0;
-  font-size: 16pt;
-  line-height: 1.1;
-  color: black;
-  font-family: 'Ortica';
-  font-weight: bold;
-}
-
-.breakbefore {
-  break-before: page;
-}
-
-.breakafter {
-  break-after: page;
-}
-
-.moment {
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  display: block;
-  font-size: 11pt;
-  font-weight: bold;
-  line-height: 1.1; /* LA IL FAUT AJUSTER CF TEMPS 14 */
-}
-
-.moment + .moment {
-  margin-bottom: 14pt;
-}
-
-.moment .first-letter {
-  font-size: 18pt;
-}
-
-.temps {
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-	font-size: 9pt;
-  margin-top: -1pt;
-  margin-bottom: 8pt;
-  font-weight: 500;
-}
-
-.temps:before {
-  content: "> ";
-}
-
-
-.labeur, .free, .free_left, .citation {
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  line-height: 12pt;
-  font-size: 9pt;
-  text-align: justify;
-  hyphens: none;
-}
-
-.labeur {
-  text-align: left;
-}
-
-.free, .free_left {
-  margin-bottom: 12px;
-  text-align: left;
-}
-
-.free_left {
-  padding-left: 0;
-}
-
-.citation {
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols) + 6.5mm);
-  text-align: justify;
-  padding-right: 16mm;
-  hyphens: auto;
-  font-style: italic;
-}
-
-.citation .guillement_ouvrant {
-  position: absolute;
-  font-size: 58pt;
-  margin-left: -15mm;
-  margin-top: 5mm;
-}
-
-.citation .guillement_fermant {
-  position: absolute;
-  font-size: 58pt;
-  right: 3mm;
-}
-
-.citation ul {
-  padding: 0;
-}
-
-.labeur p:before {
-  content: '+ ';
-  font-weight: bold;
-}
-
-.labeur li {
-  margin-bottom: 4pt;
-}
-
-.labeur li:before {
-  content: '× ';
-  font-weight: bold;
-}
-
-.labeur ul {
-  list-style: none;
-  padding-left: 6mm;
-}
-
-.pilote {
-  font-family: 'Novel';
-  font-weight: normal;
-  font-size: 11pt;
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  text-align: left;
-  line-height: 1.55;
-}
-
-.latour, .lampe,
-.latour_nohead, .lampe_nohead {
-  font-family: 'Novel';
-  font-weight: normal;
-  margin-top: 5mm !important;
-  margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  margin-right: -16mm;
-  margin-bottom: 5mm;
-  line-height: 12pt;
-  font-size: 8pt;
-  padding-right: 23mm;
-  width: 142mm;
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  padding-bottom: 8mm;
-  padding-top: 8mm;
-  background-color: beige;
-  max-height: 198mm;
-}
-
-.pagedjs_page_content section div div div div:first-child:is(.latour),
-.pagedjs_page_content section div div div div:nth-child(2):is(.latour[data-split-from]) {
-  margin-top: 0mm !important;
-}
-
-.pagedjs_page_content section div div div div:last-child:is(.latour) {
-  margin-bottom: 0mm !important;
-}
-
-.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 {
-  position: absolute;
-  margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-  background-color: beige;
-}
-
-.pagedjs_left_page .latour, .pagedjs_left_page .lampe,
-.pagedjs_left_page .latour_nohead, .pagedjs_left_page .lampe_nohead {
-  padding-right: 10mm;
-  width: 128.375mm;
-}
-
-.encart-header {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  margin-bottom: 3mm;
-  font-weight: bold;
-}
-
-.encart-header img:first-of-type {
-  margin-top: 1mm;
-  margin-right: 2mm;
-  width: 8mm;
-}
-
-.bibliographie {
-  column-count: 2;
-  column-gap: var(--guts);
-  column-fill: auto;
-  line-height: 12pt;
-  font-size: 9pt;
-  font-weight: bold;
-  z-index: 1;
-  position: relative;
-}
-
-.bibliographie a {
-  word-break: break-all;
-}
-
-img {
-  width: 100%;
-}
-
-.imgsmall,
-.imgsmall_bottom {
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-}
-
-.imgsmallsmall {
-  padding-left: calc((var(--pagedjs-pagebox-width) / var(--cols)) + 10mm);
-}
-
-.imgsmall_bottom {
-  break-after: page;
-}
-
-.imgsmall img,
-.imgsmall_bottom img {
-  width: 100%;
-}
-
-.fullpage2imgs {
-  width: 140mm;
-  height: 210mm;
-  padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
-}
-
-.fullpageimage {
-  margin-top: -22mm;
-  margin-left: -10mm;
-  width: 171mm;
-  height: 230mm;
-}
-
-
-.bottomimg {
-  width: 100%;
-  break-after: page;
-}
-
-.bottomimg img {
-  height: 100%;
-}
-
-.tripleimgs,
-.tripleimgs_bottom {
- break-before: page; 
- break-after: page
-}
-
-.tripleimgs img:nth-of-type(2),
-.tripleimgs_bottom img:first-of-type {
-  width: calc(50% - 2mm);
-  margin-right: 4mm;
-}
-
-.tripleimgs img:last-of-type,
-.tripleimgs_bottom img:nth-of-type(2) {
-  width: calc(50% - 2mm);
-}
-
-.tripleimgs2,
-.tripleimgs2_bottom {
-  break-before: page; 
-  break-after: page
-}
-
-.tripleimgs2 img:nth-of-type(2),
-.tripleimgs2_bottom img:first-of-type {
-  width: calc(37.5% - 2mm);
-  margin-right: 4mm;
-}
-
-.tripleimgs2 img:last-of-type,
-.tripleimgs2_bottom img:nth-of-type(2) {
-  width: calc(62.5% - 2mm);
-}
-
-
-
-.imgfullspreadleft,
-.imgfullspreadright,
-.imgfullspreadright_bleedtop,
-.imgfullspreadright_bleed,
-.doublepage_bigleft,
-.doublepage_bigright {
-  break-before: left;
-  break-after: left;
-  width: 149mm;
-  overflow: hidden;
-}
-
-.imgfullspreadright_bleedtop {
-  margin-top: -22mm;
-  height: 220mm;
-}
-
-.imgfullspreadright_bleed {
-  margin-top: -22mm;
-  height: 242mm;
-}
-
-.imgfullspreadleft img,
-.imgfullspreadright img {
-  height: 198mm;
-  width: auto;
-}
-
-.imgfullspreadright_bleedtop img {
-  height: 220mm;
-  width: auto;
-}
-
-.imgfullspreadright_bleed img {
-  height: 242mm;
-  width: auto;
-}
-
-.imgfullspreadleft-right {
-  width: 149mm;
-  overflow: hidden;
-  margin-left: -16mm;
-}
-
-.imgfullspreadright-right {
-  width: 143mm;
-  margin-left: -8mm;
-  overflow: hidden;
-  display: flex;
-  justify-content: flex-end;
-}
-
-
-.imgfullspreadright_bleedtop-right, .imgfullspreadright_bleed-right {
-  width: 173mm;
-  height: 220mm !important;
-  margin-top: -22mm;
-  margin-left: -8mm;
-  overflow: hidden;
-  display: flex;
-  justify-content: flex-end;
-}
-
-.imgfullspreadright_bleed-right, .imgfullspreadright_bleed-right img {
-  height: 242mm !important;
-}
-
-.imgfullspreadright_bleedtop-right img, .imgfullspreadright_bleed-right img {
-  height: 220mm;
-  width: auto;
-}
-
-.imgfullspreadright-right img {
-  height: 198mm;
-  width: auto;
-}
-
-.imgfullspreadleft-right img {
-  height: 198mm;
-  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/css/ui.css

@@ -0,0 +1,12 @@
+#chargement {
+    position: fixed;
+    background-color: chocolate;
+    padding: 5px;
+    color: white;
+    top: 10px;
+    left: 10px;
+    opacity: 1;
+    transition: opacity 0.3s ease-out;
+    z-index: 9999;
+  }
+  

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

@@ -1,455 +1,18 @@
-// 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);
-    }
-
-    afterParsed(parsed) {
-        // indication du chargement
-        let chargement = document.createElement('div');
-        chargement.setAttribute('id', 'chargement');
-        chargement.innerHTML = 'chargement';
-        chargement.style.color = "orange";
-        chargement.style.position = "fixed";
-        chargement.style.fontWeight = "bold";
-        chargement.style.zIndex = "9999";
-        document.querySelector('body').prepend(chargement);
-    }
-
-    afterPreview(pages) {
-        // donner class à la dernière page
-        let lastElement = $('.pagedjs_page').last();
-        lastElement.addClass('last-page');
-
-        // 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")) {
-                if (labeurs[i].firstElementChild) {
-                    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);
-            }
-        }
-        // enlever les paragraphes vides
-        let paragraphes = document.querySelectorAll("p");
-        for (let i = 0; i < paragraphes.length; i++) {
-            if (paragraphes[i].innerHTML == "") {
-                paragraphes[i].remove();
-            }
-        }
-        // images collées en bas
-        let bottomImgs = document.querySelectorAll('.bottomimg, .tripleimgs_bottom, .tripleimgs2_bottom');
-        for (let bottomImg of bottomImgs) {
-            let pageBottom = bottomImg.closest('.pagedjs_area').getBoundingClientRect().bottom;
-            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 vignetteSize = bottomVignette.getBoundingClientRect().height;
-            if (bottomVignette.previousElementSibling) {
-                let textBottom = bottomVignette.previousElementSibling.getBoundingClientRect().bottom;
-                if (bottomVignette.previousElementSibling.classList.contains('labeur') ||
-                bottomVignette.previousElementSibling.classList.contains('citation') ||
-                bottomVignette.previousElementSibling.classList.contains('free') ||
-                bottomVignette.previousElementSibling.classList.contains('temps')) {
-                    bottomVignette.style.marginTop = `${(pageBottom - textBottom) - vignetteSize}px`;
-                }
-                bottomVignette.style.transform = 'translateY(12px)';
-            } else {
-                let vignetteBottom = bottomVignette.getBoundingClientRect().bottom;
-                bottomVignette.style.transform = `translateY(${pageBottom - vignetteBottom}px)`;
-            }
-        }
-        // éléments justifiés pas nécessaires
-        let justifiedSplitEl = document.querySelectorAll("[data-align-last-split-element='justify']");
-        for (let i = 0; i < justifiedSplitEl.length; i++) {
-            for (let j = 0; j < justifiedSplitEl[i].childNodes.length; j++) {
-                let elStyle = justifiedSplitEl[i].childNodes[j].style;
-                if (elStyle != undefined) {
-                    elStyle.textAlignLast = "left";
-                }
-            }
-        }
-        // images fullspread
-        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.querySelector('.pagedjs_page_content');
-            let imgOverflowEl = document.createElement('div');
-            if (fullspreadEl[i].classList.contains('imgfullspreadleft')) {
-                imgOverflowEl.setAttribute('class', 'imgfullspreadleft-right');
-            } else if (fullspreadEl[i].classList.contains('imgfullspreadright')) {
-                imgOverflowEl.setAttribute('class', 'imgfullspreadright-right');
-            } else if (fullspreadEl[i].classList.contains('imgfullspreadright_bleedtop')) {
-                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.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++) {
-            if (fullPageImg[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
-                .classList.contains('pagedjs_left_page')) {
-                fullPageImg[i].style.marginLeft = '-22mm';
-            }
-        }
-        // encarts
-        let encarts = document.querySelectorAll('.latour, .lampe, .latour_nohead, .lampe_nohead');
-        for (let encart of encarts) {
-/*             if (encart.previousElementSibling != null) {
-                encart.style.marginTop = '10mm';
-            }
-            if (encart.nextElementSibling != null) {
-                encart.style.marginBottom = '10mm';
-            }
- */
-
-            if (encart.hasAttribute('data-split-to')) {
-                let plainColor = document.createElement('div');
-                plainColor.setAttribute('class', 'encart-split');
-                let plainHeight = encart.closest('.pagedjs_sheet').getBoundingClientRect().bottom - encart.getBoundingClientRect().bottom;
-                if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
-                    plainColor.style.width = "149mm";
-                } else {
-                    plainColor.style.width = "129mm";
-                }
-                plainColor.style.height = `${plainHeight}px`;
-                encart.parentNode.append(plainColor);
-            }
-
-            if (encart.hasAttribute('data-split-from')) {
-                encart.style.marginTop = "0mm";
-                let plainColor = document.createElement('div');
-                plainColor.setAttribute('class', 'encart-split');
-                if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
-                    plainColor.style.width = "149mm";
-                } else {
-                    plainColor.style.width = "129mm";
-                }
-                plainColor.style.height = "22mm";
-                plainColor.style.top = "-22mm";
-                encart.parentNode.prepend(plainColor);
-            }
-        }
-
-        // TITRES ATELIERS
-        let h3s = document.querySelectorAll('h3');
-        for (let h3 of h3s) {
-            if (h3.nextSibling?.firstChild?.tagName === "IMG") {
-                let coverPhoto;
-                let photoContainer = h3.nextElementSibling;
-                if (h3.nextSibling?.children.length === 2) {
-                    coverPhoto = h3.nextElementSibling.children[1];
-                    let coverDessin = document.createElement('img');
-                    coverDessin.setAttribute('src', photoContainer.firstElementChild.getAttribute('src'));
-                    h3.prepend(coverDessin);
-                    coverDessin.style.width = '100%';
-                    coverDessin.style.height = 'auto';
-                    photoContainer.firstElementChild.remove();
-                } else {
-                    coverPhoto = h3.nextElementSibling.firstChild;
-                }
-                photoContainer.style.position = 'absolute';
-                photoContainer.style.width = '53mm';
-                photoContainer.style.height = '220mm';
-                photoContainer.style.overflow = 'hidden';
-                photoContainer.style.top = "-22mm";
-                photoContainer.style.left = "96mm";
-                photoContainer.style.margin = '0';
-
-                coverPhoto.style.width = 'auto';
-                coverPhoto.style.height = '100%';
-
-                let nextImg = document.createElement('img');
-                nextImg.setAttribute('src', coverPhoto.getAttribute('src'));
-                let nextContainer = document.createElement('div');
-
-                nextContainer.style.position = "absolute";
-                nextContainer.style.top = "-22mm";
-                nextContainer.style.left = "-8mm";
-                nextContainer.style.height = "220mm";
-                nextContainer.style.width = "224mm";
-                nextContainer.style.overflow = "hidden";
-                nextContainer.style.marginLeft = "-53mm";
-                nextImg.style.height = "100%";
-                nextImg.style.width = "auto";
-
-                nextContainer.append(nextImg);
-
-                h3.closest('.pagedjs_page').nextElementSibling?.querySelector('.pagedjs_page_content').append(nextContainer);
-            }
-            h3.style.position = 'absolute';
-            h3.style.top = `${(h3.closest('.pagedjs_page_content').offsetHeight - h3.offsetHeight) / 3}px`;
-
-            h3.closest('.pagedjs_pagebox').querySelector('.pagedjs_margin-left').innerHTML = '';
-            h3.closest('.pagedjs_sheet').classList.add('atelier_cover_page');
-        }
-
-        // TITRES PARTIES
-        let h2s = document.querySelectorAll('h2');
-        for (let i = 0; i < h2s.length; i++) {
-            if (i != 0) {
-                let parentSheet = h2s[i].closest('.pagedjs_sheet');
-                parentSheet.querySelector('.pagedjs_margin-left').innerHTML = '';
-                parentSheet.classList.add('partie_cover_page');
-                parentSheet.parentElement.nextElementSibling?.firstElementChild.classList.add('partie_cover_page_right');
-                let partieCount = document.createElement('div');
-                partieCount.classList.add('partie_count');
-                let romanCount;
-                switch (i) {
-                    case 1: romanCount = 'I'; break;
-                    case 2: romanCount = 'II'; break;
-                    case 3: romanCount = 'III'; break;
-                    case 4: romanCount = 'IV'; break;
-                    case 5: romanCount = 'V'; break;
-                    case 6: romanCount = 'VI'; break;
-                    case 7: romanCount = 'VII'; break;
-                    case 8: romanCount = 'VIII'; break;
-                    case 9: romanCount = 'IX'; break;
-                    case 10: romanCount = 'X'; break;
-                }
-                partieCount.innerHTML = 'Partie<br>' + romanCount;
-                h2s[i].parentElement.prepend(partieCount);
-                h2s[i].nextElementSibling?.remove();
-            }
-        }
-
-        // afficher correctement les éléments en marge
-        let topLeftBoxes = document.querySelectorAll('.pagedjs_margin-left-top');
-        for (let topLeftBox of topLeftBoxes) {
-            let contentDiv = topLeftBox.firstElementChild;
-            let textToPut = document.createElement('p');
-            let atelierGras;
-            let currentPage = contentDiv.closest('.pagedjs_page');
-            if (currentPage.id != "page-1") {
-                let previousPage = currentPage.previousElementSibling;
-                while (previousPage) {
-                    if (previousPage.firstElementChild.classList.contains('atelier_cover_page')) {
-                        textToPut.innerText = previousPage.querySelector('h3').innerText;
-                        let words = textToPut.innerText.split(' ');
-                        let num = parseInt(words[0], 10);
-                        if (!isNaN(num)) {
-                            atelierGras = document.createElement('span');
-                            atelierGras.style.fontWeight = "bold";
-                            atelierGras.innerText = `Atelier ${num} `;
-                            textToPut.innerText = textToPut.innerText.substring(1);
-                        }
-                        break;
-                    }
-                    previousPage = previousPage.previousElementSibling;
-                }
-            }
-            if (atelierGras) {
-                textToPut.prepend(atelierGras);
-            }
-            contentDiv.append(textToPut);
-            contentDiv.style.marginTop = contentDiv.offsetWidth / 2 - contentDiv.offsetHeight / 2 + "px";
-        }
-
-        let bottomLeftBoxes = document.querySelectorAll('.pagedjs_margin-left-bottom');
-        for (let bottomLeftBox of bottomLeftBoxes) {
-            let contentDiv = bottomLeftBox.firstElementChild;
-            let textToPut = document.createElement('p');
-            let partieGras;
-            let currentPage = contentDiv.closest('.pagedjs_page');
-            if (currentPage.id != "page-1") {
-                let previousPage = currentPage.previousElementSibling;
-                while (previousPage) {
-                    if (previousPage.firstElementChild.classList.contains('partie_cover_page')) {
-                        textToPut.innerText = previousPage.querySelector('h2').innerText;
-                        partieGras = document.createElement('span');
-                        partieGras.style.fontWeight = "bold";
-                        partieGras.innerText = previousPage.querySelector('.partie_count').innerHTML.replace("<br>", " ") + " ";
-                        break;
-                    }
-                    previousPage = previousPage.previousElementSibling;
-                }
-            }
-            if (!textToPut.innerText) {
-                textToPut.innerText = "Introduction";
-            }
-            if (partieGras) {
-                textToPut.prepend(partieGras);
-            }
-            contentDiv.append(textToPut);
-            contentDiv.style.marginBottom = contentDiv.offsetWidth / 2 - contentDiv.offsetHeight / 2 + "px";
-        }
-
-        // SET COLORS
-        let colors = [
-            '#5595a1',
-            '#5f9796',
-            '#65998d',
-            '#6f9b80',
-            '#799e75',
-            '#83a16b',
-            '#8ba460',
-            '#95a358',
-            '#9ca151',
-            '#a59d4a',
-            '#af9944',
-            '#b8963d',
-            '#c19238',
-            '#cb8e31'
-        ]
-
-        let sprays = [
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page001.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page002.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page003.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page004.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page005.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page006.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page007.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page008.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page009.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page010.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page011.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page012.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page013.png',
-            '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page014.png'
-        ]
-
-        // set all colors
-        let allPages = document.querySelectorAll('.pagedjs_page');
-        let atelierColor = '';
-        let bgColor = 'rgb(245, 245, 245)';
-        let atelierIndex = 0;
-        for (let page of allPages) {
-            if (page.firstElementChild.classList.contains('atelier_cover_page')) {
-                atelierColor = colors[atelierIndex];
-                if (atelierColor == undefined) {
-                    atelierColor = colors[colors.length];
-                }
-                atelierIndex++;
-            }
-            if (page.firstElementChild.classList.contains('partie_cover_page')) {
-                atelierIndex = 0;
-            }
-            let pageCounter = page.querySelector('.pagedjs_margin-left-middle')
-            if (pageCounter) {
-                pageCounter.style.color = atelierColor;
-            }
-            let citations = page.querySelectorAll('.citation');
-            for (let citation of citations) {
-                // dessiner et colorer les guillemets
-                if (citation.innerText.charAt(0) === '“') {
-                    citation.innerText = citation.innerText.substring(1);
-                }
-                if (citation.innerText.charAt(citation.innerText.length - 1) === '”') {
-                    citation.innerText = citation.innerText.substring(0, citation.innerText.length - 1);
-                }
-                let guillemetOuvrant = document.createElement('div');
-                guillemetOuvrant.innerText = '“';
-                guillemetOuvrant.style.color = atelierColor;
-                guillemetOuvrant.classList.add('guillement_ouvrant');
-                citation.prepend(guillemetOuvrant);
-
-                let guillemetFermant = document.createElement('div');
-                guillemetFermant.innerText = '”';
-                guillemetFermant.style.color = atelierColor;
-                guillemetFermant.classList.add('guillement_fermant');
-                citation.append(guillemetFermant);                
-            }
-            let atelierTitle = page.querySelector('h3');
-            if (atelierTitle) {
-                atelierTitle.style.color = atelierColor;
-            }
-            let bibliographie = page.querySelector('.bibliographie');
-            if (bibliographie) {
-                bibliographie.style.color = atelierColor;
-                // set bg et sprays
-                let bibliographiePage = bibliographie.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement;
-                bibliographiePage.style.backgroundColor = bgColor;
-                let nextPage = bibliographiePage.parentElement?.nextElementSibling?.firstElementChild;
-                if (!bibliographie.closest('.pagedjs_page').previousElementSibling.querySelector('.bibliographie')) {
-                    if (nextPage) {
-                        nextPage.style.backgroundColor = bgColor;
-                    }
-                    let sprayImg = document.createElement('img');
-                    sprayImg.setAttribute('src', sprays[atelierIndex]);
-                    sprayImg.style.height = "242mm";
-                    sprayImg.style.width = "60mm";
-                    sprayImg.style.position = "absolute";
-                    sprayImg.style.top = "-22mm";
-                    sprayImg.style.right = "-20mm";
-                    sprayImg.style.mixBlendMode = "multiply";
-                    bibliographiePage.parentElement.nextElementSibling?.querySelector('.bibliographie').insertAdjacentElement("afterend", sprayImg);
-                }
-
-            }
-            let h4 = page.querySelector('h4');
-            if (h4 && h4?.nextElementSibling?.classList.contains('bibliographie')) {
-                h4.style.color = atelierColor;
-            }
-            let serpentins = document.querySelectorAll('img[alt="serpentin"]');
-            for (let serpentin of serpentins) {
-                let page = serpentin.closest('.pagedjs_page');
-                let nextPage = page.nextElementSibling;
-                page.style.backgroundColor = "rgb(245, 245, 245)";
-                nextPage.style.backgroundColor = "rgb(245, 245, 245)";
-            }
-            let links = page.querySelectorAll('a');
-            for (let link of links) {
-                link.style.color = atelierColor;
-            }
-            if (atelierColor) {
-                let lightColor = `${atelierColor}1a`;
-                let encarts = page.querySelectorAll('.lampe, .latour, .lampe_nohead, .latour_nohead, .encart-split');
-                for (let encart of encarts) {
-                    encart.style.backgroundColor = lightColor;
-                }
-            }
-
-        }
-
-        // all links open in a new tab
-        let links = document.querySelectorAll('a');
-        for (let link of links) {
-            link.setAttribute('target', '_blank');
-        }
-
-        // loading fini
-        document.querySelector('#chargement').remove();
-    }
-}
-Paged.registerHandlers(setMarginTexts);
+if (debug) console.log('%cStart layout', boldLogging);
+
+const layoutScripts = [
+    'layout/ui.js', // DRAW UI AFTER PARSED (paged hook) BEFORE LAYOUT
+    'layout/getLastPage.js',
+    'layout/alignTopMargin.js',
+    'layout/removeEmptyParagraphs.js',
+    'layout/bottomImgs.js',
+    'layout/unjustifyLastSplit.js',
+    'layout/imgsFullspread.js',
+    'layout/inserts.js',
+    'layout/titles.js',
+    'layout/margins.js',
+    'layout/colors.js',
+    'layout/imgsFootnotes.js',
+];
+
+loadScripts(layoutScripts, 0, true);

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

@@ -0,0 +1,28 @@
+// aligner les paragraphes sur la marge haute
+if (debug) console.log('start alignTopMargin');
+
+(function() {
+
+    const labeurs = document.querySelectorAll('.labeur, .free'),
+        moments = document.querySelectorAll('.moment');
+
+    for (let i = 0; i < labeurs.length; i++) {
+        if (labeurs[i] == labeurs[i].parentNode?.firstElementChild
+            && !labeurs[i].firstElementChild?.hasAttribute("data-split-from")) {
+            if (labeurs[i].firstElementChild) {
+                labeurs[i].firstElementChild.style.marginTop = "0px";
+            }
+        }
+    }
+    
+    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);
+        }
+    }
+    
+})();
+
+
+if (debug) console.log('end alignTopMargin');

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

@@ -0,0 +1,40 @@
+// images collées en bas de page
+if (debug) console.log('start bottomImgs');
+
+(function() {
+
+    let bottomImgs = document.querySelectorAll('.bottomimg, .tripleimgs_bottom, .tripleimgs2_bottom');
+
+    for (let bottomImg of bottomImgs) {
+        let pageBottom = bottomImg.closest('.pagedjs_area').getBoundingClientRect().bottom;
+        let imgBottomPos = pageBottom - bottomImg.lastElementChild.getBoundingClientRect().bottom;
+        bottomImg.style.transform = `translateY(${imgBottomPos}px)`;
+    }
+
+    // pour les images en bas dans les pages avec du texte
+    let bottomVignettes = document.querySelectorAll('.imgsmall_bottom'); 
+
+    for (let bottomVignette of bottomVignettes) {
+        let pageBottom = bottomVignette.closest('.pagedjs_area').getBoundingClientRect().bottom;
+        let vignetteSize = bottomVignette.getBoundingClientRect().height;
+
+        if (bottomVignette.previousElementSibling) {
+            let textBottom = bottomVignette.previousElementSibling.getBoundingClientRect().bottom;
+
+            if (bottomVignette.previousElementSibling.classList.contains('labeur') ||
+            bottomVignette.previousElementSibling.classList.contains('citation') ||
+            bottomVignette.previousElementSibling.classList.contains('free') ||
+            bottomVignette.previousElementSibling.classList.contains('temps')) {
+                bottomVignette.style.marginTop = `${(pageBottom - textBottom) - vignetteSize}px`;
+            }
+
+            bottomVignette.style.transform = 'translateY(12px)';
+        } else {
+            let vignetteBottom = bottomVignette.getBoundingClientRect().bottom;
+            bottomVignette.style.transform = `translateY(${pageBottom - vignetteBottom}px)`;
+        }
+    }
+
+})();
+
+if (debug) console.log('end bottomImgs');

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

@@ -0,0 +1,157 @@
+// set all the relative to parts colors
+if (debug) console.log('start colors');
+
+(function() {
+
+    const colors = [
+        '#5595a1',
+        '#5f9796',
+        '#65998d',
+        '#6f9b80',
+        '#799e75',
+        '#83a16b',
+        '#8ba460',
+        '#95a358',
+        '#9ca151',
+        '#a59d4a',
+        '#af9944',
+        '#b8963d',
+        '#c19238',
+        '#cb8e31',
+        '#cb6f31',
+        '#d86145'
+    ];
+
+    const sprays = [
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page001.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page002.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page003.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page004.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page005.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page006.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page007.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page008.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page009.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page010.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page011.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page012.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page013.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page014.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page015.png',
+        '/user/themes/carnet-atterrissage/assets/sprays/spary_couleurs-page016.png'
+    ];
+
+    let allPages = document.querySelectorAll('.pagedjs_page');
+    let atelierColor = '';
+    let bgColor = 'rgb(245, 245, 245)';
+    let atelierIndex = 0;
+
+    for (let page of allPages) {
+        if (page.firstElementChild.classList.contains('atelier_cover_page')) {
+            atelierColor = colors[atelierIndex];
+            if (atelierColor == undefined) atelierColor = colors[colors.length];
+            atelierIndex++;
+        }
+
+        if (page.firstElementChild.classList.contains('partie_cover_page')) atelierIndex = 0;
+
+        let pageCounter = page.querySelector('.pagedjs_margin-left-middle')
+        if (pageCounter) pageCounter.style.color = atelierColor;
+
+        let citations = page.querySelectorAll('.citation');
+        for (let citation of citations) {
+            // dessiner et colorer les guillemets
+            if (citation.innerText.charAt(0) === '“') citation.innerText = citation.innerText.substring(1);
+            
+            if (citation.innerText.charAt(citation.innerText.length - 1) === '”') {
+                citation.innerText = citation.innerText.substring(0, citation.innerText.length - 1);
+            }
+
+            let guillemetOuvrant = document.createElement('div');
+            guillemetOuvrant.innerText = '“';
+            guillemetOuvrant.style.color = atelierColor;
+            guillemetOuvrant.classList.add('guillement_ouvrant');
+            citation.prepend(guillemetOuvrant);
+
+            let guillemetFermant = document.createElement('div');
+            guillemetFermant.innerText = '”';
+            guillemetFermant.style.color = atelierColor;
+            guillemetFermant.classList.add('guillement_fermant');
+            citation.append(guillemetFermant);                
+        }
+
+        let atelierTitle = page.querySelector('h3');
+        if (atelierTitle) atelierTitle.style.color = atelierColor;
+
+        let bibliographie = page.querySelector('.bibliographie');
+        if (bibliographie) {
+            bibliographie.style.color = atelierColor;
+            // set bg et sprays
+            let bibliographiePage = bibliographie.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement; // désolé
+            bibliographiePage.style.backgroundColor = bgColor;
+
+            let nextPage;
+            if (bibliographiePage.parentElement.classList.contains('pagedjs_sheet')) {
+                nextPage = bibliographiePage.parentElement?.parentElement?.nextElementSibling?.firstElementChild;
+            } else {
+                nextPage = bibliographiePage.parentElement?.nextElementSibling?.firstElementChild;
+            }
+
+            if (!bibliographie.closest('.pagedjs_page').previousElementSibling.querySelector('.bibliographie')) {
+                if (nextPage) {
+                    nextPage.style.backgroundColor = bgColor;
+                }
+
+                let sprayImg = document.createElement('img');
+                sprayImg.setAttribute('src', sprays[atelierIndex - 1]);
+                sprayImg.style.height = "242mm";
+                sprayImg.style.width = "60mm";
+                sprayImg.style.position = "absolute";
+                sprayImg.style.top = "-22mm";
+                sprayImg.style.right = "-20mm";
+                sprayImg.style.mixBlendMode = "multiply";
+
+                let nextBiblioPageEl = bibliographiePage.parentElement.nextElementSibling?.querySelector('.bibliographie');
+                if (nextBiblioPageEl) {
+                    bibliographiePage.parentElement.nextElementSibling?.querySelector('.bibliographie').insertAdjacentElement("afterend", sprayImg);
+                } else {
+                    bibliographiePage.parentElement.parentElement.nextElementSibling?.querySelector('.pagedjs_page_content').appendChild(sprayImg);
+                }
+            }
+        }
+
+        let h4 = page.querySelector('h4');
+        if (h4 && h4?.nextElementSibling?.classList.contains('bibliographie')) {
+            h4.style.color = atelierColor;
+        }
+
+        let serpentins = document.querySelectorAll('img[alt="serpentin"]');
+        for (let serpentin of serpentins) {
+            let page = serpentin.closest('.pagedjs_page');
+            let nextPage = page.nextElementSibling;
+            page.style.backgroundColor = "rgb(245, 245, 245)";
+            nextPage.style.backgroundColor = "rgb(245, 245, 245)";
+        }
+
+        let links = page.querySelectorAll('a');
+        for (let link of links) {
+            link.style.color = atelierColor;
+        }
+
+        let notesNumber = page.querySelectorAll('.note, .note_texte_number');
+        for (let note of notesNumber) {
+            note.style.color = atelierColor;
+        }
+
+        if (atelierColor) {
+            let lightColor = `${atelierColor}1a`;
+            let encarts = page.querySelectorAll('.lampe, .latour, .lampe_nohead, .latour_nohead, .encart-split');
+            for (let encart of encarts) {
+                encart.style.backgroundColor = lightColor;
+            }
+        }
+    }
+
+})();
+
+if (debug) console.log('end colors');

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

@@ -0,0 +1,9 @@
+// identifier la dernière page
+if (debug) console.log('start getLastPage');
+
+(function() {
+    let lastElement = $('.pagedjs_page').last();
+    lastElement.addClass('last-page');
+})();
+
+if (debug) console.log('end getLastPage');

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

@@ -0,0 +1,25 @@
+// afficher les renvoie de notes des images
+if (debug) console.log('start imgsFootnotes');
+
+(function() {
+
+    let notesImg = document.querySelectorAll('.note_img');
+    for (let noteImg of notesImg) {
+        let noteNumber = noteImg.getAttribute('id').split("_");
+        noteNumber = noteNumber[noteNumber.length - 1];
+
+        noteImg.innerText = noteNumber;
+        noteImg.style.position = "absolute";
+
+        if (noteImg.parentElement.classList.contains('imgsmall_bottom')) {
+            noteImg.style.left = '78px'; // hardcoded pas beau
+        } else if (noteImg.parentElement.classList.contains('imgfullspreadright_bleed')) {
+            noteImg.style.color = "white";
+            noteImg.style.top = "0";
+            noteImg.style.left = "0.5cm";
+        }
+    }
+
+})();
+
+if (debug) console.log('end imgsFootnotes');

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

@@ -0,0 +1,77 @@
+// images double-page
+if (debug) console.log('start imgsFullspread');
+
+(function() {
+
+    let fullspreadElements = document.querySelectorAll('.imgfullspreadleft, .imgfullspreadright, .imgfullspreadright_bleedtop, .imgfullspreadright_bleed, .doublepage_bigleft, .doublepage_bigright');
+
+    for (let fullspreadEl of fullspreadElements) {
+        let imgSrc = fullspreadEl.firstElementChild?.getAttribute('src');
+        let nextPage = fullspreadEl.closest('.pagedjs_page')?.nextElementSibling?.querySelector('.pagedjs_page_content');
+        let imgOverflowEl = document.createElement('div');
+
+        switch(true) {
+            case fullspreadEl.classList.contains('imgfullspreadleft'):
+                imgOverflowEl.setAttribute('class', 'imgfullspreadleft-right');
+                break;
+            case fullspreadEl.classList.contains('imgfullspreadright'):
+                imgOverflowEl.setAttribute('class', 'imgfullspreadright-right');
+                break;
+            case fullspreadEl.classList.contains('imgfullspreadright_bleedtop'):
+                imgOverflowEl.setAttribute('class', 'imgfullspreadright_bleedtop-right');
+                break;
+            case fullspreadEl.classList.contains('imgfullspreadright_bleed'):
+                imgOverflowEl.setAttribute('class', 'imgfullspreadright_bleed-right');
+                break;
+            case fullspreadEl.classList.contains('doublepage_bigleft'):
+                imgOverflowEl.setAttribute('class', 'overflow_bigimgleft');
+                break;
+            case fullspreadEl.classList.contains('doublepage_bigright'):
+                imgOverflowEl.setAttribute('class', 'overflow_bigimgright');
+                break;
+            default:
+                break;
+        }
+        
+        let imgOverflow = document.createElement('img');
+        imgOverflow.src = imgSrc;
+        imgOverflowEl.append(imgOverflow);
+
+        if (nextPage) nextPage.append(imgOverflowEl);
+
+        if (fullspreadEl.classList.contains('imgfullspreadright')
+        || fullspreadEl.classList.contains('imgfullspreadright_bleedtop')
+        || fullspreadEl.classList.contains('imgfullspreadright_bleed')) {
+            let imgLeft = fullspreadEl.firstElementChild;
+            let imgMargin = imgOverflowEl.getBoundingClientRect().right - imgLeft?.getBoundingClientRect().right;
+            if (imgLeft) imgLeft.style.marginLeft = `${imgMargin}px`;
+        }
+        if (fullspreadEl.classList.contains('doublepage_bigleft')
+        || fullspreadEl.classList.contains('doublepage_bigright')) {
+            let smallImgSrc = fullspreadEl.lastElementChild?.getAttribute('src');
+            fullspreadEl.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.classList.contains('doublepage_bigleft') && nextPage) {
+                nextPage.append(smallImgEl);
+            } else {
+                fullspreadEl.parentElement?.append(smallImgEl);
+            }
+        }
+    }
+
+    // fullpage img page gauche
+    let fullPageImgs = document.querySelectorAll('.fullpageimage');
+    for (let fullPageImg of fullPageImgs) {
+        if (fullPageImg.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode // désolé
+            .classList.contains('pagedjs_left_page')) {
+            fullPageImg.style.marginLeft = '-22mm';
+        }
+    }
+
+})();
+
+if (debug) console.log('end imgsFullspread');

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

@@ -0,0 +1,39 @@
+// gestion des encarts splittés
+if (debug) console.log('start inserts');
+
+(function() {
+
+            let encarts = document.querySelectorAll('.latour, .lampe, .latour_nohead, .lampe_nohead');
+            for (let encart of encarts) {
+    
+                if (encart.hasAttribute('data-split-to')) {
+                    let plainColor = document.createElement('div');
+                    plainColor.setAttribute('class', 'encart-split');
+                    let plainHeight = encart.closest('.pagedjs_sheet').getBoundingClientRect().bottom - encart.getBoundingClientRect().bottom;
+                    if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
+                        plainColor.style.width = "149mm";
+                    } else {
+                        plainColor.style.width = "129mm";
+                    }
+                    plainColor.style.height = `${plainHeight}px`;
+                    encart.parentNode.append(plainColor);
+                }
+    
+                if (encart.hasAttribute('data-split-from')) {
+                    encart.style.marginTop = "0mm";
+                    let plainColor = document.createElement('div');
+                    plainColor.setAttribute('class', 'encart-split');
+                    if (encart.closest('.pagedjs_page').classList.contains('pagedjs_right_page')) {
+                        plainColor.style.width = "149mm";
+                    } else {
+                        plainColor.style.width = "129mm";
+                    }
+                    plainColor.style.height = "22mm";
+                    plainColor.style.top = "-22mm";
+                    encart.parentNode.prepend(plainColor);
+                }
+            }
+    
+})();
+
+if (debug) console.log('end inserts');

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

@@ -0,0 +1,81 @@
+// afficher les éléments en marge
+if (debug) console.log('start margins');
+
+(function() {
+
+    let topLeftBoxes = document.querySelectorAll('.pagedjs_margin-left-top');
+
+    for (let topLeftBox of topLeftBoxes) {
+        let contentDiv = topLeftBox.firstElementChild;
+        let textToPut = document.createElement('p');
+        let atelierGras;
+        let currentPage = contentDiv.closest('.pagedjs_page');
+
+        if (currentPage.id != "page-1") {
+            let previousPage = currentPage.previousElementSibling;
+
+            while (previousPage) {
+                if (previousPage.firstElementChild.classList.contains('atelier_cover_page')) {
+                    textToPut.innerText = previousPage.querySelector('h3').innerText;
+                    let words = textToPut.innerText.split(' ');
+                    let num = parseInt(words[0], 10);
+
+                    if (!isNaN(num)) {
+                        atelierGras = document.createElement('span');
+                        atelierGras.style.fontWeight = "bold";
+                        atelierGras.innerText = `Atelier ${num} `;
+                        textToPut.innerText = textToPut.innerText.substring(1);
+                    }
+                    break;
+                }
+                previousPage = previousPage.previousElementSibling;
+            }
+        }
+
+        if (atelierGras) {
+            textToPut.prepend(atelierGras);
+        }
+
+        contentDiv.append(textToPut);
+        contentDiv.style.marginTop = contentDiv.offsetWidth / 2 - contentDiv.offsetHeight / 2 + "px";
+    }
+
+    let bottomLeftBoxes = document.querySelectorAll('.pagedjs_margin-left-bottom');
+
+    for (let bottomLeftBox of bottomLeftBoxes) {
+        let contentDiv = bottomLeftBox.firstElementChild;
+        let textToPut = document.createElement('p');
+        let partieGras;
+        let currentPage = contentDiv.closest('.pagedjs_page');
+
+        if (currentPage.id != "page-1") {
+            let previousPage = currentPage.previousElementSibling;
+
+            while (previousPage) {
+
+                if (previousPage.firstElementChild.classList.contains('partie_cover_page')) {
+                    textToPut.innerText = previousPage.querySelector('h2').innerText;
+                    partieGras = document.createElement('span');
+                    partieGras.style.fontWeight = "bold";
+                    partieGras.innerText = previousPage.querySelector('.partie_count').innerHTML.replace("<br>", " ") + " ";
+                    break;
+                }
+                previousPage = previousPage.previousElementSibling;
+            }
+        }
+
+        if (!textToPut.innerText) {
+            textToPut.innerText = "Introduction";
+        }
+
+        if (partieGras) {
+            textToPut.prepend(partieGras);
+        }
+
+        contentDiv.append(textToPut);
+        contentDiv.style.marginBottom = contentDiv.offsetWidth / 2 - contentDiv.offsetHeight / 2 + "px";
+    }
+
+})();
+
+if (debug) console.log('end margins');

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

@@ -0,0 +1,16 @@
+// supprimer les paragraphes vides
+if (debug) console.log('start removeEmptyParagraphs');
+
+(function() {
+
+    let paragraphes = document.querySelectorAll("p");
+    
+    for (let i = 0; i < paragraphes.length; i++) {
+        if (paragraphes[i].innerHTML == "") {
+            paragraphes[i].remove();
+        }
+    }
+
+})();
+
+if (debug) console.log('end removeEmptyParagraphs');

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

@@ -0,0 +1,95 @@
+// layout des pages de titres
+console.log('start titles');
+
+(function() {
+
+        // titres ateliers
+        let h3s = document.querySelectorAll('h3');
+
+        for (let h3 of h3s) {
+
+            if (h3.nextSibling?.firstChild?.tagName === "IMG") {
+                let coverPhoto;
+                let photoContainer = h3.nextElementSibling;
+
+                if (h3.nextSibling?.children.length === 2) {
+                    coverPhoto = h3.nextElementSibling.children[1];
+                    let coverDessin = document.createElement('img');
+                    coverDessin.setAttribute('src', photoContainer.firstElementChild.getAttribute('src'));
+                    h3.prepend(coverDessin);
+                    coverDessin.style.width = '100%';
+                    coverDessin.style.height = 'auto';
+                    photoContainer.firstElementChild.remove();
+                } else {
+                    coverPhoto = h3.nextElementSibling.firstChild;
+                }
+
+                photoContainer.style.position = 'absolute';
+                photoContainer.style.width = '53mm';
+                photoContainer.style.height = '220mm';
+                photoContainer.style.overflow = 'hidden';
+                photoContainer.style.top = "-22mm";
+                photoContainer.style.left = "96mm";
+                photoContainer.style.margin = '0';
+
+                coverPhoto.style.width = 'auto';
+                coverPhoto.style.height = '100%';
+
+                let nextImg = document.createElement('img');
+                nextImg.setAttribute('src', coverPhoto.getAttribute('src'));
+                let nextContainer = document.createElement('div');
+
+                nextContainer.style.position = "absolute";
+                nextContainer.style.top = "-22mm";
+                nextContainer.style.left = "-8mm";
+                nextContainer.style.height = "220mm";
+                nextContainer.style.width = "224mm";
+                nextContainer.style.overflow = "hidden";
+                nextContainer.style.marginLeft = "-53mm";
+                nextImg.style.height = "100%";
+                nextImg.style.width = "auto";
+
+                nextContainer.append(nextImg);
+
+                h3.closest('.pagedjs_page').nextElementSibling?.querySelector('.pagedjs_page_content').append(nextContainer);
+            }
+            
+            h3.style.position = 'absolute';
+            h3.style.top = `${(h3.closest('.pagedjs_page_content').offsetHeight - h3.offsetHeight) / 3}px`;
+
+            h3.closest('.pagedjs_pagebox').querySelector('.pagedjs_margin-left').innerHTML = '';
+            h3.closest('.pagedjs_sheet').classList.add('atelier_cover_page');
+        }
+
+        // titres parties
+        let h2s = document.querySelectorAll('h2');
+        for (let i = 0; i < h2s.length; i++) {
+            if (i != 0) {
+                let parentSheet = h2s[i].closest('.pagedjs_sheet');
+                parentSheet.querySelector('.pagedjs_margin-left').innerHTML = '';
+                parentSheet.classList.add('partie_cover_page');
+                parentSheet.parentElement.nextElementSibling?.firstElementChild.classList.add('partie_cover_page_right');
+                let partieCount = document.createElement('div');
+                partieCount.classList.add('partie_count');
+                let romanCount;
+                switch (i) {
+                    case 1: romanCount = 'I'; break;
+                    case 2: romanCount = 'II'; break;
+                    case 3: romanCount = 'III'; break;
+                    case 4: romanCount = 'IV'; break;
+                    case 5: romanCount = 'V'; break;
+                    case 6: romanCount = 'VI'; break;
+                    case 7: romanCount = 'VII'; break;
+                    case 8: romanCount = 'VIII'; break;
+                    case 9: romanCount = 'IX'; break;
+                    case 10: romanCount = 'X'; break;
+                }
+                partieCount.innerHTML = `Partie<br>${romanCount}`;
+                h2s[i].parentElement.prepend(partieCount);
+                h2s[i].nextElementSibling?.remove();
+            }
+        }
+
+})();
+
+console.log('end titles');

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

@@ -0,0 +1,19 @@
+// afficher l'interface par dessus le livre
+if (debug) console.log('start ui');
+
+(function() {
+
+    // indication du chargement
+    let chargement = document.createElement('div');
+    chargement.setAttribute('id', 'chargement');
+    chargement.innerHTML = 'chargement';
+    chargement.style.color = "orange";
+    chargement.style.position = "fixed";
+    chargement.style.fontWeight = "bold";
+    chargement.style.zIndex = "9999";
+    document.querySelector('body').prepend(chargement);
+    
+})();
+
+
+if (debug) console.log('end ui');

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

@@ -0,0 +1,18 @@
+// éléments justifiés pas nécessaires
+if (debug) console.log('start unjustifyLastSplit');
+
+(function() {
+
+    let justifiedSplitElements = document.querySelectorAll("[data-align-last-split-element='justify']");
+    for (let justifiedSplitEl of justifiedSplitElements) {
+        for (let elChild of justifiedSplitEl.childNodes) {
+            let elStyle = elChild.style;
+            if (elStyle != undefined) {
+                elStyle.textAlignLast = "left";
+            }
+        }
+    }
+
+})();
+
+if (debug) console.log('end unjustifyLastSplit');

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

@@ -0,0 +1,51 @@
+// plein de requêtes pour séparer les scripts
+// mais osef c'est pour travailler en local
+
+const debug = true;
+const boldLogging = 'font-weight: bold;';
+
+const jsFolder = 'user/themes/carnet-atterrissage/js';
+const parsingScripts = [
+  'parsing/tagsToClasses.js',
+  'parsing/increaseMomentNumber.js',
+  'parsing/nonBreakingSpaces.js',
+  'parsing/addInsertIcons.js',
+  'parsing/cleanBibliography.js',
+  'parsing/cleanParagraphsParsing.js',
+  'parsing/titlePages.js',
+  'parsing/footnotes.js'
+];
+
+function loadScripts(scripts, index, isPagedLoaded) {
+
+  if (index < scripts.length) {
+
+    $.getScript(`${jsFolder}/${scripts[index]}`, function() {
+      loadScripts(scripts, index + 1, isPagedLoaded);
+    });
+
+  } else if (!isPagedLoaded) {
+    $.getScript(`${jsFolder}/paged.polyfill.js`, function() {
+
+      if (debug) console.log('%cPagedPreviewer working', boldLogging);
+
+      // https://pagedjs.org/documentation/10-handlers-hooks-and-custom-javascript/
+      class setLayout extends Paged.Handler {
+        constructor(chunker, polisher, caller) {
+          super(chunker, polisher, caller);
+        }
+        
+        afterRendered(pages) {
+          if (debug) console.log('%cAll pages render done', boldLogging);
+          $.getScript(`${jsFolder}/layout.js`, function() {});
+        }
+      }
+      Paged.registerHandlers(setLayout);
+
+    });
+  }
+}
+
+if (debug) console.log('%cStart parsing', boldLogging)
+
+loadScripts(parsingScripts, 0, false);

user/themes/carnet-atterrissage/js/paged.polyfill.js

@@ -1,5 +1,5 @@
 /**
- * @license Paged.js v0.4.2 | MIT | https://gitlab.coko.foundation/pagedjs/pagedjs
+ * @license Paged.js v0.4.3 | MIT | https://gitlab.coko.foundation/pagedjs/pagedjs
  */
 
 (function (global, factory) {
@@ -1418,6 +1418,7 @@
 				this.hooks = hooks;
 			} else {
 				this.hooks = {};
+				this.hooks.onPageLayout = new Hook();
 				this.hooks.layout = new Hook();
 				this.hooks.renderNode = new Hook();
 				this.hooks.layoutNode = new Hook();
@@ -1425,6 +1426,7 @@
 				this.hooks.onOverflow = new Hook();
 				this.hooks.afterOverflowRemoved = new Hook();
 				this.hooks.onBreakToken = new Hook();
+				this.hooks.beforeRenderResult = new Hook();
 			}
 
 			this.settings = options || {};
@@ -1449,6 +1451,8 @@
 
 			let prevBreakToken = breakToken || new BreakToken(start);
 
+			this.hooks && this.hooks.onPageLayout.trigger(wrapper, prevBreakToken, this);
+
 			while (!done && !newBreakToken) {
 				next = walker.next();
 				prevNode = node;
@@ -1467,11 +1471,13 @@
 
 					if (newBreakToken && newBreakToken.equals(prevBreakToken)) {
 						console.warn("Unable to layout item: ", prevNode);
+						this.hooks && this.hooks.beforeRenderResult.trigger(undefined, wrapper, this);
 						return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [prevNode]));
 					}
 
 					this.rebuildTableFromBreakToken(newBreakToken, wrapper);
 
+					this.hooks && this.hooks.beforeRenderResult.trigger(newBreakToken, wrapper, this);
 					return new RenderResult(newBreakToken);
 				}
 
@@ -1577,6 +1583,7 @@
 						if (after) {
 							newBreakToken = new BreakToken(after);
 						} else {
+							this.hooks && this.hooks.beforeRenderResult.trigger(undefined, wrapper, this);
 							return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [node]));
 						}
 					}
@@ -1584,6 +1591,7 @@
 
 			}
 
+			this.hooks && this.hooks.beforeRenderResult.trigger(newBreakToken, wrapper, this);
 			return new RenderResult(newBreakToken);
 		}
 
@@ -2840,12 +2848,14 @@
 			this.hooks.filter = new Hook(this);
 			this.hooks.afterParsed = new Hook(this);
 			this.hooks.beforePageLayout = new Hook(this);
+			this.hooks.onPageLayout = new Hook(this);
 			this.hooks.layout = new Hook(this);
 			this.hooks.renderNode = new Hook(this);
 			this.hooks.layoutNode = new Hook(this);
 			this.hooks.onOverflow = new Hook(this);
 			this.hooks.afterOverflowRemoved = new Hook(this);
 			this.hooks.onBreakToken = new Hook();
+			this.hooks.beforeRenderResult = new Hook(this);
 			this.hooks.afterPageLayout = new Hook(this);
 			this.hooks.finalizePage = new Hook(this);
 			this.hooks.afterRendered = new Hook(this);

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

@@ -1,200 +0,0 @@
-
-// transformer les balises [...] en <div class="..."> si ça correspond aux classes prédéfinies
-let baliseWords = [
-    'labeur',
-    'free',
-    'temps',
-    'moment',
-    'pilote',
-    'free_left',
-    'citation',
-    'latour',
-    'latour_nohead',
-    'lampe',
-    'lampe_nohead',
-    'bibliographie',
-    'imgsmall',
-    'imgsmallsmall',
-    'imgsmall_bottom',
-    'fullpage2imgs',
-    'fullpageimage',
-    'tripleimgs',
-    'tripleimgs_bottom',
-    'tripleimgs2',
-    'tripleimgs2_bottom',
-    'bottomimg',
-    'imgfullspreadleft',
-    'imgfullspreadright',
-    'imgfullspreadright_bleedtop',
-    'imgfullspreadright_bleed',
-    'breakbefore',
-    'breakafter',
-    `doublepage_bigright`,
-    `doublepage_bigleft`
-];
-
- var bodyContent = $('#body').html();
-
-bodyContent = bodyContent.replace(/\[([^\/\]]+)\]/g, function(match, word) {
-  if (baliseWords.includes(word)) {
-    return '<div class="' + word + '">';
-  } else {
-    return match;
-  }
-}).replace(/\[\/([^\]]+)\]/g, function(match, word) {
-  if (baliseWords.includes(word)) {
-    return '</div>';
-  } else {
-    return match;
-  }
-});
-
-$('#body').empty().append(bodyContent);
-
-
-// isoler les chiffres des titres
-let moments = document.getElementsByClassName("moment");
-
-for(let i = 0; i < moments.length; i++) {
-    moments[i].innerHTML = "<span class='first-letter'>" + moments[i].innerHTML.substring(0, moments[i].innerHTML.indexOf('—')) + "</span>" + moments[i].innerHTML.slice(moments[i].innerHTML.indexOf(' —'));
-}
-
-// cleaner le balisage des éléments contenant plusieurs paragraphes
-let contentToParse = [];
-let labeurs = document.querySelectorAll('.labeur, .free');
-for(let labeur of labeurs) {
-    contentToParse.push(labeur);
-}
-
-// créer header icons pour encarts 
-let encarts = document.querySelectorAll('.latour, .latour_nohead, .lampe, .lampe_nohead');
-for(let encart of encarts) {
-  
-  encart.innerHTML = encart.innerHTML.replaceAll(' :', '&nbsp;:');
-  encart.innerHTML = encart.innerHTML.replaceAll(' ?', '&nbsp;?');
-  encart.innerHTML = encart.innerHTML.replaceAll(' !', '&nbsp;!');
-  encart.innerHTML = encart.innerHTML.replaceAll('« ', '«&nbsp;');
-  encart.innerHTML = encart.innerHTML.replaceAll(' »', '&nbsp;»');
-  encart.innerHTML = encart.innerHTML.replaceAll('(« ', '(«&nbsp;');
-  encart.innerHTML = encart.innerHTML.replaceAll(' »)', '&nbsp;»)');
-  encart.innerHTML = encart.innerHTML.replaceAll('“', '«&nbsp;');
-  encart.innerHTML = encart.innerHTML.replaceAll('”', '&nbsp;»');
-  encart.innerHTML = encart.innerHTML.replaceAll(' min', '&nbsp;min');
-
-  let headContent = encart.firstChild
-  let headerEl = document.createElement('div');
-  headerEl.setAttribute('class', 'encart-header')
-  let iconImg = document.createElement('img');
-  if (encart.classList.contains('latour') || encart.classList.contains('latour_nohead')) {
-    iconImg.setAttribute('src', '/user/themes/carnet-atterrissage/assets/map.png');
-  } else if (encart.classList.contains('lampe') || encart.classList.contains('lampe_nohead')) {
-    iconImg.setAttribute('src', '/user/themes/carnet-atterrissage/assets/lampe.png');
-  }
-
-  if (encart.classList.contains('latour_nohead') || encart.classList.contains('lampe_nohead')) {
-    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';
-  }
-
-/*   console.log(encart.nextElementSibling);
-  if (encart.nextElementSibling?.classList.contains('moment')) {
-    console.log('BAAAAAAAAH');
-    encart.style.color = 'red';
-  }
- */}
-
-// clean bibliographie
-let bibliographies = document.querySelectorAll('.bibliographie');
-for (let bibliographie of bibliographies) {
-  contentToParse.push(bibliographie);
-  if (bibliographie.nextElementSibling.innerText === "") {
-    bibliographie.nextElementSibling.remove();
-  }
-}
-
-for(let i = 0; i < contentToParse.length; i++) {
-  if (contentToParse[i].childNodes.length == 1) {
-      contentToParse[i].innerHTML = '<p>' + contentToParse[i].innerHTML + '</p>';
-  } else {
-      contentToParse[i].innerHTML = "<p>" + contentToParse[i].innerHTML.replace("<p>", "");
-  }
-      
-  // 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('“', '«&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');
-    }
-  }
-
-  // data align last split
-  if (contentToParse[i].innerHTML.includes('<br>')) {
-    if (contentToParse[i].childElementCount > 0) {
-      for (let j = 0; j < contentToParse[i].childElementCount; j++) {
-        let parts = contentToParse[i].children[j].innerHTML.split('<br>');
-        let newParts = parts.map(function(part) {
-          return '<p>' + part + '</p>';
-        });
-        contentToParse[i].children[j].innerHTML = newParts.join('');
-      }
-    } else {
-      let parts = contentToParse[i].innerHTML.split('<br>');
-      let newParts = parts.map(function(part) {
-        return '<p>' + part + '</p>';
-      });
-      contentToParse[i].innerHTML = newParts.join('');
-    }
-  }
-}
-
-// PAGES TITRES
-let h3s = document.querySelectorAll('h3');
-for (let h3 of h3s) {
-    if (/^\d/.test(h3.innerText)) {
-        h3.innerHTML = h3.innerHTML.replace(/[^\s]*/, function(match) {
-          return `<div class="gros-chiffre">${match}</div>`;
-        });
-    }
-    h3.innerHTML = h3.innerHTML.replace(/ \«/g, '<br>«');
-}
-
-let dessinsPreH3 = document.querySelectorAll('h3 + p img');
-for (let dessin of dessinsPreH3) {
-  dessin.style.width = '0px';
-  dessin.style.height = '0px';
-}
-
-// pour les serpentins
-let h4s = document.querySelectorAll('h4');
-for (let h4 of h4s) {
-  if (h4.innerText === "Serpentin") {
-    let serpentin = h4.nextElementSibling.nextElementSibling;
-    serpentin.nextElementSibling.remove();
-    h4.remove();
-  }
-}

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

@@ -0,0 +1,40 @@
+// créer header icons pour encarts 
+if (debug) console.log('start addInsertIcons');
+
+(function() {
+
+  let encarts = document.querySelectorAll('.latour, .latour_nohead, .lampe, .lampe_nohead');
+  
+  for(let encart of encarts) {
+      let headContent = encart.firstChild
+      let headerEl = document.createElement('div');
+      headerEl.setAttribute('class', 'encart-header')
+      let iconImg = document.createElement('img');
+      let imgFile = encart.classList.contains('latour') || encart.classList.contains('latour_nohead') ? 'map' : 'lampe';
+      iconImg.setAttribute('src', `/user/themes/carnet-atterrissage/assets/${ imgFile }.png`);
+  
+      if (encart.classList.contains('latour_nohead') || encart.classList.contains('lampe_nohead')) {
+        headerEl.style.flexDirection = 'column';
+        headerEl.style.alignItems = 'flex-start';
+        headerEl.style.fontWeight = 'normal';
+        encart.style.paddingTop = '5mm';
+        encart.style.paddingBottom = '5mm';
+        iconImg.style.marginBottom = '2mm';
+        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';
+      }
+  }
+  
+})();
+
+if (debug) console.log('end addInsertIcons');

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

@@ -0,0 +1,15 @@
+// nettoyer le bibliographie
+if (debug) console.log('start cleanBibliography');
+
+(function() {
+
+  let bibliographies = document.querySelectorAll('.bibliographie');
+  for (let bibliographie of bibliographies) {
+    if (bibliographie.nextElementSibling.innerText === "") {
+      bibliographie.nextElementSibling.remove();
+    }
+  }
+
+})();
+
+if (debug) console.log('end cleanBibliography');

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

@@ -0,0 +1,36 @@
+// nettoyer le parsing des pragraphes
+if (debug) console.log('start cleanParagraphsParsing');
+
+(function() {
+
+    let labeurs = document.querySelectorAll('.labeur, .free');
+    for(let labeur of labeurs) {
+        if (labeur.childNodes.length == 1) {
+            labeur.innerHTML = '<p>' + labeur.innerHTML + '</p>';
+        } else {
+            labeur.innerHTML = "<p>" + labeur.innerHTML.replace("<p>", "");
+        }
+    
+        // data align last split
+        if (labeur.innerHTML.includes('<br>')) {
+            if (labeur.childElementCount > 0) {
+                for (let j = 0; j < labeur.childElementCount; j++) {
+                    let parts = labeur.children[j].innerHTML.split('<br>');
+                    let newParts = parts.map(function(part) {
+                        return `<p>${ part }</p>`;
+                    });
+                    labeur.children[j].innerHTML = newParts.join('');
+                }
+            } else {
+                let parts = labeur.innerHTML.split('<br>');
+                let newParts = parts.map(function(part) {
+                    return `<p>${ part }</p>`;
+                });
+                labeur.innerHTML = newParts.join('');
+            }
+        }
+    }
+
+})();
+
+if (debug) console.log('end cleanParagraphsParsing');

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

@@ -0,0 +1,124 @@
+// passage des notes du texte à la fin de la partie
+if (debug) console.log('start footnotes');
+
+(function() {
+
+    // détecter la partie des notes
+    function findH3InAncestorsAndSiblings(element, findNext) {
+        let currentElement = element;
+        let siblingSelector = findNext ? 'nextElementSibling' : 'previousElementSibling';
+    
+        while (currentElement !== null) {
+            if (currentElement.tagName === 'H3') {
+                return currentElement;
+            }
+            currentElement = currentElement.parentElement;
+        }
+    
+        currentElement = element;
+    
+        while (currentElement !== null) {
+            let sibling = currentElement[siblingSelector];
+            while (sibling !== null) {
+            if (sibling.tagName === 'H3') {
+                return sibling;
+            }
+            let descendantH3 = sibling.querySelector('h3');
+            if (descendantH3 !== null) {
+                return descendantH3;
+            }
+            sibling = sibling[siblingSelector];
+            }
+            currentElement = currentElement.parentElement;
+        }
+    
+        return null;
+    }
+    
+    // note dans le texte ou note d'image
+    function isImgNote(note) {
+        if (
+            note.parentElement.classList.contains('imgsmall') ||
+            note.parentElement.classList.contains('imgsmallsmall') ||
+            note.parentElement.classList.contains('imgsmall_bottom') ||
+            note.parentElement.classList.contains('fullpage2imgs') ||
+            note.parentElement.classList.contains('fullpageimage') ||
+            note.parentElement.classList.contains('tripleimgs') ||
+            note.parentElement.classList.contains('tripleimgs_bottom') ||
+            note.parentElement.classList.contains('tripleimgs2') ||
+            note.parentElement.classList.contains('tripleimgs2_bottom') ||
+            note.parentElement.classList.contains('bottomimg') ||
+            note.parentElement.classList.contains('imgfullspreadleft') ||
+            note.parentElement.classList.contains('imgfullspreadright') ||
+            note.parentElement.classList.contains('imgfullspreadright_bleedtop') ||
+            note.parentElement.classList.contains('imgfullspreadright_bleed') ||
+            note.parentElement.classList.contains('doublepage_bigright') ||
+            note.parentElement.classList.contains('doublepage_bigleft')
+        ) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+    
+    // notes
+    let noteNumber = 1;
+    let prevPartie;
+    let partie = 0;
+    let notes = document.querySelectorAll('.note');
+    let noteTitleNextEl;
+    let prevNoteContent;
+    
+    for (let note of notes) {
+        let currentPartie = findH3InAncestorsAndSiblings(note, false);
+        let noteContent = note.innerText;
+    
+        if (currentPartie === prevPartie) {
+            noteNumber++;
+        } else {
+            // créer la page des notes
+            let notePageTitle = document.createElement('h4');
+            notePageTitle.innerText = "Notes";
+            // insert before the next partie page
+            findH3InAncestorsAndSiblings(note, true).parentNode.insertBefore(notePageTitle, findH3InAncestorsAndSiblings(note, true));
+            noteNumber = 1;
+            partie++;
+            notePageTitle.setAttribute('id', 'note_page_title_' + partie);
+            noteTitleNextEl = document.getElementById(`note_page_title_${partie}`).nextElementSibling;
+            let notesContentEl = document.createElement('div');
+            notesContentEl.setAttribute('id', `notes_content_${partie}`);
+            noteTitleNextEl.parentNode.insertBefore(notesContentEl, noteTitleNextEl);
+        }
+    
+        if (noteContent != prevNoteContent) {
+            let noteTextEl = document.createElement('p');
+            noteTextEl.setAttribute('class', 'note_text');
+            noteTextEl.innerHTML = '<span class="note_texte_number">' + noteNumber + '</span><span> ' + noteContent + '</span>';
+            let notesContentEl = document.getElementById(`notes_content_${partie}`);
+            notesContentEl.append(noteTextEl);
+        } else {
+            // si les notes qui se suivent ont le même contenu
+            let notesContentEl = document.getElementById(`notes_content_${partie}`);
+            let lastSpan = notesContentEl.querySelector('p:last-of-type span:last-of-type');
+            let numberToAdd = document.createElement('span');
+            numberToAdd.setAttribute('class', 'note_texte_number');
+            numberToAdd.innerText = `, ${noteNumber}`;
+            notesContentEl.querySelector('p:last-of-type').insertBefore(numberToAdd, lastSpan);
+        }
+    
+        prevNoteContent = noteContent;
+        prevPartie = currentPartie;
+    
+        if (isImgNote(note)) {
+            note.innerText = '';
+            note.classList.add('note_img');
+            note.setAttribute('id', `note_img_${noteNumber}`);
+        } else {
+            note.innerText = noteNumber;
+        }
+    }
+
+})();
+
+
+if (debug) console.log('end footnotes');

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

@@ -0,0 +1,16 @@
+// isoler les chiffres des titres des moments
+if (debug) console.log('start increaseMomentNumber');
+
+(function() {
+    
+    const moments = document.querySelectorAll('.moment');
+    
+    for(let moment of moments) {
+        const number = moment.innerHTML.substring(0, moment.innerHTML.indexOf('—')),
+            titre = moment.innerHTML.slice(moment.innerHTML.indexOf(' —'));
+        moment.innerHTML = `<span class='first-letter'>${ number }</span>${ titre }`;
+    }
+    
+})();
+
+if (debug) console.log('end increaseMomentNumber');

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

@@ -0,0 +1,40 @@
+// insérer des espaces insécables avant les signes de ponctuations et remplacer les guillemets
+if (debug) console.log('start nonBreakingSpaces');
+
+(function() {
+  let contentsToClean = document.querySelectorAll('.labeur, .free, .latour, .latour_nohead, .lampe, .lampe_nohead, .bibliographie');
+  
+  for (let content of contentsToClean) {
+      content.innerHTML = content.innerHTML.replaceAll(' :', ' :');
+      content.innerHTML = content.innerHTML.replaceAll(' ?', ' ?');
+      content.innerHTML = content.innerHTML.replaceAll(' !', ' !');
+      content.innerHTML = content.innerHTML.replaceAll('« ', '« ');
+      content.innerHTML = content.innerHTML.replaceAll(' »', ' »');
+      content.innerHTML = content.innerHTML.replaceAll('(« ', '(« ');
+      content.innerHTML = content.innerHTML.replaceAll(' »)', ' »)');
+      content.innerHTML = content.innerHTML.replaceAll('“', '« ');
+      content.innerHTML = content.innerHTML.replaceAll('”', ' »');
+      content.innerHTML = content.innerHTML.replaceAll(' min', ' min');
+  }
+})();
+
+if (debug) console.log('end nonBreakingSpaces');
+
+
+/* 
+      // micro-typo
+      for(let 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('“', '«&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');
+      }
+    } */

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

@@ -0,0 +1,61 @@
+// transformer les balises [...] en <div class="..."> si ça correspond aux classes prédéfinies
+if (debug) console.log('start tagToClass');
+
+(function() {
+  
+  let baliseWords = [
+      'labeur',
+      'free',
+      'temps',
+      'moment',
+      'pilote',
+      'free_left',
+      'citation',
+      'latour',
+      'latour_nohead',
+      'lampe',
+      'lampe_nohead',
+      'note',
+      'bibliographie',
+      'imgsmall',
+      'imgsmallsmall',
+      'imgsmall_bottom',
+      'fullpage2imgs',
+      'fullpageimage',
+      'tripleimgs',
+      'tripleimgs_bottom',
+      'tripleimgs2',
+      'tripleimgs2_bottom',
+      'bottomimg',
+      'imgfullspreadleft',
+      'imgfullspreadright',
+      'imgfullspreadright_bleedtop',
+      'imgfullspreadright_bleed',
+      'breakbefore',
+      'breakafter',
+      `doublepage_bigright`,
+      `doublepage_bigleft`
+  ];
+  
+  let bodyContent = $('#body').html();
+  
+  bodyContent = bodyContent.replace(/\[([^\/\]]+)\]/g, function(match, word) {
+    if (baliseWords.includes(word)) {
+      return word === 'note' ? `<span class="${ word }">` : `<div class="${ word }">`;
+    } else {
+      return match;
+    }
+  }).replace(/\[\/([^\]]+)\]/g, function(match, word) {
+    if (baliseWords.includes(word)) {
+      return word === 'note' ? '</span>' : '</div>';
+    } else {
+      return match;
+    }
+  });
+  
+  $('#body').empty().append(bodyContent);
+  
+})();
+
+
+if (debug) console.log('end tagToClass');

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

@@ -0,0 +1,34 @@
+// composition des pages titres
+if (debug) console.log('start titlePages');
+
+(function() {
+
+  let h3s = document.querySelectorAll('h3');
+  for (let h3 of h3s) {
+      if (/^\d/.test(h3.innerText)) {
+          h3.innerHTML = h3.innerHTML.replace(/[^\s]*/, function(match) {
+            return `<div class="gros-chiffre">${match}</div>`;
+          });
+      }
+      h3.innerHTML = h3.innerHTML.replace(/ \«/g, '<br>«');
+  }
+  
+  let dessinsPreH3 = document.querySelectorAll('h3 + p img');
+  for (let dessin of dessinsPreH3) {
+    dessin.style.width = '0px';
+    dessin.style.height = '0px';
+  }
+  
+  // pour les serpentins
+  let h4s = document.querySelectorAll('h4');
+  for (let h4 of h4s) {
+    if (h4.innerText === "Serpentin") {
+      let serpentin = h4.nextElementSibling.nextElementSibling;
+      serpentin.nextElementSibling.remove();
+      h4.remove();
+    }
+  }
+
+})();
+
+if (debug) console.log('end titlePages');

user/themes/carnet-atterrissage/templates/partials/base.html.twig

@@ -20,14 +20,13 @@
     {% do assets.addCss('theme://css/pagedjs.css', 98) %}
     {% do assets.addCss('theme://css/custom.css', 97) %}
     {% do assets.addCss('theme://fonts/fonts.css', 96) %}
-    {% do assets.addCss('theme://css/mep_carnet.css', 95) %}
+    {% do assets.addCss('theme://css/ui.css', 95) %}
+    {% do assets.addCss('theme://css/mep_carnet.css', 94) %}
 {% endblock %}
 
 {% block javascripts %}
-    {% do assets.addJs('jquery', 100) %}
-    {% do assets.addJs('theme://js/parsing.js', { group: 'bottom' }) %}
-    {% do assets.addJs('theme://js/paged.polyfill.js', { group: 'bottom' }) %}
-    {% do assets.addJs('theme://js/layout.js', { group: 'bottom' }) %}
+    {% do assets.addJs('jquery') %}
+    {% do assets.addJs('theme://js/main.js', { group: 'bottom' }) %}
 {% endblock %}
 
 {% block assets deferred %}