Aperçu en plein écran réel, sans espace autour du mini-jeu, contenu aligné en haut

- Mode Aperçu bascule désormais en VRAI plein écran (Fullscreen API,
  forgeDocSetPreviewMode) au lieu d'un simple agrandissement CSS —
  contourne d'un coup le clipping par overflow:hidden de main.content
  documenté ailleurs dans ce fichier. .docTopbar est masqué comme le
  reste du chrome ; un nouveau bouton flottant .docPreviewExitBtn
  (visible seulement en Aperçu) permet de revenir à l'éditeur, en plus
  d'Échap (natif, resynchronisé via fullscreenchange).
- .docCanvasArea perd son padding et .docPage abandonne son format A4
  fixe en Aperçu (width/height:100%, aspect-ratio:unset) — le mini-jeu
  remplit tout l'écran, sans bordure vide autour (retour utilisateur
  du 23/09/2026 : "il doit prendre toute la place").
- Le contenu des cartes de mini-jeu (.docQuizCard/.docAssocCard/
  .docMemoryCardWrap) passe de justify-content:center à flex-start —
  aligné en haut, pas centré verticalement (retour utilisateur du
  23/09/2026 : "le contenu aligner en haut").

Vérifié par getComputedStyle dans les deux modes (padding/aspect-ratio
de la page, visibilité du bouton de sortie et du bandeau, alignement
du contenu, gating pointer-events des mini-jeux — tout reste cohérent
simultanément).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
william
2026-09-23 11:18:12 +02:00
co-authored by Claude Sonnet 5
parent 152d10fc33
commit 20ee8ef35b
3 changed files with 90 additions and 11 deletions
+30 -3
View File
@@ -2726,11 +2726,38 @@ function forgeDocBindWidthPicker() {
});
}
function forgeDocSetPreviewMode(enabled) {
// Mode Aperçu = plein écran RÉEL, pas un simple agrandissement CSS
// (retour utilisateur du 23/09/2026 : "en mode apercu en plein
// ecrant avec possibilité de retourner à l'éditeur") — la Fullscreen
// API contourne d'un coup toute la question de clipping par
// overflow:hidden sur main.content (voir les commentaires CSS sur
// .docEditor3/la modale Scénario) : l'élément quitte entièrement le
// rendu normal de la page, plus de souci d'ancêtre.
window.forgeDocState.previewMode = enabled;
const editor = document.getElementById('docEditor3');
editor.classList.toggle('docEditor3--preview', enabled);
forgeDocUpdatePageNavPill();
if (enabled) {
if (editor.requestFullscreen) editor.requestFullscreen().catch(() => {});
} else if (document.fullscreenElement) {
document.exitFullscreen().catch(() => {});
}
}
function forgeDocBindPreviewToggle() {
document.getElementById('docPreviewBtn').addEventListener('click', () => {
window.forgeDocState.previewMode = !window.forgeDocState.previewMode;
document.getElementById('docEditor3').classList.toggle('docEditor3--preview', window.forgeDocState.previewMode);
forgeDocUpdatePageNavPill();
forgeDocSetPreviewMode(!window.forgeDocState.previewMode);
});
document.getElementById('docPreviewExitBtn').addEventListener('click', () => forgeDocSetPreviewMode(false));
// Synchronise l'état si le créateur quitte le plein écran nativement
// (Échap, F11...) sans passer par nos boutons — sinon previewMode
// resterait vrai (mini-jeux "jouables") alors que l'écran normal de
// l'éditeur est revenu.
document.addEventListener('fullscreenchange', () => {
if (!document.fullscreenElement && window.forgeDocState.previewMode) {
forgeDocSetPreviewMode(false);
}
});
}