Files
Forge-Engine/templates/document/document_edit.html
T
williamandClaude Sonnet 5 8dc4b35dcf
Build and deploy / test-python (push) Successful in 7m43s
Build and deploy / test-js (push) Successful in 57s
Build and deploy / lint-python (push) Successful in 5m29s
Build and deploy / lint-js (push) Failing after 1m16s
Build and deploy / build-and-push (push) Skipped
Build and deploy / deploy (push) Skipped
Build and deploy / sonarqube (push) Failing after 5m42s
Supprime la couche de formes libres, déplace la navigation de page dans le panneau gauche
Formes libres (rectangle/cercle/triangle/trait) retirées de bout en
bout (bibliothèque, rendu, panneau Propriétés, grille d'accroche,
JS/CSS associés) — fonctionnalité non retenue.

La bande de vignettes visuelles des pages au-dessus du canevas est
remplacée par une section "Pages" dans le panneau de gauche (liste
simple : ajouter/renommer/réordonner (haut/bas)/supprimer), à la
place de l'ex-catégorie "Mise en page" de la bibliothèque. La route
document_edit ne rend plus qu'une seule page (celle affichée) au
chargement, au lieu de toutes les pages pour alimenter les anciennes
vignettes.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-09-21 14:40:33 +02:00

211 lines
9.1 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% extends "base.html" %}
{% block title %}Forge Engine — {{ support.name }}{% endblock %}
{% block body_class %}objectEditBody{% endblock %}
{% block content_class %}{% endblock %}
{% block extra_head %}
<link rel="stylesheet"
href="{{ url_for('static', filename='document/document-editor.css') }}">
{% endblock %}
{% block content %}
<div class="docEditor3" id="docEditor3" data-slug="{{ support.slug }}">
<div class="docTopbar">
<div class="docCrumb">
<a href="{{ url_for('index') }}" class="docCrumbDim">Mes formations</a>
<svg width="14"
height="14"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round">
<path d="M9 6l6 6-6 6" />
</svg>
<span class="docCrumbCur">{{ support.name }}</span>
</div>
<div class="docTopbarActions">
<button type="button"
class="docIconBtn"
id="docUndoBtn"
aria-label="Annuler"
disabled
title="Annuler (Ctrl+Z)">
<svg width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round">
<path d="M8 6L4 10l4 4" />
<path d="M4 10h9a6 6 0 1 1-4.2 10.2" />
</svg>
</button>
<button type="button"
class="docIconBtn"
id="docRedoBtn"
aria-label="Rétablir"
disabled
title="Rétablir (Ctrl+Y)">
<svg width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round">
<path d="M16 6l4 4-4 4" />
<path d="M20 10h-9a6 6 0 1 0 4.2 10.2" />
</svg>
</button>
<div class="docDividerV"></div>
<button type="button"
class="docBtnSecondary docBtnPrimary"
id="docPreviewBtn">
<svg width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round">
<path d="M2 12s3.5-6 10-6 10 6 10 6-3.5 6-10 6-10-6-10-6z" />
<circle cx="12" cy="12" r="3" />
</svg><span class="docBtnLabel">Aperçu</span>
</button>
<div class="docDividerV"></div>
<div class="docWidthPicker"
id="docWidthPicker"
role="group"
aria-label="Largeur d'aperçu">
<button type="button" class="docWidthBtn is-active" data-width="">Bureau</button>
<button type="button" class="docWidthBtn" data-width="768">Tablette</button>
<button type="button" class="docWidthBtn" data-width="375">Mobile</button>
</div>
<div class="docDividerV"></div>
<button type="button"
class="docIconBtn docThemeToggle"
id="docThemeToggle"
aria-label="Changer de thème"></button>
</div>
</div>
<div class="docBodyWrap">
<div class="docSidebarClose" id="docCloseLeft">← Retour au document</div>
<div class="docSidebar docSidebarLeft" id="docSidebarLeft">
<div class="docPageSection">
<div class="docSectionLabel">Pages</div>
<div class="docPageList" id="docPageList">
{% for page in pages %}
<div class="docPageListItem {{ 'is-active' if page.id == active_page.id else '' }}"
role="button"
tabindex="0"
data-page-id="{{ page.id }}">
{# //NOSONAR Web:S6819,Web:MouseEventWithoutKeyboardEquivalentCheck - div+role=button
volontaire : la rangée contient de vrais <button> d'action (monter/descendre/
renommer/supprimer), qu'un <button> englobant ne pourrait pas contenir
validement. L'équivalent clavier (Entrée/Espace) est posé côté JS
(forgeDocRenderPageList), donc le finding clavier de Sonar est un faux positif
: l'analyseur statique ne voit pas les addEventListener dynamiques. #}
<span class="docPageListTitle">{{ page.title }}</span>
<div class="docPageListActions">
<button type="button"
class="docPageListMove"
data-dir="up"
data-page-id="{{ page.id }}"
aria-label="Déplacer vers le haut"
title="Déplacer vers le haut">↑</button>
<button type="button"
class="docPageListMove"
data-dir="down"
data-page-id="{{ page.id }}"
aria-label="Déplacer vers le bas"
title="Déplacer vers le bas">↓</button>
<button type="button"
class="docPageListRename"
data-page-id="{{ page.id }}"
aria-label="Renommer cette page"
title="Renommer cette page">✎</button>
<button type="button"
class="docPageListDelete"
data-page-id="{{ page.id }}"
aria-label="Supprimer cette page"
title="Supprimer cette page">✕</button>
</div>
</div>
{% endfor %}
</div>
<button type="button" class="docBtnSecondary docPageListAdd" id="docPageListAdd">+ Ajouter une page</button>
</div>
{% for category_key, category in element_library.items() %}
<div>
<div class="docSectionLabel">{{ category.label }}</div>
<div class="docLibList">
{% for kind in category.kinds %}
<div class="docLibItem docLibItem--row"
draggable="true"
data-add="{{ kind }}">
<span class="docLibIcon docLibIcon--{{ kind }}"></span>
<span>{{ element_kind_labels[kind] }}</span>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
<div class="docCanvasArea" id="docCanvasArea">
<div class="docPage" id="docPage">
<div class="docPageContent" id="docPageContent">{{ rendered_document|safe }}</div>
{# //NOSONAR S5247 - rendered_document vient de document_engine.render_document, qui échappe (html.escape) tout contenu utilisateur avant interpolation (voir document_engine/rendering/render_document_element.py) ; jamais de HTML brut non échappé ici #}
</div>
<div class="docZoomPill">
<button type="button" id="docZoomOut" aria-label="Zoom -">−</button>
<span id="docZoomVal">100%</span>
<button type="button" id="docZoomIn" aria-label="Zoom +">+</button>
</div>
<div class="docPageNavPill" id="docPageNavPill">
<button type="button" id="docPagePrevBtn" aria-label="Page précédente">‹</button>
<span id="docPageNavLabel"></span>
<button type="button" id="docPageNextBtn" aria-label="Page suivante">›</button>
</div>
</div>
<div class="docSidebarClose" id="docCloseRight">← Retour au document</div>
<div class="docSidebar docSidebarRight" id="docSidebarRight">
<div id="docPropsPanel">
<div class="docSectionLabel">Propriétés</div>
<div class="docEmptyState">Sélectionnez un élément du document pour voir ses propriétés.</div>
</div>
</div>
</div>
<div class="docBottomNav" id="docBottomNav">
<button type="button" data-target="left">Éléments</button>
<button type="button" data-target="doc" class="is-active">Document</button>
<button type="button" data-target="right">Propriétés</button>
</div>
</div>
<div class="docModalBackdrop" id="docScenarioTreeModal">
<div class="docModalDialog">
<div class="docModalHeader">
<span class="docModalTitle" id="docScenarioTreeModalTitle">Arbre du scénario</span>
<button type="button"
class="docModalCloseBtn"
id="docScenarioTreeModalClose"
aria-label="Fermer">✕</button>
</div>
<div class="docModalBody" id="docScenarioTreeModalBody"></div>
</div>
</div>
<script>
window.FORGE_DOCUMENT = {
slug: {{ support.slug|tojson }},
elements: {{ elements|tojson }},
elementKindLabels: {{ element_kind_labels|tojson }},
pages: {{ pages|tojson }},
activePageId: {{ active_page.id|tojson }}
};
</script>
<script src="{{ url_for('static', filename='document/js/document-editor.js') }}"></script>
{% endblock %}