From cb97fb34109ec8d5738c50600b3d3ba52bd8a140 Mon Sep 17 00:00:00 2001
From: evanpelle <evanpelle@gmail.com>
Date: Wed, 18 Jun 2025 14:27:04 -0700
Subject: [PATCH] Delay win modal (#1224)

## Description:

Have the win modal come up on slight delay to allow ad loading. Have
buttons appear ~2 seconds later so there is enough ad dwell time.

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [x] I understand that submitting code with bugs that could have been
caught through manual testing blocks releases and new features for all
contributors

## Please put your Discord username so you can be contacted if a bug or
regression is found:

DISCORD_USERNAME
---
 src/client/graphics/layers/WinModal.ts | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/client/graphics/layers/WinModal.ts b/src/client/graphics/layers/WinModal.ts
index 93aac1c9f..e1c4e732b 100644
--- a/src/client/graphics/layers/WinModal.ts
+++ b/src/client/graphics/layers/WinModal.ts
@@ -18,6 +18,9 @@ export class WinModal extends LitElement implements Layer {
   @state()
   isVisible = false;
 
+  @state()
+  showButtons = false;
+
   private _title: string;
 
   // Override to prevent shadow DOM creation
@@ -136,7 +139,9 @@ export class WinModal extends LitElement implements Layer {
       <div class="win-modal ${this.isVisible ? "visible" : ""}">
         <h2>${this._title || ""}</h2>
         ${this.innerHtml()}
-        <div class="button-container">
+        <div
+          class="button-container ${this.showButtons ? "visible" : "hidden"}"
+        >
           <button @click=${this._handleExit}>
             ${translateText("win_modal.exit")}
           </button>
@@ -170,15 +175,22 @@ export class WinModal extends LitElement implements Layer {
   }
 
   show() {
-    this.isVisible = true;
-    this.requestUpdate();
     this.eventBus.emit(new GutterAdModalEvent(true));
+    setTimeout(() => {
+      this.isVisible = true;
+      this.requestUpdate();
+    }, 1500);
+    setTimeout(() => {
+      this.showButtons = true;
+      this.requestUpdate();
+    }, 3000);
   }
 
   hide() {
-    this.isVisible = false;
-    this.requestUpdate();
     this.eventBus.emit(new GutterAdModalEvent(false));
+    this.isVisible = false;
+    this.showButtons = false;
+    this.requestUpdate();
   }
 
   private _handleExit() {