@@ -120,14 +119,27 @@ export class WinModal extends LitElement implements Layer {
return;
}
- const pattern = purchasable[Math.floor(Math.random() * purchasable.length)];
+ // Shuffle the array and take patterns based on screen size
+ const shuffled = [...purchasable].sort(() => Math.random() - 0.5);
+ const isMobile = window.innerWidth < 768; // md breakpoint
+ const maxPatterns = isMobile ? 1 : 3;
+ const selectedPatterns = shuffled.slice(
+ 0,
+ Math.min(maxPatterns, shuffled.length),
+ );
this.patternContent = html`
- {}}
- .onPurchase=${(p: Pattern) => handlePurchase(p)}
- >
+
+ ${selectedPatterns.map(
+ (pattern) => html`
+
{}}
+ .onPurchase=${(p: Pattern) => handlePurchase(p)}
+ >
+ `,
+ )}
+
`;
}
@@ -146,11 +158,8 @@ export class WinModal extends LitElement implements Layer {
async show() {
await this.loadPatternContent();
- this.eventBus.emit(new GutterAdModalEvent(true));
- setTimeout(() => {
- this.isVisible = true;
- this.requestUpdate();
- }, 1500);
+ this.isVisible = true;
+ this.requestUpdate();
setTimeout(() => {
this.showButtons = true;
this.requestUpdate();
@@ -158,7 +167,6 @@ export class WinModal extends LitElement implements Layer {
}
hide() {
- this.eventBus.emit(new GutterAdModalEvent(false));
this.isVisible = false;
this.showButtons = false;
this.requestUpdate();