Add win/lose game-ending flow
Removing all 3 locked files while the timer is still running now marks
the session WON immediately (checked right after every successful rm)
and broadcasts a "game_finished" signal over Mercure so every
connected player gets redirected together, not just the one who
removed the last file. A new /won/{session} route + won.html.twig
mirrors the existing lost flow (victory narrative + the same feedback
form).
The existing timer-expiry path already set LOST but always redirected
to lostUrl regardless of actual status; it now picks won/lost based on
the status the server reports.
Also fixes a pre-existing bug on the lost page (and would-be bug on
the new won page): PlayerService::GetCurrentlyActiveAsPlayer() only
matches players in READY/PLAYING sessions, so by the time a session
has ended it always returned null there, silently breaking the
feedback form. Both pages now look the player up directly via
PlayerRepository instead.
Added a navigatingAway flag so the page's "confirm before leaving"
prompt doesn't block our own win/lose redirects.
This commit is contained in:
@@ -20,6 +20,7 @@
|
||||
data-api-echo-url="{{ path('game_api_message')|e('html_attr') }}"
|
||||
data-api-check-finished-url="{{ path('game_api_check_finished', {session: session.id})|e('html_attr') }}"
|
||||
data-lost-url="{{ path('game_lost', {session: session.id})|e('html_attr') }}"
|
||||
data-won-url="{{ path('game_won', {session: session.id})|e('html_attr') }}"
|
||||
data-screen="{{ screen|e('html_attr') }}"
|
||||
{% if lock %}
|
||||
data-lock-locked-at="{{ lock.lockedAt }}"
|
||||
|
||||
@@ -0,0 +1,125 @@
|
||||
{% extends 'layout/site.html.twig' %}
|
||||
|
||||
{% block title %}Game Won - {{ session.game.name }}{% endblock %}
|
||||
|
||||
{% block stylesheets %}
|
||||
{{ parent() }}
|
||||
<style>
|
||||
.site-main {
|
||||
background-color: #1a1a1a;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
.card {
|
||||
background-color: #2d2d2d;
|
||||
border-color: #444;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
.form-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
.story-container {
|
||||
font-style: italic;
|
||||
border-left: 4px solid #28a745;
|
||||
padding-left: 20px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.donation-section {
|
||||
background-color: #333;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
.form-range::-webkit-slider-runnable-track {
|
||||
background-color: #444;
|
||||
}
|
||||
.form-range::-moz-range-track {
|
||||
background-color: #444;
|
||||
}
|
||||
.form-range::-webkit-slider-thumb {
|
||||
background-color: #28a745;
|
||||
}
|
||||
.form-range::-moz-range-thumb {
|
||||
background-color: #28a745;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<div class="card shadow-lg">
|
||||
<div class="card-header bg-success text-white">
|
||||
<h3 class="card-title mb-0">Game Won - Virus Contained!</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h4>{{ session.game.name }}</h4>
|
||||
<hr>
|
||||
|
||||
<div class="story-container">
|
||||
<p>
|
||||
The last protected file dissolves from the directory listing, and for a moment the mainframe goes quiet.
|
||||
Then the screens flood green: containment confirmed. The AI virus's grip on the server unravels file by file.
|
||||
</p>
|
||||
<p>
|
||||
Agents Doyle, Vega and Lennox are safe. Their identities were never decoded. In the days that follow,
|
||||
the agency quietly credits an anonymous team of specialists for the save - you.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="donation-section">
|
||||
<h5>Support the Developer</h5>
|
||||
<p>If you enjoyed the experience, please consider a small donation to help me create more games.</p>
|
||||
<a href="https://www.paypal.com/donate?hosted_button_id=X9X8KB6R6GMRU" target="_blank" class="btn btn-primary">
|
||||
<i class="bi bi-paypal"></i> Donate via PayPal
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="feedback-form mt-4">
|
||||
<h5>Feedback</h5>
|
||||
<form method="post">
|
||||
<div class="mb-3">
|
||||
<label for="difficulty" class="form-label">How would you rate the difficulty? (<span id="difficulty-val">5</span>/10)</label>
|
||||
<input type="range" class="form-range" min="1" max="10" step="1" id="difficulty" name="difficulty" value="5" oninput="document.getElementById('difficulty-val').innerText = this.value">
|
||||
<div class="d-flex justify-content-between mt-1">
|
||||
<small class="text-muted">Absolutely not</small>
|
||||
-
|
||||
<small class="text-muted">Absolutely</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="entertaining" class="form-label">How entertaining was it? (<span id="entertaining-val">5</span>/10)</label>
|
||||
<input type="range" class="form-range" min="1" max="10" step="1" id="entertaining" name="entertaining" value="5" oninput="document.getElementById('entertaining-val').innerText = this.value">
|
||||
<div class="d-flex justify-content-between mt-1">
|
||||
<small class="text-muted">Absolutely not</small>
|
||||
-
|
||||
<small class="text-muted">Absolutely</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="theme" class="form-label">How was the theme? (<span id="theme-val">5</span>/10)</label>
|
||||
<input type="range" class="form-range" min="1" max="10" step="1" id="theme" name="theme" value="5" oninput="document.getElementById('theme-val').innerText = this.value">
|
||||
<div class="d-flex justify-content-between mt-1">
|
||||
<small class="text-muted">Absolutely not</small>
|
||||
-
|
||||
<small class="text-muted">Absolutely</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="feedback" class="form-label">Additional Feedback</label>
|
||||
<textarea class="form-control" id="feedback" name="feedback" rows="4" placeholder="Tell us more about your experience..."></textarea>
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-2">
|
||||
<button type="submit" class="btn btn-success">Submit Feedback & Return to Dashboard</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user