Forge-Store/Forge-Engine
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Remplace la création inline de variable par une page de gestion dédiée, redesign du tableau de bord du jeu

Browse Source 
Retrait de la création rapide de variable globale depuis le sélecteur de
la Condition de visibilité (bouton "+ Créer") : une variable globale est
désormais gérée comme un objet "jeu" à part entière, avec une vraie page
CRUD ("Variables", nouvelle entrée du menu de gauche) - création, édition
du type/valeur, suppression. Le nom reste volontairement immuable après
création (c'est par ce nom qu'une condition de visibilité ou une action
"Modifier une variable" la référence - la renommer casserait ces réglages
en silence), d'où db.update_global_variable qui ne touche que type/valeur.

Redesign du tableau de bord du jeu (game_dashboard.html) en deux
colonnes : à gauche tout ce qu'on peut créer (écrans, éléments de jeu,
variables, jouer, nouvel objet) plus les paramètres du jeu (renommer/
supprimer) ; à droite ce qui a déjà été créé (objets définis). Remplace
les cartes Bulma par le système de mise en page compact déjà défini dans
style.css (.twoCol/.listRow/.dangerZone/.addBtn) mais jamais utilisé
jusqu'ici - plus dense et cohérent avec le reste de l'éditeur.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
william
2026-08-25 10:00:35 +02:00
co-authored by Claude Sonnet 5
parent c04bc0b926
commit 11a2d397e8
12 changed files with 227 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/game_dashboard.html
+59 -71
View File
@@ -1,81 +1,69 @@
{% extends "base.html" %}
{% block title %}{{ game.name }} — Forge Engine{% endblock %}
{% block content_class %}content-wide{% endblock %}
{% block breadcrumb %}<li class="is-active"><a>{{ game.name }}</a></li>{% endblock %}
{% block content %}
<h1 class="title">{{ game.name }}</h1>
<p class="help mb-4">Base de données : projects/{{ game.slug }}/game.db</p>
<p class="hint mb-4">Base de données : projects/{{ game.slug }}/game.db</p>
<div class="columns">
<div class="column">
<a href="{{ url_for('screens_list', slug=game.slug) }}" class="card" style="height:100%;">
<div class="card-content">
<p class="title is-6">🖥️ Écrans du jeu</p>
<p class="subtitle is-7 has-text-grey">Créer et enchaîner les écrans jouables (accueil, formulaires, scènes...)</p>
</div>
</a>
</div>
<div class="column">
<a href="{{ url_for('element_types', slug=game.slug) }}" class="card" style="height:100%;">
<div class="card-content">
<p class="title is-6">🧩 Éléments de jeu</p>
<p class="subtitle is-7 has-text-grey">Catalogue réutilisable (Personnage, Outil, IA...)</p>
</div>
</a>
</div>
<div class="column">
<a href="{{ url_for('game_play', slug=game.slug) }}" target="_blank" class="card" style="height:100%;">
<div class="card-content">
<p class="title is-6">▶️ Jouer</p>
<p class="subtitle is-7 has-text-grey">Aperçu jouable du jeu</p>
</div>
</a>
</div>
</div>
<a href="{{ url_for('object_new', slug=game.slug) }}" class="card mb-4" style="display:block;">
<div class="card-content">
<p class="title is-6">➕ Définir un nouvel objet</p>
<p class="subtitle is-7 has-text-grey">Comme une table de base de données : un nom, et des champs typés</p>
</div>
</a>
<h2 class="subtitle">Objets définis</h2>
{% if definitions %}
<div class="table-container">
<table class="table is-fullwidth is-hoverable">
<tbody>
{% for d in definitions %}
<tr>
<td class="is-vcentered">
<a href="{{ url_for('object_view', slug=game.slug, definition_id=d.id) }}" class="has-text-weight-semibold">{{ d.name }}</a>
<br><span class="is-size-7 has-text-grey">table SQL : {{ d.table_name }}</span>
</td>
<td class="is-vcentered has-text-right">
<a class="button is-small" href="{{ url_for('object_edit', slug=game.slug, definition_id=d.id) }}" title="Modifier cet objet">✏️</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<p class="help">Aucun objet défini pour l'instant — un objet, c'est comme une table de base de données : un nom, et des champs typés.</p>
{% endif %}
<div class="box has-background-danger-dark mt-5">
<h3 class="title is-6 has-text-danger-light">⚠️ Paramètres du jeu</h3>
<form method="post" action="{{ url_for('game_rename', slug=game.slug) }}" class="field has-addons">
<div class="control is-expanded">
<label class="label has-text-danger-light" for="rename">Renommer le jeu</label>
<input class="input" type="text" id="rename" name="game_name" value="{{ game.name }}" required autocomplete="off">
<div class="twoCol">
<div class="colLeft">
<h2>Créer</h2>
<div class="list">
<a href="{{ url_for('screens_list', slug=game.slug) }}" class="listRow">
<div class="rowTitle">🖥️ Écrans du jeu</div>
<div class="rowSub">Créer et enchaîner les écrans jouables (accueil, formulaires, scènes...)</div>
</a>
<a href="{{ url_for('element_types', slug=game.slug) }}" class="listRow">
<div class="rowTitle">🧩 Éléments de jeu</div>
<div class="rowSub">Catalogue réutilisable (Personnage, Outil, IA...)</div>
</a>
<a href="{{ url_for('game_variables', slug=game.slug) }}" class="listRow">
<div class="rowTitle">🔧 Variables</div>
<div class="rowSub">Valeurs globales au jeu entier (ex. porte ouverte, niveau débloqué...)</div>
</a>
<a href="{{ url_for('game_play', slug=game.slug) }}" target="_blank" class="listRow">
<div class="rowTitle">▶️ Jouer</div>
<div class="rowSub">Aperçu jouable du jeu</div>
</a>
</div>
<div class="control" style="align-self:flex-end;">
<button type="submit" class="button">Renommer</button>
<a href="{{ url_for('object_new', slug=game.slug) }}" class="addBtn">➕ Définir un nouvel objet</a>
<div class="dangerZone">
<h3>Paramètres du jeu</h3>
<form method="post" action="{{ url_for('game_rename', slug=game.slug) }}">
<label for="rename">Renommer le jeu</label>
<div class="fieldRow">
<input type="text" id="rename" name="game_name" value="{{ game.name }}" required autocomplete="off">
<button type="submit">Renommer</button>
</div>
</form>
<form method="post" action="{{ url_for('game_delete', slug=game.slug) }}" class="actionsRow"
onsubmit="return confirm('Supprimer définitivement le jeu « {{ game.name }} », son dossier et sa base de données ? Cette action est irréversible.');">
<button type="submit" class="danger">🗑️ Supprimer ce jeu</button>
</form>
</div>
</form>
<form method="post" action="{{ url_for('game_delete', slug=game.slug) }}" class="mt-4"
onsubmit="return confirm('Supprimer définitivement le jeu « {{ game.name }} », son dossier et sa base de données ? Cette action est irréversible.');">
<button type="submit" class="button is-danger">🗑️ Supprimer ce jeu</button>
</form>
</div>
<div class="colRight">
<h2>Objets définis</h2>
{% if definitions %}
<div class="list">
{% for d in definitions %}
<div class="listRow listRowFlex">
<a href="{{ url_for('object_view', slug=game.slug, definition_id=d.id) }}" class="rowLink">
<div class="rowTitle">{{ d.name }}</div>
<div class="rowSub">table SQL : {{ d.table_name }}</div>
</a>
<div class="rowActions">
<a class="button is-small" href="{{ url_for('object_edit', slug=game.slug, definition_id=d.id) }}" title="Modifier cet objet">✏️</a>
</div>
</div>
{% endfor %}
</div>
{% else %}
<p class="hint">Aucun objet défini pour l'instant — un objet, c'est comme une table de base de données : un nom, et des champs typés.</p>
{% endif %}
</div>
</div>
{% endblock %}
templates/game_variables.html
+66
View File
@@ -0,0 +1,66 @@
{% extends "base.html" %}
{% block title %}Variables — {{ game.name }}{% endblock %}
{% block content_class %}content-wide{% endblock %}
{% block breadcrumb %}
<li><a href="{{ url_for('game_dashboard', slug=game.slug) }}">{{ game.name }}</a></li>
<li class="is-active"><a>Variables</a></li>
{% endblock %}
{% block content %}
<h1 class="title">Variables globales</h1>
<p class="hint mb-4">Des propriétés/valeurs communes à tout le jeu (pas attachées à un objet de données précis) — utile par exemple pour une porte ouverte ou non, un niveau débloqué... Une variable peut être lue dans une "Condition de visibilité" (propriétés d'un élément) et modifiée par une action "Modifier une variable" (Logique de la scène).</p>
<form method="post" action="{{ url_for('create_global_var', slug=game.slug) }}" class="card">
<h3>Nouvelle variable</h3>
<div class="fieldRow">
<div class="formField">
<label for="new-var-name">Nom</label>
<input type="text" id="new-var-name" name="name" placeholder="ex. porte_ouverte" required autocomplete="off">
</div>
<div class="formField">
<label for="new-var-type">Type</label>
<select id="new-var-type" name="type">
{% for key, val in variable_types.items() %}
<option value="{{ key }}">{{ val.label }}</option>
{% endfor %}
</select>
</div>
<div class="formField">
<label for="new-var-value">Valeur de départ</label>
<input type="text" id="new-var-value" name="default_value" placeholder="ex. 0" autocomplete="off">
</div>
</div>
<div class="actionsRow"><button type="submit" class="primary">+ Créer la variable</button></div>
</form>
<h2>Variables définies</h2>
{% if variables %}
<div class="list">
{% for v in variables %}
<form method="post" action="{{ url_for('global_var_edit', slug=game.slug, var_id=v.id) }}" id="varEditForm{{ v.id }}"></form>
<div class="listRow">
<div class="listRowFlex">
<div class="rowLink">
<div class="rowTitle">{{ v.name }}</div>
<div class="rowSub">valeur actuelle : {{ v.value if v.value is not none and v.value != '' else '(vide)' }}</div>
</div>
<div class="rowActions">
<select form="varEditForm{{ v.id }}" name="type" aria-label="Type de « {{ v.name }} »">
{% for key, val in variable_types.items() %}
<option value="{{ key }}" {{ 'selected' if v.type == key else '' }}>{{ val.label }}</option>
{% endfor %}
</select>
<input type="text" form="varEditForm{{ v.id }}" name="value" value="{{ v.value or '' }}" aria-label="Valeur de « {{ v.name }} »" style="width:120px;">
<button type="submit" form="varEditForm{{ v.id }}" class="smallBtn">Enregistrer</button>
<form method="post" action="{{ url_for('global_var_delete', slug=game.slug, var_id=v.id) }}"
onsubmit="return confirm('Supprimer la variable « {{ v.name }} » ? Toute condition de visibilité ou action qui la référence cessera de fonctionner.');">
<button type="submit" class="smallBtn danger">🗑️</button>
</form>
</div>
</div>
</div>
{% endfor %}
</div>
{% else %}
<p class="hint">Aucune variable pour l'instant — crée la première ci-dessus.</p>
{% endif %}
{% endblock %}
templates/screen_edit.html
+1 -22
View File
@@ -449,7 +449,7 @@
</div>
</div>
{% if c.key == 'visibilite_cond_variable' %}
<button type="button" class="button is-small is-fullwidth" style="margin-top:6px;" onclick="createVisCondVariable()">+ Créer une nouvelle variable</button>
<p class="help">Pas la variable qu'il te faut ? <a href="{{ url_for('game_variables', slug=game.slug) }}" target="_blank">Gérer les variables du jeu ↗</a></p>
{% endif %}
{% endif %}
{% endif %}
@@ -1530,27 +1530,6 @@ function bindJaugeDefinitionSelect() {
// globale, ou champ d'un objet) — les deux autres restent en base (peu
// importe, seul le mode courant est lu par is_element_visible()) mais sont
// masqués pour ne pas embrouiller. ----------
function createVisCondVariable() {
var name = window.prompt("Nom de la nouvelle variable globale (ex. niveau_debloque) :");
if (!name || !name.trim()) return;
var body = new URLSearchParams({ name: name.trim(), type: 'texte', default_value: '' });
fetch("{{ url_for('create_global_var', slug=game.slug) }}", { method: 'POST', body: body })
.then(function (r) { return r.json(); })
.then(function (json) {
if (!json.ok) { window.alert(json.error || "Échec de la création."); return; }
var sel = document.getElementById('field-visibilite_cond_variable');
if (!sel) return;
if (!sel.querySelector('option[value="' + CSS.escape(json.name) + '"]')) {
var opt = document.createElement('option');
opt.value = json.name;
opt.textContent = json.name;
sel.appendChild(opt);
}
sel.value = json.name;
submitPropsForm();
});
}
function toggleVisCondFields(sel) {
var mode = sel.value;
document.querySelectorAll('.visCondRow').forEach(function (row) {