Annule la réservation d'espace des panneaux, corrige le vrai bug (drag invisible sous eux)
Build and deploy / test-python (push) Failing after 1m22s
Build and deploy / test-js (push) Successful in 53s
Build and deploy / build-and-push (push) Skipped
Build and deploy / deploy (push) Skipped

Retour en arrière sur le commit précédent : les panneaux flottants
doivent RESTER en position:fixed par-dessus le canevas pour maximiser
l'espace utile (remarque explicite) — leur réserver une marge
permanente allait à l'encontre de ce principe et ne réglait rien.

Vrai bug identifié : un objet glissé (déplacé ou redimensionné) sous
l'un de ces panneaux (z-index:60) disparaissait littéralement à
l'écran PENDANT le geste — toujours déplacé/enregistré correctement en
dessous, juste invisible, donnant l'impression qu'on ne pouvait pas y
déposer d'objet. Élevé au-dessus des panneaux (z-index très haut) le
temps du glisser/redimensionnement SEULEMENT, restauré ensuite.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
william
2026-09-03 16:18:42 +02:00
co-authored by Claude Sonnet 5
parent d705f58c4a
commit 046c38b4dc
2 changed files with 22 additions and 12 deletions
+21 -1
View File
@@ -48,10 +48,23 @@ function onSceneObjectMouseDown(e, id) {
var startLeft = parseFloat(el.style.left) || 0, startTop = parseFloat(el.style.top) || 0; var startLeft = parseFloat(el.style.left) || 0, startTop = parseFloat(el.style.top) || 0;
var width = parseFloat(el.style.width) || 0, height = parseFloat(el.style.height) || 0; var width = parseFloat(el.style.width) || 0, height = parseFloat(el.style.height) || 0;
var moved = false; var moved = false;
// Les panneaux flottants "🧩 Objets"/"⚙️ Propriétés" (voir static/style.css
// .floatPanel, z-index:60) restent DÉLIBÉRÉMENT en position:fixed
// PAR-DESSUS le canevas, pour maximiser l'espace utile — mais un objet
// glissé sous l'un d'eux, à son z-index habituel (bien plus bas), y
// disparaissait littéralement à l'écran PENDANT le glisser (toujours
// déplacé/enregistré correctement en dessous, juste invisible pendant
// le geste) : impossible de voir où on le dépose. Passé au-dessus des
// panneaux (z-index très élevé) le temps du glisser SEULEMENT, restauré
// à sa valeur d'origine à la fin.
var previousZIndex = el.style.zIndex;
function onMove(ev) { function onMove(ev) {
var dx = ev.clientX - startX, dy = ev.clientY - startY; var dx = ev.clientX - startX, dy = ev.clientY - startY;
if (Math.abs(dx) > 3 || Math.abs(dy) > 3) moved = true; if (Math.abs(dx) > 3 || Math.abs(dy) > 3) {
if (!moved) el.style.zIndex = 9999;
moved = true;
}
var newLeft = Math.max(0, Math.min(SCENE_WIDTH - width, startLeft + dx)); var newLeft = Math.max(0, Math.min(SCENE_WIDTH - width, startLeft + dx));
var newTop = Math.max(0, Math.min(SCENE_HEIGHT - height, startTop + dy)); var newTop = Math.max(0, Math.min(SCENE_HEIGHT - height, startTop + dy));
el.style.left = newLeft + 'px'; el.style.left = newLeft + 'px';
@@ -61,6 +74,7 @@ function onSceneObjectMouseDown(e, id) {
document.removeEventListener('mousemove', onMove); document.removeEventListener('mousemove', onMove);
document.removeEventListener('mouseup', onUp); document.removeEventListener('mouseup', onUp);
if (moved) { if (moved) {
el.style.zIndex = previousZIndex;
var newLeft = parseFloat(el.style.left), newTop = parseFloat(el.style.top); var newLeft = parseFloat(el.style.left), newTop = parseFloat(el.style.top);
updateScenePosFields(newLeft, newTop, width, height); updateScenePosFields(newLeft, newTop, width, height);
saveSceneObjectGeometry(id, newLeft, newTop, width, height); saveSceneObjectGeometry(id, newLeft, newTop, width, height);
@@ -79,6 +93,11 @@ function onSceneObjectResizeMouseDown(e, id) {
var startX = e.clientX, startY = e.clientY; var startX = e.clientX, startY = e.clientY;
var startWidth = parseFloat(el.style.width) || 0, startHeight = parseFloat(el.style.height) || 0; var startWidth = parseFloat(el.style.width) || 0, startHeight = parseFloat(el.style.height) || 0;
var left = parseFloat(el.style.left) || 0, top = parseFloat(el.style.top) || 0; var left = parseFloat(el.style.left) || 0, top = parseFloat(el.style.top) || 0;
// Voir la même note dans onSceneObjectMouseDown ci-dessus : au-dessus
// des panneaux flottants le temps du geste, pour rester visible même
// en redimensionnant sous l'un d'eux.
var previousZIndex = el.style.zIndex;
el.style.zIndex = 9999;
function onMove(ev) { function onMove(ev) {
var dx = ev.clientX - startX, dy = ev.clientY - startY; var dx = ev.clientX - startX, dy = ev.clientY - startY;
@@ -90,6 +109,7 @@ function onSceneObjectResizeMouseDown(e, id) {
function onUp() { function onUp() {
document.removeEventListener('mousemove', onMove); document.removeEventListener('mousemove', onMove);
document.removeEventListener('mouseup', onUp); document.removeEventListener('mouseup', onUp);
el.style.zIndex = previousZIndex;
var newWidth = parseFloat(el.style.width), newHeight = parseFloat(el.style.height); var newWidth = parseFloat(el.style.width), newHeight = parseFloat(el.style.height);
updateScenePosFields(left, top, newWidth, newHeight); updateScenePosFields(left, top, newWidth, newHeight);
saveSceneObjectGeometry(id, left, top, newWidth, newHeight); saveSceneObjectGeometry(id, left, top, newWidth, newHeight);
+1 -11
View File
@@ -467,17 +467,7 @@ body.builderBody > main.content{ flex:1 1 auto; min-height:0; overflow:hidden; d
(.flowCanvasWrap/.animTimelineWrap ont déjà leur propre défilement), (.flowCanvasWrap/.animTimelineWrap ont déjà leur propre défilement),
jamais sur cette zone entière — sans quoi la barre d'onglets et la barre jamais sur cette zone entière — sans quoi la barre d'onglets et la barre
d'outils défileraient avec le contenu au lieu de rester fixes en haut. */ d'outils défileraient avec le contenu au lieu de rester fixes en haut. */
.builderCanvasArea{ flex:1 1 auto; min-width:0; height:100%; overflow:hidden; display:flex; flex-direction:column; transition:margin .2s ease; } .builderCanvasArea{ flex:1 1 auto; min-width:0; height:100%; overflow:hidden; display:flex; flex-direction:column; }
/* Bug corrigé : les panneaux flottants (voir .floatPanel plus bas) sont
en position:fixed, DONC hors du flux flex de .builder3 — ils flottent
PAR-DESSUS le canevas sans jamais réduire sa largeur, rendant sa
partie droite (sous "⚙️ Propriétés") ou gauche (sous "🧩 Objets")
inaccessible au clic/glisser tant que le panneau correspondant reste
ouvert. Réserve maintenant leur largeur explicitement dès qu'un
panneau est ouvert (voir :not(.hidden), la classe posée/retirée par
openFloatPanel()/closeFloatPanel(), static/js/screen_edit/tree-panels.js). */
#builder3:has(#panelLeftFloat:not(.hidden)) .builderCanvasArea{ margin-left:310px; }
#builder3:has(#propsPanelFloat:not(.hidden)) .builderCanvasArea{ margin-right:370px; }
/* ---------- Panneaux gauche/droite flottants ---------- */ /* ---------- Panneaux gauche/droite flottants ---------- */
/* Les deux panneaux (éléments de l'écran / propriétés) sont sortis du flux /* Les deux panneaux (éléments de l'écran / propriétés) sont sortis du flux