feat: add game config panel UI (template, Stimulus controller, CSS)
Config panel with toggle for watched films, hint type checkboxes, and multi-select for award types above the start game button. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -56,8 +56,64 @@
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="game-start-container">
|
||||
<form method="post" action="{{ path('app_game_start') }}" id="start-form">
|
||||
<form method="post" action="{{ path('app_game_start') }}" id="start-form"
|
||||
data-controller="game-config">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('game_start') }}">
|
||||
|
||||
<div class="config-panel">
|
||||
{% if app.user %}
|
||||
<div class="config-section">
|
||||
<label class="config-toggle">
|
||||
<span class="config-toggle-label">Films vus</span>
|
||||
<input type="checkbox" name="watched_only" value="1" class="toggle-switch">
|
||||
</label>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="config-section">
|
||||
<div class="config-section-title">Paramètres des indices</div>
|
||||
<div class="config-hint-types">
|
||||
<label class="config-checkbox">
|
||||
<input type="checkbox" name="hint_film" value="1" checked
|
||||
data-game-config-target="hintType">
|
||||
Film
|
||||
</label>
|
||||
<label class="config-checkbox">
|
||||
<input type="checkbox" name="hint_character" value="1" checked
|
||||
data-game-config-target="hintType">
|
||||
Rôle
|
||||
</label>
|
||||
<label class="config-checkbox">
|
||||
<input type="checkbox" name="hint_award" value="1" checked
|
||||
data-game-config-target="hintType"
|
||||
data-action="change->game-config#toggleAwardSection">
|
||||
Récompense
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="config-award-types" data-game-config-target="awardSection">
|
||||
<div class="config-section-subtitle">Récompenses</div>
|
||||
<div class="config-award-list">
|
||||
<label class="config-checkbox">
|
||||
<input type="checkbox" checked
|
||||
data-game-config-target="allAwards"
|
||||
data-action="change->game-config#toggleAllAwards">
|
||||
Toutes les récompenses
|
||||
</label>
|
||||
{% for awardType in awardTypes %}
|
||||
<label class="config-checkbox">
|
||||
<input type="checkbox" name="award_types[]"
|
||||
value="{{ awardType.id }}" checked
|
||||
data-game-config-target="awardType"
|
||||
data-action="change->game-config#syncAllAwards">
|
||||
{{ awardType.name }}
|
||||
</label>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-start">Commencer une partie</button>
|
||||
</form>
|
||||
<div class="start-loader" id="start-loader"></div>
|
||||
@@ -66,6 +122,11 @@
|
||||
<a href="{{ path('app_login') }}">Connectez-vous</a> pour importer vos propres films
|
||||
</p>
|
||||
{% endif %}
|
||||
|
||||
{% for message in app.flashes('error') %}
|
||||
<div class="flash-error">{{ message }}</div>
|
||||
{% endfor %}
|
||||
|
||||
<script>
|
||||
document.getElementById('start-form').addEventListener('submit', function () {
|
||||
this.style.display = 'none';
|
||||
|
||||
Reference in New Issue
Block a user