From db5c70d02a646b83ba6e4043e28fc0dc9f76fb04 Mon Sep 17 00:00:00 2001
From: Janis <janis-e@gmx.de>
Date: Tue, 6 Jan 2026 12:07:08 +0100
Subject: [PATCH] feat: Enhance win effects and animations in OfflineView
 component

---
 docker-entrypoint.sh      |  5 +++--
 public/env.js             |  2 +-
 public/env.template.js    |  2 +-
 src/services/ws.ts        |  3 +++
 src/views/OfflineView.vue | 16 ++++++++--------
 5 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/docker-entrypoint.sh b/docker-entrypoint.sh
index 91709d5..52ef8d2 100644
--- a/docker-entrypoint.sh
+++ b/docker-entrypoint.sh
@@ -7,8 +7,9 @@ TARGET_PATH="/usr/share/nginx/html/env.js"
 
 if [ -f "$TEMPLATE_PATH" ]; then
   echo "Rendering runtime config from $TEMPLATE_PATH"
-  # export all variables for envsubst to access
-  # only substitute variables present in the template
+  echo "Using environment variables:"
+  printenv
+  echo "----"
   envsubst < "$TEMPLATE_PATH" > "$TARGET_PATH"
 else
   echo "No runtime template found at $TEMPLATE_PATH, skipping"
diff --git a/public/env.js b/public/env.js
index 430b3cc..e467214 100644
--- a/public/env.js
+++ b/public/env.js
@@ -1,5 +1,5 @@
 window.__RUNTIME_CONFIG__ = {
   API_URL: "http://localhost:9000",
-  WEBSOCKET_API_URL: "ws://localhost:9000/websocket"
+  WEBSOCKET_URL: "ws://localhost:9000/websocket"
 };
 
diff --git a/public/env.template.js b/public/env.template.js
index b9d921c..188adf5 100644
--- a/public/env.template.js
+++ b/public/env.template.js
@@ -1,5 +1,5 @@
 window.__RUNTIME_CONFIG__ = {
   API_URL: "${API_URL}",
-  WEBSOCKET_API_URL: "${WEBSOCKET_API_URL}"
+  WEBSOCKET_URL: "${WEBSOCKET_URL}"
 };
 
diff --git a/src/services/ws.ts b/src/services/ws.ts
index 5d2d0b6..97bacc6 100644
--- a/src/services/ws.ts
+++ b/src/services/ws.ts
@@ -172,6 +172,9 @@ function setupSocketHandlers(socket: WebSocket) {
 }
 
 export function connectWebSocket(url?: string): Promise<void> {
+  if (!url) {
+    url = window.__RUNTIME_CONFIG__?.WEBSOCKET_URL
+  }
   if (!url) {
     const loc = window.location;
     const protocol = loc.protocol === "https:" ? "wss:" : "ws:";
diff --git a/src/views/OfflineView.vue b/src/views/OfflineView.vue
index 8f1eff1..4acb515 100644
--- a/src/views/OfflineView.vue
+++ b/src/views/OfflineView.vue
@@ -47,28 +47,28 @@ const spin = (): void => {
   const base1 = base0 + gap;
   const base2 = base1 + gap;
   setTimeout(() => {
-    reelStates.value[0].isSpinning = false;
+    reelStates.value[0]!!.isSpinning = false;
   }, base0);
   setTimeout(() => {
-    reelStates.value[1].isSpinning = false;
+    reelStates.value[1]!!.isSpinning = false;
   }, base1);
   setTimeout(() => {
-    const firstTwoMatch = reelStates.value[0].value === reelStates.value[1].value &&
-      reelStates.value[0].value !== '❓';
+    const firstTwoMatch = reelStates.value[0]!!.value === reelStates!!.value[1]!!.value &&
+      reelStates.value[0]!!.value !== '❓';
     const extraDelay = firstTwoMatch ? 1000 : 0;
 
     glowThird.value = firstTwoMatch;
 
     setTimeout(() => {
-      reelStates.value[2].isSpinning = false;
+      reelStates.value[2]!!.isSpinning = false;
       glowThird.value = false;
       globalSpinning.value = false;
       hasSpun.value = true;
 
       const allThreeMatch =
-        reelStates.value[0].value !== '❓' &&
-        reelStates.value[0].value === reelStates.value[1].value &&
-        reelStates.value[1].value === reelStates.value[2].value;
+        reelStates.value[0]!!.value !== '❓' &&
+        reelStates.value[0]!!.value === reelStates.value[1]!!.value &&
+        reelStates.value[1]!!.value === reelStates.value[2]!!.value;
       if (allThreeMatch) {
         winFire.value = true;
         winBlink.value = true;