williamandClaude Sonnet 5
4111081e1a
document_engine/labels/memory_config.py (nouveau) : modele de donnees, meme convention resolve_X/sanitize_X que quiz_config.py/ association_config.py - DEFAULT_MEMORY_CONFIG, sanitize_memory_config. Chaque carte a un recto ET un verso, chacun avec image/texte independants et tous deux optionnels ; seul le verso doit avoir au moins l'un des deux non vide (rien a reveler/apparier sinon) - le recto peut rester entierement vide (dos de carte generique "?" par defaut). Liste tronquee a MAX_CARDS=8. Cote serveur, routes/document/document_element_update.py revalide desormais aussi memory avant persistance. Le rendu (_render_memory) affiche un resume reel (nombre de cartes, mode) et, des qu'au moins une carte existe, un plateau de retournement REELEMENT interactif en Mode Apercu (_render_memory_player) : en mode "paire", chaque carte definie est DUPLIQUEE en deux instances partageant le meme card_index (appariement classique) ; en mode "single", une seule instance par carte (simple retournement, sans appariement - "c'est donc un retourner de carte classique plus un jeu memory"). Les instances sont melangees (random.shuffle, documente dans CODE_QUALITY.md) puis embarquees en JSON dans data-memory-config. Cote editeur, le panneau Proprietes propose un bascule segmentee Paire/Simple et une liste de cartes repetable, chaque carte avec ses deux faces (recto/verso) editables independamment (image + texte). Extrait au passage forgeDocEscapeHtml (ex-forgeDocEscapeForTextarea, generalise pour couvrir aussi les attributs) reutilise pour les deux mini-jeux. Le plateau jouable (static/document/js/document-editor.js) est une vraie carte-retournement CSS 3D (perspective/rotateY), contenu de chaque face construit via DOM (textContent/img.src, jamais innerHTML avec le texte du createur - meme precaution que le plateau Association) : bon appariement verrouille en vert, mauvais reinitialise apres un delai, ecran de resultat une fois le jeu termine (les deux modes), et un "Recommencer" qui remelange reellement les cartes (Fisher-Yates cote client). Tests : 11 tests purs (tests/document/test_memory_config.py, sans Flask, dont un qui verifie explicitement la duplication en mode paire vs son absence en mode single) + 1 test de route verifiant la sanitization a l'ecriture. SKIP=djlint : backlog H021 pre-existant, aucun template touche ici. ruff/mypy --strict/vulture/bandit/import-linter/eslint/stylelint tous verts ; 62 tests document verifies frais. Verification manuelle live complete : ajout, sanitization sur carte invalide, rendu du plateau, et simulation DOM du gameplay reel dans les DEUX modes (mode paire : mauvais appariement puis bon appariement puis jeu complet ; mode single : retournement puis jeu complet) - script de diagnostic non conserve dans le depot. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
77 lines
4.7 KiB
Markdown
77 lines
4.7 KiB
Markdown
# 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 `kind` inconnu produit un bloc
|
|
`docUnknown` visible 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-content` réels depuis `attributes`), enfants rendus
|
|
récursivement.
|
|
- **Formes** (`rectangle`/`cercle`/`triangle`/`trait`) : `<div>` positionné
|
|
en absolu (`x`/`y`/`width`/`height`/`rotation`/`z_index` réels) contenant
|
|
un SVG (`rect`/`circle`/`polygon`/`line` selon le type).
|
|
- **Texte** (`titre`/`paragraphe`) : `<div>` stylé selon `style` (préréglage
|
|
taille/graisse/interligne) et `bold`/`italic`/`underline`/`align`/`color`.
|
|
- **Image** : `<img>`, ou un bloc placeholder si `src` est vide.
|
|
- **Bouton** : `<button>` avec son `label` et un `data-target` optionnel.
|
|
- **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'`attributes` brut. 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 attribut `data-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 — voir
|
|
`CODE_QUALITY.md`) puis embarquées en JSON dans un attribut
|
|
`data-assoc-config`, échappé pour l'HTML — même principe que le Quiz,
|
|
aucun aller-retour serveur pendant qu'on joue.
|
|
- **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ême
|
|
`card_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 — voir `CODE_QUALITY.md`) puis embarquées en JSON dans un
|
|
attribut `data-memory-config`, échappé pour l'HTML — même principe que
|
|
le Quiz/l'Association, aucun aller-retour serveur pendant qu'on joue.
|
|
- **Autres mini-jeux** (`mots`/`scenario`/`zones`) : carte placeholder
|
|
portant le libellé du type (voir
|
|
`document_engine/labels/element_kind_labels.py`) — emplacement réservé,
|
|
formulaire de contenu dédié hors périmètre de cette passe.
|