Lost page

assets/game1.js

@@ -131,6 +131,8 @@ document.addEventListener('DOMContentLoaded', async () => {
   const screen = cfgEl.dataset.screen;
   const apiPingUrl = cfgEl.dataset.apiPingUrl;
   const apiEchoUrl = cfgEl.dataset.apiEchoUrl;
+  const apiCheckFinishedUrl = cfgEl.dataset.apiCheckFinishedUrl;
+  const lostUrl = cfgEl.dataset.lostUrl;
 
   if (mercurePublicUrl && topic) {
     subscribeToMercure(mercurePublicUrl, topic, screen);
@@ -138,6 +140,52 @@ document.addEventListener('DOMContentLoaded', async () => {
     console.warn('[Mercure][game1] Missing data attributes on #mercure-config');
   }
 
+  // Timer logic
+  const timerEl = document.getElementById('game-timer');
+  if (timerEl && timerEl.dataset.endTime) {
+    const endTime = parseInt(timerEl.dataset.endTime) * 1000;
+
+    const updateTimer = async () => {
+      const now = Date.now();
+      const diff = endTime - now;
+
+      if (diff <= 0) {
+        timerEl.textContent = '00:00:00';
+
+        // Timer reached zero, check with server
+        if (apiCheckFinishedUrl && lostUrl) {
+          try {
+            const response = await fetchJson(apiCheckFinishedUrl, { method: 'POST' });
+            if (response && response.finished) {
+              window.location.href = lostUrl;
+              return; // Stop the timer loop
+            }
+          } catch (e) {
+            console.error('[API][game1] Failed to check finished status:', e);
+          }
+        }
+
+        // Even if check failed or not finished, stop the loop if diff <= 0
+        // (though technically if the server says not finished, we might want to keep checking,
+        // but 00:00:00 usually means it's over).
+        return;
+      }
+
+      const hours = Math.floor(diff / (1000 * 60 * 60));
+      const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
+      const seconds = Math.floor((diff % (1000 * 60)) / 1000);
+
+      const hDisplay = hours.toString().padStart(2, '0');
+      const mDisplay = minutes.toString().padStart(2, '0');
+      const sDisplay = seconds.toString().padStart(2, '0');
+
+      timerEl.textContent = `${hDisplay}:${mDisplay}:${sDisplay}`;
+      setTimeout(updateTimer, 1000);
+    };
+
+    updateTimer();
+  }
+
   // Demo API calls
   try {
     if (apiPingUrl) {

src/Game/Controller/GameApiController.php

@@ -3,7 +3,10 @@ declare(strict_types=1);
 
 namespace App\Game\Controller;
 
+use App\Game\Entity\Session;
+use App\Game\Enum\SessionStatus;
 use App\Game\Service\GameResponseService;
+use Doctrine\ORM\EntityManagerInterface;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Component\HttpFoundation\JsonResponse;
 use Symfony\Component\HttpFoundation\Request;
@@ -15,7 +18,9 @@ final class GameApiController extends AbstractController
 {
 
     public function __construct(
-            protected GameResponseService $gameResponseService) {
+            protected GameResponseService $gameResponseService,
+            private EntityManagerInterface $entityManager
+    ) {
 
     }
 
@@ -29,6 +34,30 @@ final class GameApiController extends AbstractController
         ]);
     }
 
+    #[Route('/check-finished/{session}', name: 'check_finished', methods: ['POST'])]
+    public function checkFinished(Session $session): JsonResponse
+    {
+        $now = (new \DateTime())->getTimestamp();
+        $isFinished = false;
+
+        if ($session->getStatus() === SessionStatus::PLAYING) {
+            if ($session->getTimer() !== null && $now >= $session->getTimer()) {
+                $session->setStatus(SessionStatus::LOST);
+                $this->entityManager->persist($session);
+                $this->entityManager->flush();
+                $isFinished = true;
+            }
+        } elseif ($session->getStatus() === SessionStatus::LOST || $session->getStatus() === SessionStatus::WON) {
+            $isFinished = true;
+        }
+
+        return $this->json([
+            'ok' => true,
+            'finished' => $isFinished,
+            'status' => $session->getStatus()->value,
+        ]);
+    }
+
     #[Route('/message', name: 'message', methods: ['POST'])]
     public function message(Request $request): JsonResponse
     {

src/Game/Controller/GameController.php

@@ -3,6 +3,7 @@ declare(strict_types=1);
 
 namespace App\Game\Controller;
 
+use App\Game\Entity\Player;
 use App\Game\Entity\Session;
 use App\Game\Entity\SessionSetting;
 use App\Game\Enum\SessionSettingType;
@@ -12,6 +13,7 @@ use App\Game\Repository\PlayerRepository;
 use App\Game\Repository\SessionRepository;
 use App\Game\Service\GameDashboardService;
 use App\Tech\Entity\User;
+use App\Game\Service\PlayerService;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Bundle\SecurityBundle\Security;
 use Symfony\Component\HttpFoundation\Request;
@@ -25,7 +27,8 @@ final class GameController extends AbstractController
 {
     public function __construct(
         #[Autowire('%env(MERCURE_PUBLIC_URL)%')]
-        private string $mercurePublicUrl
+        private string $mercurePublicUrl,
+        private \Doctrine\ORM\EntityManagerInterface $entityManager
     ) {
     }
 
@@ -153,10 +156,76 @@ final class GameController extends AbstractController
         }
 
         $screen = $player ? $player->getScreen() : 0;
+        $session_id = $session->getId();
 
         return $this->render('game/index.html.twig', [
             'session' => $session,
             'screen' => $screen,
+            'session_id' => $session_id,
         ]);
     }
+
+    #[Route(path: '/lost/{session}', name: 'game_lost', methods: ['GET', 'POST'])]
+    #[IsGranted(new Expression("is_granted('ROLE_PLAYER') or is_granted('ROLE_ADMIN')"))]
+    #[IsGranted('SESSION_VIEW', subject: 'session')]
+    public function lost(
+        Session $session,
+        Request $request,
+        Security $security,
+        PlayerService $playerService,
+        GameDashboardService $dashboardService
+    ): Response {
+        /** @var User $user */
+        $user = $security->getUser();
+        $player = $playerService->GetCurrentlyActiveAsPlayer($user);
+
+        if ($request->isMethod('POST')) {
+            $difficulty = $request->request->get('difficulty');
+            $entertaining = $request->request->get('entertaining');
+            $theme = $request->request->get('theme');
+            $feedback = $request->request->get('feedback');
+
+            // Save feedback
+            if ($player) {
+                $this->saveFeedback($session, $player, $difficulty, $entertaining, $theme, $feedback);
+                $this->addFlash('success', 'Thank you for your feedback!');
+                return $this->redirectToRoute('game_dashboard');
+            }
+        }
+
+        return $this->render('game/lost.html.twig', [
+            'session' => $session,
+        ]);
+    }
+
+    private function saveFeedback(Session $session, Player $player, $difficulty, $entertaining, $theme, $feedback): void
+    {
+        $settings = [
+            SessionSettingType::FEEDBACK_DIFFICULTY,
+            SessionSettingType::FEEDBACK_ENTERTAINING,
+            SessionSettingType::FEEDBACK_THEME,
+            SessionSettingType::FEEDBACK_TEXT,
+        ];
+
+        $values = [
+            $difficulty,
+            $entertaining,
+            $theme,
+            $feedback,
+        ];
+
+        foreach ($settings as $index => $type) {
+            $value = $values[$index];
+            if ($value === null || $value === '') continue;
+
+            $setting = new SessionSetting();
+            $setting->setSession($session);
+            $setting->setPlayer($player);
+            $setting->setName($type);
+            $setting->setValue((string)$value);
+            $this->entityManager->persist($setting);
+        }
+
+        $this->entityManager->flush();
+    }
 }

src/Game/Enum/SessionSettingType.php

@@ -70,4 +70,8 @@ enum SessionSettingType: string
     case READY_AT_FOR_PLAYER8 = 'ReadyAtForPlayer8';
     case READY_AT_FOR_PLAYER9 = 'ReadyAtForPlayer9';
     case READY_AT_FOR_PLAYER10 = 'ReadyAtForPlayer10';
+    case FEEDBACK_DIFFICULTY = 'FeedbackDifficulty';
+    case FEEDBACK_ENTERTAINING = 'FeedbackEntertaining';
+    case FEEDBACK_THEME = 'FeedbackTheme';
+    case FEEDBACK_TEXT = 'FeedbackText';
 }

src/Game/Service/GameDashboardService.php

@@ -391,6 +391,16 @@ final class GameDashboardService
 
         if ($readyPlayersCount === $numPlayers) {
             $session->setStatus(SessionStatus::PLAYING);
+
+            // Set the end timer
+            $game = $session->getGame();
+            /** @var \App\Game\Repository\GameSettingRepository $gameSettingRepo */
+            $gameSettingRepo = $this->entityManager->getRepository(\App\Game\Entity\GameSetting::class);
+            $totalTimeSetting = $gameSettingRepo->getSetting($game, \App\Game\Enum\GameSettingType::TOTAL_TIME);
+            $totalTime = $totalTimeSetting ? (int)$totalTimeSetting->getValue() : 3600; // Default to 60 minutes if not set
+
+            $session->setTimer((new \DateTime())->getTimestamp() + $totalTime);
+
             $this->entityManager->persist($session);
 
             // Clean up ready settings

templates/game/index.html.twig

@@ -18,12 +18,14 @@
              data-topic="{{ (mercure_topic_base ~ '/game/hub-' ~ session.id)|e('html_attr') }}"
              data-api-ping-url="{{ path('game_api_ping')|e('html_attr') }}"
              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-screen="{{ screen|e('html_attr') }}"
              style="display:none">
         </div>
 
-        <div id="game-timer">
+        <div id="game-timer" data-end-time="{{ session.timer }}">
-            00:30:00
+            --:--:--
         </div>
         <div id="message-container">
 

templates/game/lost.html.twig

@@ -0,0 +1,127 @@
+{% extends 'base.html.twig' %}
+
+{% block title %}Game Lost - {{ session.game.name }}{% endblock %}
+
+{% block stylesheets %}
+    {{ parent() }}
+    <style>
+        body {
+            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 #dc3545;
+            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: #dc3545;
+        }
+        .form-range::-moz-range-thumb {
+            background-color: #dc3545;
+        }
+    </style>
+{% endblock %}
+
+{% block body %}
+<div class="container mt-5 mb-5">
+    <div class="row justify-content-center">
+        <div class="col-md-8">
+            <div class="card shadow-lg">
+                <div class="card-header bg-danger text-white">
+                    <h3 class="card-title mb-0">Game Over - Time's Up!</h3>
+                </div>
+                <div class="card-body">
+                    <h4>{{ session.game.name }}</h4>
+                    <hr>
+
+                    <div class="story-container">
+                        <p>
+                            The screens flickered one last time before going completely dark. The hum of the servers ceased, replaced by an eerie silence.
+                            The server seems to have shut itself down before the AI virus could complete its task in decoding the undercover agents.
+                        </p>
+                        <p>
+                            In the days after some people are arrested for sabotaging the agency, but in the end nobody is convicted for the actions.
+                            Lets hope the agents which were undercover are safe and the information needed is still saved to put the other criminals behind bars.
+                        </p>
+                    </div>
+
+                    <div class="donation-section">
+                        <h5>Support the Developer</h5>
+                        <p>If you enjoyed the experience (even if you lost!), 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>
+</div>
+{% endblock %}