From 65450a5719d2a9b69c0ebd3d4635d592208311e5 Mon Sep 17 00:00:00 2001 From: william Date: Thu, 27 Aug 2026 10:15:37 +0200 Subject: [PATCH] =?UTF-8?q?Refait=20le=20dashboard=20en=20fen=C3=AAtre=20?= =?UTF-8?q?=C3=A0=20onglets=20avec=20de=20vrais=20tableaux?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Le précédent dashboard (grille de cartes compactes) ne correspondait pas à ce que l'utilisateur voulait : une seule fenêtre avec de vrais tableaux de données (denses, colonnes nettes), un bouton "Créer" par catégorie dans l'en-tête, et une navigation horizontale pour passer d'une catégorie à l'autre. Réutilise telles quelles .builderTabs/.builderTabBtn/.builderTabPanel (déjà utilisées pour "Écran / Logique / Timeline" dans l'éditeur d'écran) plutôt que d'inventer un 2e système d'onglets — même sensation partout dans l'outil. Un onglet par catégorie (Écrans/Objets/Éléments de jeu/Variables), chacun avec : - un bouton "+ Créer" dans l'en-tête qui révèle une barre de création compacte (repliée par défaut) — sauf pour les Objets, dont la création (plusieurs champs typés) reste sur sa propre page dédiée, trop complexe pour tenir dans une barre ; - le VRAI tableau de gestion de cette catégorie (colonnes, actions), repris tel quel de screens_list.html/element_types.html/ game_variables.html plutôt que réinventé en version appauvrie. La page défile désormais normalement (retrait de body.objectEditBody/ content-objectEdit, pensés pour une hauteur figée avec défilement interne) — une liste peut être longue, pas besoin d'un défilement séparé par panneau ici. routes/games/game_dashboard.py fournit en plus variable_types (db.GLOBAL_VARIABLE_TYPES) pour la barre de création de variable. Co-Authored-By: Claude Sonnet 5 --- routes/games/game_dashboard.py | 1 + static/style.css | 26 +-- templates/game_dashboard.html | 280 ++++++++++++++++++++++++--------- 3 files changed, 216 insertions(+), 91 deletions(-) diff --git a/routes/games/game_dashboard.py b/routes/games/game_dashboard.py index de93aaee..4cee98ad 100644 --- a/routes/games/game_dashboard.py +++ b/routes/games/game_dashboard.py @@ -24,4 +24,5 @@ def game_dashboard(slug): "game_dashboard.html", game=game, definitions=definitions, screen_list=screen_list, element_types=element_types, element_type_usage=element_type_usage, variables=variables, + variable_types=db.GLOBAL_VARIABLE_TYPES, ) diff --git a/static/style.css b/static/style.css index 23dd0df4..b92f902f 100644 --- a/static/style.css +++ b/static/style.css @@ -494,16 +494,16 @@ code{ background:var(--panel2); border:1px solid var(--border); border-radius:4p .animKeyframeRow textarea{ font-family:monospace; font-size:11px; } /* ---------- Tableau de bord d'un jeu (game_dashboard.html) ---------- */ -/* Résumé/point d'entrée : une carte par catégorie (écrans, objets, - éléments de jeu, variables), toutes de même hauteur dans leur ligne - (align-items:stretch, par défaut en grid) pour un rendu net même quand - une carte a beaucoup plus d'entrées qu'une autre. */ -.dashboardGrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:16px; margin-top:8px; } -.dashboardCard{ display:flex; flex-direction:column; border:1px solid var(--border); border-radius:10px; padding:16px; background:var(--panel); } -.dashboardCard h2{ display:flex; align-items:center; justify-content:space-between; margin:0 0 10px; } -.dashboardCardCount{ font-size:11px; color:var(--text-dim); background:var(--panel2); border-radius:999px; padding:2px 8px; text-transform:none; letter-spacing:0; } -.dashboardCardList{ display:flex; flex-direction:column; gap:2px; flex:1 1 auto; min-height:0; } -.dashboardCardItem{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 8px; border-radius:6px; text-decoration:none; color:var(--text); font-size:12.5px; } -a.dashboardCardItem:hover{ background:var(--panel2); } -.dashboardCardItem span:first-child{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } -.dashboardCardFooter{ margin-top:10px; padding-top:10px; border-top:1px solid var(--border); font-size:12.5px; } +/* Une seule fenêtre, un onglet par catégorie (écrans/objets/éléments de + jeu/variables) — réutilise .builderTabs/.builderTabBtn/.builderTabPanel + (voir plus bas, éditeur d'écran) pour la même sensation de "fenêtre à + onglets" qu'ailleurs dans l'outil, plutôt que d'inventer un 2e système. + Contrairement à leur usage dans l'éditeur d'écran, ici la page défile + normalement (pas de hauteur figée) : une liste peut être longue, pas + besoin d'un défilement interne séparé par panneau. */ +.dashTabCount{ font-size:10px; color:var(--text-dim); background:var(--panel2); border-radius:999px; padding:1px 6px; margin-left:4px; } +.dashPanelHeader{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; } +.dashPanelHeader h2{ margin:0; } +.dashCreateBar{ display:flex; gap:8px; align-items:center; margin-bottom:12px; padding:10px; border:1px solid var(--border); border-radius:8px; background:var(--panel); } +.dashCreateBar input, .dashCreateBar select{ width:auto; flex:1 1 160px; } +.dashDangerZone{ margin-top:28px; } diff --git a/templates/game_dashboard.html b/templates/game_dashboard.html index aae0ef67..4627b2dc 100644 --- a/templates/game_dashboard.html +++ b/templates/game_dashboard.html @@ -3,87 +3,192 @@ {% block content_class %}content-wide{% endblock %} {% block content %}

{{ game.name }}

-

Base de données : projects/{{ game.slug }}/game.db

+

Base de données : projects/{{ game.slug }}/game.db

-
-
-

🖥️ Écrans du jeu {{ screen_list|length }}

- {% if screen_list %} -
- {% for s in screen_list %} - - {{ s.name }} - {% if loop.first %}★ Départ{% endif %} - - {% endfor %} -
- {% else %} -

Aucun écran pour l'instant.

- {% endif %} -
- Gérer les écrans → -
-
- -
-

🗂️ Objets {{ definitions|length }}

- {% if definitions %} -
- {% for d in definitions %} - - {{ d.name }} - {{ d.table_name }} - - {% endfor %} -
- {% else %} -

Aucun objet pour l'instant.

- {% endif %} -
- + Nouvel objet → -
-
- -
-

🧩 Éléments de jeu {{ element_types|length }}

- {% if element_types %} -
- {% for t in element_types %} - - {{ t.icon or '🧩' }} {{ t.name }} - {{ element_type_usage.get(t.id, 0) }} instance(s) - - {% endfor %} -
- {% else %} -

Aucun élément de jeu pour l'instant.

- {% endif %} -
- Gérer les éléments de jeu → -
-
- -
-

🔧 Variables {{ variables|length }}

- {% if variables %} -
- {% for v in variables %} -
- {{ v.name }} - {{ v.value or '' }} -
- {% endfor %} -
- {% else %} -

Aucune variable pour l'instant.

- {% endif %} -
- Gérer les variables → -
-
+ +
+ + + +
-
+ +
+
+

Écrans du jeu

+ +
+ + {% if screen_list %} +
+ + + + {% for s in screen_list %} + + + + + + {% endfor %} + +
#Nom
{{ loop.index }} + {{ s.name }} + {% if loop.first %} ★ Départ{% endif %} + +
+
+ ✏️ +
+ +
+
+
+ {% else %} +

Aucun écran pour l'instant.

+ {% endif %} +
+ + +
+
+

Objets

+ + Nouvel objet +
+

Un objet a des champs typés (nombre, texte, relation...) — sa création se fait sur sa propre page.

+ {% if definitions %} +
+ + + + {% for d in definitions %} + + + + + + {% endfor %} + +
NomTable SQL
{{ d.name }}{{ d.table_name }} + ✏️ +
+
+ {% else %} +

Aucun objet pour l'instant.

+ {% endif %} +
+ + +
+
+

Éléments de jeu

+ +
+ + {% if element_types %} +
+ + + + {% for t in element_types %} + + + + + + {% endfor %} + +
NomUsage
{{ t.icon or '🧩' }} {{ t.name }} + {{ element_type_usage.get(t.id, 0) }} instance(s) + {% if t.bound_definition_id %} + {% for d in definitions %}{% if d.id == t.bound_definition_id %} · « {{ d.name }} »{% endif %}{% endfor %} + {% endif %} + + ✏️ +
+ +
+
+
+ {% else %} +

Aucun élément de jeu pour l'instant.

+ {% endif %} +
+ + +
+
+

Variables

+ +
+ + {% if variables %} + {% for v in variables %} +
+ {% endfor %} +
+ + + + {% for v in variables %} + + + + + + + {% endfor %} + +
NomTypeValeur
{{ v.name }} + + + +
+ +
+
+
+ {% else %} +

Aucune variable pour l'instant.

+ {% endif %} +
+ +

Paramètres du jeu

@@ -97,4 +202,23 @@
+ + {% endblock %}