Quatrieme mini-jeu du support de formation : le createur ecrit 5 a 10 mots (recommandation souple, comme MIN_PAIRS/MIN_CARDS), places par le serveur dans une grille carree horizontalement, verticalement, ou en diagonale (deux sens seulement, jamais a l'envers) via un vrai algorithme de placement avec retry/agrandissement de grille en cas de conflit. La grille ET la position exacte de chaque mot sont calculees cote serveur puis embarquees en JSON ; le client valide chaque selection (glisser ou cliquer-cliquer) par comparaison de coordonnees exactes, jamais une simple comparaison de texte (qui se tromperait sur des lettres partagees entre deux mots qui se croisent). Comme Association/Memory, la grille reste affichee une fois tous les mots trouves : seul le bouton Recommencer (.docMinigameRestartBar, partage) apparait. Verifie via simulation DOM reelle (jsdom) : selection au glisser ET au clic-clic, mot invalide sans crash, barre de fin qui bascule, panneau Proprietes (ajout/suppression de mot avec revalidation serveur). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
6.6 KiB
document_engine/rendering/
Rendu HTML du document — point d'entrée unique utilisé à la fois par le
canevas d'édition et par le Mode Aperçu (même fonction, voir
docs/plan/PLAN.md — "Aperçu réel").
render_document(elements: list[dict[str, Any]]) -> str
Assemble le document entier à partir de la liste à plat renvoyée par
document_engine.list_document_elements : regroupe les éléments par
parent_id, puis rend récursivement les éléments top-niveau dans
l'ordre (une rangée rend elle-même ses propres enfants côte à côte).
- Retour : le HTML complet du document.
- Exceptions : aucune.
render_document_element(el: dict[str, Any], children_by_parent: dict[int | None, list[dict[str, Any]]]) -> str
HTML d'un seul élément — dispatch par dict (table _RENDERERS) selon
el["kind"], plutôt qu'un enchaînement de if (mirroir de l'esprit de
game_engine/scenes/render_scene_object.py). children_by_parent est le
regroupement précalculé par render_document, transmis pour que les
rangées puissent rendre récursivement leurs enfants sans refaire le
regroupement à chaque appel.
- Retour : le HTML de cet élément (et de ses enfants s'il s'agit d'une rangée).
- Exceptions : aucune ; un
kindinconnu produit un blocdocUnknownvisible plutôt qu'une levée d'exception.
Détail des rendus par catégorie (fonctions privées, table de dispatch)
- Rangée (
row) : conteneur flex (gap/align-items/justify-contentréels depuisattributes), enfants rendus récursivement. - Formes (
rectangle/cercle/triangle/trait) :<div>positionné en absolu (x/y/width/height/rotation/z_indexréels) contenant un SVG (rect/circle/polygon/lineselon le type). - Texte (
titre/paragraphe) :<div>stylé selonstyle(préréglage taille/graisse/interligne) etbold/italic/underline/align/color. - Image :
<img>, ou un bloc placeholder sisrcest vide. - Bouton :
<button>avec sonlabelet undata-targetoptionnel. - Quiz : toujours une carte résumant la config réelle (nombre de
questions, total des points via
quiz_total_points, minuteur si activé) — sanitizée (sanitize_quiz_config) avant lecture, jamais un rendu direct d'attributesbrut. Si au moins une question existe, s'y ajoute (fonction privée_render_quiz_player) le questionnaire RÉEL et interactif affiché en Mode Aperçu (voir docs/plan/maquettes/ document-formation-web.html — référence visuelle), masqué en édition par CSS (.docQuizPlayer, voir static/document/document-editor.css) : les questions sont embarquées en JSON dans un attributdata-quiz-config(jamais un<script>par élément), échappé pour l'HTML (html.escape(..., quote=True)) — static/document/js/document-editor.js lit cet attribut et gère tout le déroulé (réponse/score/question suivante/résultat) côté client, sans aucun aller-retour serveur. - Association : toujours une carte résumant la config réelle (nombre
de paires) — sanitizée (
sanitize_association_config) avant lecture. Si au moins une paire existe, s'y ajoute (fonction privée_render_association_player) le plateau de glisser-déposer RÉEL et interactif affiché en Mode Aperçu, masqué en édition par CSS (.docAssocPlayer) : les deux colonnes (termes/correspondances) sont mélangées INDÉPENDAMMENT (random.shuffle, mélange d'affichage — voirCODE_QUALITY.md) puis embarquées en JSON dans un attributdata-assoc-config, échappé pour l'HTML — même principe que le Quiz, aucun aller-retour serveur pendant qu'on joue. Contrairement au Quiz, le plateau reste affiché en permanence une fois la partie terminée : seul le bouton "Recommencer" (.docMinigameRestartBar, partagé avec Memory) apparaît, jamais d'écran de résultat séparé qui le remplacerait. - Memory : toujours une carte résumant la config réelle (nombre de
cartes définies, mode paire/simple) — sanitizée
(
sanitize_memory_config) avant lecture. Si au moins une carte existe, s'y ajoute (fonction privée_render_memory_player) le plateau de retournement RÉEL et interactif : en mode"paire", chaque carte définie est DUPLIQUÉE en deux instances partageant le mêmecard_index(l'appariement se fait dessus, classique Memory) ; en mode"single", une seule instance par carte (simple retournement, sans appariement). Les instances sont mélangées (random.shuffle, mélange d'affichage — voirCODE_QUALITY.md) puis embarquées en JSON dans un attributdata-memory-config, échappé pour l'HTML — même principe que le Quiz/l'Association, aucun aller-retour serveur pendant qu'on joue. Comme l'Association, le plateau reste affiché une fois toutes les paires trouvées (ou toutes les cartes révélées en mode"single") : seul le bouton "Recommencer" (.docMinigameRestartBar) apparaît. - Mots mêlés : toujours une carte résumant la config réelle (nombre
de mots) — sanitizée (
sanitize_mots_config) avant lecture. Si au moins un mot existe, s'y ajoute (fonction privée_render_mots_player) la grille RÉELLE et interactive. La grille ET la position exacte de chaque mot sont calculées ICI côté serveur (_build_mots_grid, jamais recalculées côté client) : chaque mot est placé horizontalement, verticalement, ou en diagonale (haut-gauche→bas-droite ou haut-droite→bas-gauche — jamais à l'envers), les lettres restantes tirées au hasard (random.choice/random.randint, tirage de jeu — voirCODE_QUALITY.md) ; si un mot ne trouve pas sa place, la grille entière est agrandie et le placement retenté depuis zéro, plutôt que d'abandonner silencieusement ce mot. Le tout (grille + coordonnées de chaque mot) est embarqué en JSON dans un attributdata-mots-config, échappé pour l'HTML — même principe que les autres mini-jeux, aucun aller-retour serveur pendant qu'on joue :static/document/js/ document-editor.jscompare les coordonnées EXACTES sélectionnées par l'apprenant à celles de chaque mot (jamais une simple comparaison de texte, qui se tromperait sur des lettres partagées entre deux mots qui se croisent). Comme l'Association/Memory, la grille reste affichée une fois tous les mots trouvés : seul le bouton "Recommencer" (.docMinigameRestartBar) apparaît. - Autres mini-jeux (
scenario/zones) : carte placeholder portant le libellé du type (voirdocument_engine/labels/element_kind_labels.py) — emplacement réservé, formulaire de contenu dédié hors périmètre de cette passe.