mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-08-18 09:14:09 +00:00
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
This commit is contained in:
@@ -18,6 +18,9 @@ export class WinModal extends LitElement implements Layer {
|
|||||||
@state()
|
@state()
|
||||||
isVisible = false;
|
isVisible = false;
|
||||||
|
|
||||||
|
@state()
|
||||||
|
showButtons = false;
|
||||||
|
|
||||||
private _title: string;
|
private _title: string;
|
||||||
|
|
||||||
// Override to prevent shadow DOM creation
|
// Override to prevent shadow DOM creation
|
||||||
@@ -136,7 +139,9 @@ export class WinModal extends LitElement implements Layer {
|
|||||||
<div class="win-modal ${this.isVisible ? "visible" : ""}">
|
<div class="win-modal ${this.isVisible ? "visible" : ""}">
|
||||||
<h2>${this._title || ""}</h2>
|
<h2>${this._title || ""}</h2>
|
||||||
${this.innerHtml()}
|
${this.innerHtml()}
|
||||||
<div class="button-container">
|
<div
|
||||||
|
class="button-container ${this.showButtons ? "visible" : "hidden"}"
|
||||||
|
>
|
||||||
<button @click=${this._handleExit}>
|
<button @click=${this._handleExit}>
|
||||||
${translateText("win_modal.exit")}
|
${translateText("win_modal.exit")}
|
||||||
</button>
|
</button>
|
||||||
@@ -170,15 +175,22 @@ export class WinModal extends LitElement implements Layer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
show() {
|
show() {
|
||||||
this.isVisible = true;
|
|
||||||
this.requestUpdate();
|
|
||||||
this.eventBus.emit(new GutterAdModalEvent(true));
|
this.eventBus.emit(new GutterAdModalEvent(true));
|
||||||
|
setTimeout(() => {
|
||||||
|
this.isVisible = true;
|
||||||
|
this.requestUpdate();
|
||||||
|
}, 1500);
|
||||||
|
setTimeout(() => {
|
||||||
|
this.showButtons = true;
|
||||||
|
this.requestUpdate();
|
||||||
|
}, 3000);
|
||||||
}
|
}
|
||||||
|
|
||||||
hide() {
|
hide() {
|
||||||
this.isVisible = false;
|
|
||||||
this.requestUpdate();
|
|
||||||
this.eventBus.emit(new GutterAdModalEvent(false));
|
this.eventBus.emit(new GutterAdModalEvent(false));
|
||||||
|
this.isVisible = false;
|
||||||
|
this.showButtons = false;
|
||||||
|
this.requestUpdate();
|
||||||
}
|
}
|
||||||
|
|
||||||
private _handleExit() {
|
private _handleExit() {
|
||||||
|
|||||||
Reference in New Issue
Block a user