From a63a66bef8b73f09ded3231f0a4a040f2c0b4213 Mon Sep 17 00:00:00 2001
From: nathaninline <mail@nathaninline.com>
Date: Wed, 5 Aug 2026 21:36:51 +0200
Subject: [PATCH] Corrige la position d'ouverture de la modale et le saut des
 champs Crawl4AI

---
 internal/ajean/ui/index.html          | 17 ++++++++++++-----
 internal/ajean/ui/src/index.tmpl.html |  5 ++++-
 internal/ajean/ui/src/js/07-models.js | 12 ++++++++----
 3 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/internal/ajean/ui/index.html b/internal/ajean/ui/index.html
index 0b788f2..d26fff8 100644
--- a/internal/ajean/ui/index.html
+++ b/internal/ajean/ui/index.html
@@ -1103,7 +1103,10 @@ button:hover{border-color:var(--dim);color:var(--text)}
               <option value="crawl4ai">Crawl4AI</option>
             </select>
           </div>
-          <div id="crawl-fields">
+          <!-- Masqués AU DÉPART : le moteur par défaut est l'intégré, et ces champs
+               ne concernent que Crawl4AI. Affichés d'emblée puis repliés par le
+               chargement de l'état, ils faisaient sauter la section sous les yeux. -->
+          <div id="crawl-fields" style="display:none">
             <div class="row">
               <input id="crawl-url" type="text" placeholder="http://localhost:11235" class="sctl" onchange="saveCrawlUrl()">
             </div>
@@ -2439,11 +2442,14 @@ async function openItem(kind, key){
     rawBody.style.display = '';
   }
   document.getElementById('modal').classList.add('loading');
-  // Le corps de la modale est un conteneur défilant RÉUTILISÉ d'une ouverture à
-  // l'autre : sans cette remise à zéro, ouvrir un preset après en avoir fait
-  // défiler un autre rouvrait la fiche au milieu.
-  const peBody=document.querySelector('#modal .pe-body'); if(peBody) peBody.scrollTop=0;
   showModal('modal');
+  // ⚠️ APRÈS showModal, jamais avant : le corps de la modale est un conteneur
+  // défilant RÉUTILISÉ d'une ouverture à l'autre, et écrire scrollTop sur un
+  // élément en display:none ne fait RIEN (il n'a pas de boîte de rendu) — le
+  // navigateur restaurait donc l'ancienne position à l'affichage, et on rouvrait
+  // la fiche au milieu. On le refait après le remplissage, la hauteur ayant changé.
+  const topPeBody=()=>{ const b=document.querySelector('#modal .pe-body'); if(b) b.scrollTop=0; };
+  topPeBody();
   // --- Remplissage, une fois la modale à l'écran -----------------------------
   const r = await jfetch(K.getUrl + '?' + K.param + '=' + encodeURIComponent(key||''));
   const d = await r.json();
@@ -2461,6 +2467,7 @@ async function openItem(kind, key){
     if(seq !== openSeq) return;
   }
   document.getElementById('modal').classList.remove('loading');
+  topPeBody();
 }
 
 // Pretty-print bytes — handy for the dropdown options.
diff --git a/internal/ajean/ui/src/index.tmpl.html b/internal/ajean/ui/src/index.tmpl.html
index 9c2431d..7137e88 100644
--- a/internal/ajean/ui/src/index.tmpl.html
+++ b/internal/ajean/ui/src/index.tmpl.html
@@ -115,7 +115,10 @@
               <option value="crawl4ai">Crawl4AI</option>
             </select>
           </div>
-          <div id="crawl-fields">
+          <!-- Masqués AU DÉPART : le moteur par défaut est l'intégré, et ces champs
+               ne concernent que Crawl4AI. Affichés d'emblée puis repliés par le
+               chargement de l'état, ils faisaient sauter la section sous les yeux. -->
+          <div id="crawl-fields" style="display:none">
             <div class="row">
               <input id="crawl-url" type="text" placeholder="http://localhost:11235" class="sctl" onchange="saveCrawlUrl()">
             </div>
diff --git a/internal/ajean/ui/src/js/07-models.js b/internal/ajean/ui/src/js/07-models.js
index f71cdf9..bfaa09a 100644
--- a/internal/ajean/ui/src/js/07-models.js
+++ b/internal/ajean/ui/src/js/07-models.js
@@ -103,11 +103,14 @@ async function openItem(kind, key){
     rawBody.style.display = '';
   }
   document.getElementById('modal').classList.add('loading');
-  // Le corps de la modale est un conteneur défilant RÉUTILISÉ d'une ouverture à
-  // l'autre : sans cette remise à zéro, ouvrir un preset après en avoir fait
-  // défiler un autre rouvrait la fiche au milieu.
-  const peBody=document.querySelector('#modal .pe-body'); if(peBody) peBody.scrollTop=0;
   showModal('modal');
+  // ⚠️ APRÈS showModal, jamais avant : le corps de la modale est un conteneur
+  // défilant RÉUTILISÉ d'une ouverture à l'autre, et écrire scrollTop sur un
+  // élément en display:none ne fait RIEN (il n'a pas de boîte de rendu) — le
+  // navigateur restaurait donc l'ancienne position à l'affichage, et on rouvrait
+  // la fiche au milieu. On le refait après le remplissage, la hauteur ayant changé.
+  const topPeBody=()=>{ const b=document.querySelector('#modal .pe-body'); if(b) b.scrollTop=0; };
+  topPeBody();
   // --- Remplissage, une fois la modale à l'écran -----------------------------
   const r = await jfetch(K.getUrl + '?' + K.param + '=' + encodeURIComponent(key||''));
   const d = await r.json();
@@ -125,6 +128,7 @@ async function openItem(kind, key){
     if(seq !== openSeq) return;
   }
   document.getElementById('modal').classList.remove('loading');
+  topPeBody();
 }
 
 // Pretty-print bytes — handy for the dropdown options.