From 112326f48ad447e9b6df99cd4edc43700a2e3594 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Wed, 14 Jan 2026 22:56:09 -0500 Subject: [PATCH 1/8] feat: Add alliance request panel with colored circle indicators (#2905) - Add AllianceRequestPanel component showing colored circles for incoming alliance requests and renewal notifications - Circles display player color with countdown overlay showing time remaining - Hover popup shows player name, seconds remaining, accept/reject buttons - Different icons: blue ? for requests, orange hourglass for renewals, green pulsing for 'wants to renew' - Move alliance request/renewal UI from EventsDisplay chat to dedicated panel - Position panel to left of chat at bottom right of screen --- index.html | 16 +- src/client/graphics/GameRenderer.ts | 11 + .../graphics/layers/AllianceRequestPanel.ts | 669 ++++++++++++++++++ src/client/graphics/layers/EventsDisplay.ts | 115 +-- src/core/configuration/DefaultConfig.ts | 2 +- 5 files changed, 694 insertions(+), 119 deletions(-) create mode 100644 src/client/graphics/layers/AllianceRequestPanel.ts diff --git a/index.html b/index.html index cad490b1ca..c85749ce47 100644 --- a/index.html +++ b/index.html @@ -241,17 +241,21 @@
-
- - -
+
+ +
+ + +
+
+ diff --git a/src/client/graphics/GameRenderer.ts b/src/client/graphics/GameRenderer.ts index b4cd3eb386..37562f4ec4 100644 --- a/src/client/graphics/GameRenderer.ts +++ b/src/client/graphics/GameRenderer.ts @@ -8,6 +8,7 @@ import { TransformHandler } from "./TransformHandler"; import { UIState } from "./UIState"; import { AdTimer } from "./layers/AdTimer"; import { AlertFrame } from "./layers/AlertFrame"; +import { AllianceRequestPanel } from "./layers/AllianceRequestPanel"; import { BuildMenu } from "./layers/BuildMenu"; import { ChatDisplay } from "./layers/ChatDisplay"; import { ChatModal } from "./layers/ChatModal"; @@ -122,6 +123,15 @@ export function createRenderer( eventsDisplay.game = game; eventsDisplay.uiState = uiState; + const allianceRequestPanel = document.querySelector( + "alliance-request-panel", + ) as AllianceRequestPanel; + if (!(allianceRequestPanel instanceof AllianceRequestPanel)) { + console.error("alliance request panel not found"); + } + allianceRequestPanel.eventBus = eventBus; + allianceRequestPanel.game = game; + const chatDisplay = document.querySelector("chat-display") as ChatDisplay; if (!(chatDisplay instanceof ChatDisplay)) { console.error("chat display not found"); @@ -261,6 +271,7 @@ export function createRenderer( new DynamicUILayer(game, transformHandler, eventBus), new NameLayer(game, transformHandler, eventBus), eventsDisplay, + allianceRequestPanel, chatDisplay, buildMenu, new MainRadialMenu( diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts new file mode 100644 index 0000000000..80cf134935 --- /dev/null +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -0,0 +1,669 @@ +import { html, LitElement } from "lit"; +import { customElement, state } from "lit/decorators.js"; +import { EventBus } from "../../../core/EventBus"; +import { MessageType, Tick } from "../../../core/game/Game"; +import { + AllianceRequestReplyUpdate, + AllianceRequestUpdate, + GameUpdateType, +} from "../../../core/game/GameUpdates"; +import { GameView, PlayerView } from "../../../core/game/GameView"; +import { + SendAllianceExtensionIntentEvent, + SendAllianceReplyIntentEvent, +} from "../../Transport"; +import { translateText } from "../../Utils"; +import { Layer } from "./Layer"; +import { GoToPlayerEvent } from "./Leaderboard"; + +interface AllianceIndicator { + id: string; + type: "request" | "renewal"; + playerSmallID: number; + playerName: string; + playerColor: string; + createdAt: Tick; + duration: Tick; + // For requests + requestorView?: PlayerView; + recipientView?: PlayerView; + // For renewals + allianceID?: number; + otherPlayerView?: PlayerView; + otherPlayerWantsRenewal?: boolean; +} + +@customElement("alliance-request-panel") +export class AllianceRequestPanel extends LitElement implements Layer { + public eventBus: EventBus; + public game: GameView; + + private active: boolean = false; + @state() private indicators: AllianceIndicator[] = []; + @state() private hoveredIndicator: string | null = null; + @state() private popupHovered: boolean = false; + + // Queue of pending indicator additions while popup is open + private pendingIndicators: AllianceIndicator[] = []; + // Set of indicator IDs to remove when popup closes + private pendingRemovals: Set = new Set(); + + // allianceID -> last checked at tick (for renewal notifications) + private alliancesCheckedAt = new Map(); + + private updateMap = [ + [GameUpdateType.AllianceRequest, this.onAllianceRequestEvent.bind(this)], + [ + GameUpdateType.AllianceRequestReply, + this.onAllianceRequestReplyEvent.bind(this), + ], + ] as const; + + constructor() { + super(); + this.indicators = []; + } + + init() {} + + tick() { + this.active = true; + + const myPlayer = this.game.myPlayer(); + if (!myPlayer || !myPlayer.isAlive()) { + return; + } + + // If popup is open, don't modify the indicators list at all + // Queue changes to apply when popup closes + if (this.popupHovered) { + // Still check for new events but queue them + this.checkForAllianceExpirations(); + const updates = this.game.updatesSinceLastTick(); + if (updates) { + for (const [ut, fn] of this.updateMap) { + updates[ut]?.forEach(fn as (event: unknown) => void); + } + } + // Mark expired indicators for removal later + for (const indicator of this.indicators) { + const isExpired = + this.game.ticks() - indicator.createdAt >= indicator.duration || + this.shouldDeleteIndicator(indicator); + if (isExpired) { + this.pendingRemovals.add(indicator.id); + // If the hovered indicator expired, force close popup and apply changes + if (indicator.id === this.hoveredIndicator) { + this.popupHovered = false; + this.hoveredIndicator = null; + this.flushPendingChanges(); + return; + } + } + } + // Still update for countdown animation even when popup is hovered + this.requestUpdate(); + return; + } + + this.checkForAllianceExpirations(); + + const updates = this.game.updatesSinceLastTick(); + if (updates) { + for (const [ut, fn] of this.updateMap) { + updates[ut]?.forEach(fn as (event: unknown) => void); + } + } + + // Remove expired indicators + const remainingIndicators = this.indicators.filter((indicator) => { + const shouldKeep = + this.game.ticks() - indicator.createdAt < indicator.duration && + !this.shouldDeleteIndicator(indicator); + return shouldKeep; + }); + + if (this.indicators.length !== remainingIndicators.length) { + this.indicators = remainingIndicators; + } + // Always request update for countdown overlay animation + this.requestUpdate(); + } + + private shouldDeleteIndicator(indicator: AllianceIndicator): boolean { + if (indicator.type === "request") { + // Check if requestor and recipient are now allied + if (indicator.requestorView && indicator.recipientView) { + return indicator.requestorView.isAlliedWith(indicator.recipientView); + } + } else if (indicator.type === "renewal") { + // Check if the alliance still exists and is still in expiration window + const myPlayer = this.game.myPlayer(); + if (!myPlayer) return true; + + const alliance = myPlayer + .alliances() + .find((a) => a.id === indicator.allianceID); + + // Alliance no longer exists (expired or broken) + if (!alliance) return true; + + // Alliance was renewed (expiresAt is now far in the future) + if ( + alliance.expiresAt > + this.game.ticks() + this.game.config().allianceExtensionPromptOffset() + ) { + return true; + } + } + return false; + } + + private checkForAllianceExpirations() { + const myPlayer = this.game.myPlayer(); + if (!myPlayer?.isAlive()) return; + + for (const alliance of myPlayer.alliances()) { + if ( + alliance.expiresAt > + this.game.ticks() + this.game.config().allianceExtensionPromptOffset() + ) { + continue; + } + + if ( + (this.alliancesCheckedAt.get(alliance.id) ?? 0) >= + this.game.ticks() - this.game.config().allianceExtensionPromptOffset() + ) { + // We've already displayed a message for this alliance. + continue; + } + + this.alliancesCheckedAt.set(alliance.id, this.game.ticks()); + + const other = this.game.player(alliance.other) as PlayerView; + if (!other.isAlive()) continue; + + const color = other.territoryColor().toHex(); + + this.addIndicator({ + id: `renewal-${alliance.id}`, + type: "renewal", + playerSmallID: other.smallID(), + playerName: other.name(), + playerColor: color, + createdAt: this.game.ticks(), + duration: this.game.config().allianceExtensionPromptOffset() - 3 * 10, // 3 second buffer + allianceID: alliance.id, + otherPlayerView: other, + otherPlayerWantsRenewal: alliance.hasExtensionRequest, + }); + } + } + + private addIndicator(indicator: AllianceIndicator) { + // Check if indicator with same id already exists - always allow updating otherPlayerWantsRenewal + const existingIndex = this.indicators.findIndex( + (i) => i.id === indicator.id, + ); + if (existingIndex !== -1) { + // Update otherPlayerWantsRenewal if it changed (even during popup hover) + const existing = this.indicators[existingIndex]; + if ( + indicator.type === "renewal" && + existing.otherPlayerWantsRenewal !== indicator.otherPlayerWantsRenewal + ) { + this.indicators = this.indicators.map((i, idx) => + idx === existingIndex + ? { ...i, otherPlayerWantsRenewal: indicator.otherPlayerWantsRenewal } + : i, + ); + this.requestUpdate(); + } + return; // Already exists + } + + // If popup is open, queue new indicators for later + if (this.popupHovered) { + // Check if already in pending queue + if (!this.pendingIndicators.some((i) => i.id === indicator.id)) { + this.pendingIndicators.push(indicator); + } + return; + } + + // Add to the front of the array so new indicators appear on the left + this.indicators = [indicator, ...this.indicators]; + this.requestUpdate(); + } + + private removeIndicator(id: string, force: boolean = false) { + // Don't remove if popup is being hovered (unless forced) + if (!force && this.popupHovered && this.hoveredIndicator === id) { + return; + } + this.indicators = this.indicators.filter((i) => i.id !== id); + this.requestUpdate(); + } + + private flushPendingChanges() { + // Apply any pending removals + if (this.pendingRemovals.size > 0) { + this.indicators = this.indicators.filter( + (i) => !this.pendingRemovals.has(i.id), + ); + this.pendingRemovals.clear(); + } + + // Apply any pending additions + if (this.pendingIndicators.length > 0) { + for (const indicator of this.pendingIndicators) { + // Double-check it doesn't already exist + if (!this.indicators.some((i) => i.id === indicator.id)) { + this.indicators = [indicator, ...this.indicators]; + } + } + this.pendingIndicators = []; + } + + this.requestUpdate(); + } + + private closePopup() { + this.popupHovered = false; + // Don't clear hoveredIndicator - the wrapper mouseenter/mouseleave handles that + // This allows smooth transition from one popup to another circle + // Apply all pending changes now that popup is closed + this.flushPendingChanges(); + } + + onAllianceRequestEvent(update: AllianceRequestUpdate) { + const myPlayer = this.game.myPlayer(); + if (!myPlayer || update.recipientID !== myPlayer.smallID()) { + return; + } + + const requestor = this.game.playerBySmallID( + update.requestorID, + ) as PlayerView; + const recipient = this.game.playerBySmallID( + update.recipientID, + ) as PlayerView; + + const color = requestor.territoryColor().toHex(); + + this.addIndicator({ + id: `request-${update.requestorID}-${update.createdAt}`, + type: "request", + playerSmallID: update.requestorID, + playerName: requestor.name(), + playerColor: color, + createdAt: this.game.ticks(), + duration: this.game.config().allianceRequestDuration() - 20, // 2 second buffer + requestorView: requestor, + recipientView: recipient, + }); + } + + onAllianceRequestReplyEvent(update: AllianceRequestReplyUpdate) { + const myPlayer = this.game.myPlayer(); + if (!myPlayer) { + return; + } + // myPlayer can deny alliances without clicking on the button + if (update.request.recipientID === myPlayer.smallID()) { + // Remove alliance requests whose requestors are the same as the reply's requestor + this.indicators = this.indicators.filter( + (indicator) => + !( + indicator.type === "request" && + indicator.playerSmallID === update.request.requestorID + ), + ); + this.requestUpdate(); + } + } + + private handleAccept(indicator: AllianceIndicator) { + if (indicator.type === "request") { + this.eventBus.emit( + new SendAllianceReplyIntentEvent( + indicator.requestorView!, + indicator.recipientView!, + true, + ), + ); + } else if (indicator.type === "renewal") { + this.eventBus.emit( + new SendAllianceExtensionIntentEvent(indicator.otherPlayerView!), + ); + } + // Close popup and flush pending changes + this.popupHovered = false; + this.hoveredIndicator = null; + // Remove the clicked indicator plus any pending removals + this.pendingRemovals.add(indicator.id); + this.flushPendingChanges(); + } + + private handleReject(indicator: AllianceIndicator) { + if (indicator.type === "request") { + this.eventBus.emit( + new SendAllianceReplyIntentEvent( + indicator.requestorView!, + indicator.recipientView!, + false, + ), + ); + } + // For renewals, "ignore" just removes the indicator + // Close popup and flush pending changes + this.popupHovered = false; + this.hoveredIndicator = null; + // Remove the clicked indicator plus any pending removals + this.pendingRemovals.add(indicator.id); + this.flushPendingChanges(); + } + + private handleFocus(indicator: AllianceIndicator) { + const player = this.game.playerBySmallID(indicator.playerSmallID); + if (player) { + this.eventBus.emit(new GoToPlayerEvent(player as PlayerView)); + } + } + + shouldTransform(): boolean { + return false; + } + + renderLayer(): void {} + + render() { + // Don't show during spawn phase or if no indicators + if (!this.active || this.indicators.length === 0 || this.game.inSpawnPhase()) { + return html``; + } + + return html` + +
+ ${this.indicators.map((indicator) => { + const elapsed = this.game.ticks() - indicator.createdAt; + const remaining = indicator.duration - elapsed; + const remainingSeconds = Math.max(0, Math.ceil(remaining / 10)); + const percentExpired = Math.min(100, (elapsed / indicator.duration) * 100); + + return html` +
(this.hoveredIndicator = indicator.id)} + @mouseleave=${() => { + if (!this.popupHovered) { + this.hoveredIndicator = null; + } + }} + > +
this.handleFocus(indicator)} + > +
+
+
+ ${indicator.type === "request" + ? html`
?
` + : html`
⏳
`} + ${this.hoveredIndicator === indicator.id + ? html` +
(this.popupHovered = true)} + @mouseleave=${() => this.closePopup()} + > +
${indicator.playerName}
+
${remainingSeconds}s remaining
+ ${indicator.type === "renewal" && indicator.otherPlayerWantsRenewal + ? html`
✓ Wants to renew!
` + : ''} +
+ ${indicator.type === "request" + ? translateText("events_display.request_alliance", { + name: indicator.playerName, + }) + : translateText("events_display.about_to_expire", { + name: indicator.playerName, + })} +
+
+ + + +
+
+ ` + : ""} +
+ `; + })} +
+ `; + } + + createRenderRoot() { + return this; + } +} diff --git a/src/client/graphics/layers/EventsDisplay.ts b/src/client/graphics/layers/EventsDisplay.ts index 2b66f33367..fab6fe9a0e 100644 --- a/src/client/graphics/layers/EventsDisplay.ts +++ b/src/client/graphics/layers/EventsDisplay.ts @@ -28,8 +28,6 @@ import { import { CancelAttackIntentEvent, CancelBoatIntentEvent, - SendAllianceExtensionIntentEvent, - SendAllianceReplyIntentEvent, SendAttackIntentEvent, } from "../../Transport"; import { Layer } from "./Layer"; @@ -82,8 +80,6 @@ export class EventsDisplay extends LitElement implements Layer { private active: boolean = false; private events: GameEvent[] = []; - // allianceID -> last checked at tick - private alliancesCheckedAt = new Map(); @state() private incomingAttacks: AttackUpdate[] = []; @state() private outgoingAttacks: AttackUpdate[] = []; @state() private outgoingLandAttacks: AttackUpdate[] = []; @@ -283,63 +279,7 @@ export class EventsDisplay extends LitElement implements Layer { } private checkForAllianceExpirations() { - const myPlayer = this.game.myPlayer(); - if (!myPlayer?.isAlive()) return; - - for (const alliance of myPlayer.alliances()) { - if ( - alliance.expiresAt > - this.game.ticks() + this.game.config().allianceExtensionPromptOffset() - ) { - continue; - } - - if ( - (this.alliancesCheckedAt.get(alliance.id) ?? 0) >= - this.game.ticks() - this.game.config().allianceExtensionPromptOffset() - ) { - // We've already displayed a message for this alliance. - continue; - } - - this.alliancesCheckedAt.set(alliance.id, this.game.ticks()); - - const other = this.game.player(alliance.other) as PlayerView; - if (!other.isAlive()) continue; - - this.addEvent({ - description: translateText("events_display.about_to_expire", { - name: other.name(), - }), - type: MessageType.RENEW_ALLIANCE, - duration: this.game.config().allianceExtensionPromptOffset() - 3 * 10, // 3 second buffer - buttons: [ - { - text: translateText("events_display.focus"), - className: "btn-gray", - action: () => this.eventBus.emit(new GoToPlayerEvent(other)), - preventClose: true, - }, - { - text: translateText("events_display.renew_alliance", { - name: other.name(), - }), - className: "btn", - action: () => - this.eventBus.emit(new SendAllianceExtensionIntentEvent(other)), - }, - { - text: translateText("events_display.ignore"), - className: "btn-info", - action: () => {}, - }, - ], - highlight: true, - createdAt: this.game.ticks(), - focusID: other.smallID(), - allianceID: alliance.id, - }); - } + // Alliance expirations/renewals are now handled by AllianceRequestPanel } private addEvent(event: GameEvent) { @@ -465,57 +405,8 @@ export class EventsDisplay extends LitElement implements Layer { } onAllianceRequestEvent(update: AllianceRequestUpdate) { - const myPlayer = this.game.myPlayer(); - if (!myPlayer || update.recipientID !== myPlayer.smallID()) { - return; - } - - const requestor = this.game.playerBySmallID( - update.requestorID, - ) as PlayerView; - const recipient = this.game.playerBySmallID( - update.recipientID, - ) as PlayerView; - - this.addEvent({ - description: translateText("events_display.request_alliance", { - name: requestor.name(), - }), - buttons: [ - { - text: translateText("events_display.focus"), - className: "btn-gray", - action: () => this.eventBus.emit(new GoToPlayerEvent(requestor)), - preventClose: true, - }, - { - text: translateText("events_display.accept_alliance"), - className: "btn", - action: () => - this.eventBus.emit( - new SendAllianceReplyIntentEvent(requestor, recipient, true), - ), - }, - { - text: translateText("events_display.reject_alliance"), - className: "btn-info", - action: () => - this.eventBus.emit( - new SendAllianceReplyIntentEvent(requestor, recipient, false), - ), - }, - ], - highlight: true, - type: MessageType.ALLIANCE_REQUEST, - createdAt: this.game.ticks(), - priority: 0, - duration: this.game.config().allianceRequestDuration() - 20, // 2 second buffer - shouldDelete: (game) => { - // Recipient sent a separate request, so they became allied without the recipient responding. - return requestor.isAlliedWith(recipient); - }, - focusID: update.requestorID, - }); + // Alliance requests are now handled by AllianceRequestPanel + // This handler is kept to maintain the event filtering for the reply event } onAllianceRequestReplyEvent(update: AllianceRequestReplyUpdate) { diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index 7311cb60c2..298e6ce98b 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -526,7 +526,7 @@ export class DefaultConfig implements Config { return 3; } numSpawnPhaseTurns(): number { - return this._gameConfig.gameType === GameType.Singleplayer ? 100 : 300; + return this._gameConfig.gameType === GameType.Singleplayer ? 300 : 300; } numBots(): number { return this.bots(); From 7e6f7c7c51df697e156b9545d3060999feb4d835 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Wed, 14 Jan 2026 23:11:55 -0500 Subject: [PATCH 2/8] fix: Add translation keys for alliance request panel strings - Add events_display.seconds_remaining for countdown text - Add events_display.wants_to_renew for renewal indicator --- resources/lang/en.json | 2 ++ src/client/graphics/layers/AllianceRequestPanel.ts | 6 +++--- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/resources/lang/en.json b/resources/lang/en.json index c18d7be1a4..37add95c2f 100644 --- a/resources/lang/en.json +++ b/resources/lang/en.json @@ -715,6 +715,8 @@ "alliance_renewed": "Your alliance with {name} has been renewed", "wants_to_renew_alliance": "{name} wants to renew your alliance", "ignore": "Ignore", + "seconds_remaining": "{seconds}s remaining", + "wants_to_renew": "✓ Wants to renew!", "unit_voluntarily_deleted": "Unit voluntarily deleted", "betrayal_debuff_ends": "{time} seconds left until betrayal debuff ends", "attack_cancelled_retreat": "Attack cancelled, {troops} soldiers killed during retreat", diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts index 80cf134935..c6b338a770 100644 --- a/src/client/graphics/layers/AllianceRequestPanel.ts +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -605,10 +605,10 @@ export class AllianceRequestPanel extends LitElement implements Layer { @mouseleave=${() => this.closePopup()} >
${indicator.playerName}
-
${remainingSeconds}s remaining
+
${translateText("events_display.seconds_remaining", { seconds: remainingSeconds })}
${indicator.type === "renewal" && indicator.otherPlayerWantsRenewal - ? html`
✓ Wants to renew!
` - : ''} + ? html`
${translateText("events_display.wants_to_renew")}
` + : ''}}
${indicator.type === "request" ? translateText("events_display.request_alliance", { From 4f2688559205bcb28a5be4e8a11bd3905658e8d5 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Wed, 14 Jan 2026 23:12:10 -0500 Subject: [PATCH 3/8] Revert testing change --- src/core/configuration/DefaultConfig.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index 298e6ce98b..7311cb60c2 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -526,7 +526,7 @@ export class DefaultConfig implements Config { return 3; } numSpawnPhaseTurns(): number { - return this._gameConfig.gameType === GameType.Singleplayer ? 300 : 300; + return this._gameConfig.gameType === GameType.Singleplayer ? 100 : 300; } numBots(): number { return this.bots(); From 8e38979f9e5181c11a24fb59aba1055667c05fc0 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Fri, 23 Jan 2026 20:41:15 -0500 Subject: [PATCH 4/8] Radial menu, show skins, tests, small ui changes --- .../graphics/layers/AllianceRequestPanel.ts | 382 +++++++++----- src/core/configuration/DefaultConfig.ts | 5 +- .../nation/NationAllianceBehavior.ts | 35 +- src/core/game/AllianceImpl.ts | 10 + src/core/game/Game.ts | 1 + src/core/game/GameUpdates.ts | 1 + src/core/game/GameView.ts | 56 +- src/core/game/PlayerImpl.ts | 1 + tests/AllianceRenewalPanel.test.ts | 490 ++++++++++++++++++ 9 files changed, 838 insertions(+), 143 deletions(-) create mode 100644 tests/AllianceRenewalPanel.test.ts diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts index c6b338a770..c14f81f7f9 100644 --- a/src/client/graphics/layers/AllianceRequestPanel.ts +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -1,13 +1,17 @@ +import { base64url } from "jose"; import { html, LitElement } from "lit"; import { customElement, state } from "lit/decorators.js"; +import { Colord } from "colord"; import { EventBus } from "../../../core/EventBus"; -import { MessageType, Tick } from "../../../core/game/Game"; +import { Tick } from "../../../core/game/Game"; import { AllianceRequestReplyUpdate, AllianceRequestUpdate, GameUpdateType, } from "../../../core/game/GameUpdates"; import { GameView, PlayerView } from "../../../core/game/GameView"; +import { PatternDecoder } from "../../../core/PatternDecoder"; +import { PlayerPattern } from "../../../core/Schemas"; import { SendAllianceExtensionIntentEvent, SendAllianceReplyIntentEvent, @@ -16,12 +20,75 @@ import { translateText } from "../../Utils"; import { Layer } from "./Layer"; import { GoToPlayerEvent } from "./Leaderboard"; +// Cache for pattern preview images +const patternPreviewCache = new Map(); + +function generatePatternPreviewDataUrl( + pattern: PlayerPattern, + size: number, +): string { + const patternLookupKey = [ + pattern.name, + pattern.colorPalette?.primaryColor ?? "undefined", + pattern.colorPalette?.secondaryColor ?? "undefined", + size, + ].join("-"); + + if (patternPreviewCache.has(patternLookupKey)) { + return patternPreviewCache.get(patternLookupKey)!; + } + + try { + const decoder = new PatternDecoder(pattern, base64url.decode); + const scaledWidth = decoder.scaledWidth(); + const scaledHeight = decoder.scaledHeight(); + + const width = Math.max(1, Math.floor(size / scaledWidth)) * scaledWidth; + const height = Math.max(1, Math.floor(size / scaledHeight)) * scaledHeight; + + const canvas = document.createElement("canvas"); + canvas.width = width; + canvas.height = height; + const ctx = canvas.getContext("2d"); + if (!ctx) return ""; + + const imageData = ctx.createImageData(width, height); + const data = imageData.data; + const primary = pattern.colorPalette?.primaryColor + ? new Colord(pattern.colorPalette.primaryColor).toRgb() + : { r: 255, g: 255, b: 255 }; + const secondary = pattern.colorPalette?.secondaryColor + ? new Colord(pattern.colorPalette.secondaryColor).toRgb() + : { r: 0, g: 0, b: 0 }; + + let i = 0; + for (let y = 0; y < height; y++) { + for (let x = 0; x < width; x++) { + const rgba = decoder.isPrimary(x, y) ? primary : secondary; + data[i++] = rgba.r; + data[i++] = rgba.g; + data[i++] = rgba.b; + data[i++] = 255; + } + } + + ctx.putImageData(imageData, 0, 0); + const dataUrl = canvas.toDataURL("image/png"); + patternPreviewCache.set(patternLookupKey, dataUrl); + return dataUrl; + } catch (e) { + console.error("Error generating pattern preview", e); + return ""; + } +} + interface AllianceIndicator { id: string; type: "request" | "renewal"; playerSmallID: number; playerName: string; playerColor: string; + playerPattern?: PlayerPattern; createdAt: Tick; duration: Tick; // For requests @@ -171,6 +238,19 @@ export class AllianceRequestPanel extends LitElement implements Layer { continue; } + // Always update otherPlayerWantsRenewal for existing indicators + const existingIndicator = this.indicators.find( + (i) => i.type === "renewal" && i.allianceID === alliance.id, + ); + if (existingIndicator && existingIndicator.otherPlayerWantsRenewal !== alliance.otherWantsToExtend) { + this.indicators = this.indicators.map((i) => + i === existingIndicator + ? { ...i, otherPlayerWantsRenewal: alliance.otherWantsToExtend } + : i, + ); + this.requestUpdate(); + } + if ( (this.alliancesCheckedAt.get(alliance.id) ?? 0) >= this.game.ticks() - this.game.config().allianceExtensionPromptOffset() @@ -192,11 +272,12 @@ export class AllianceRequestPanel extends LitElement implements Layer { playerSmallID: other.smallID(), playerName: other.name(), playerColor: color, + playerPattern: other.cosmetics.pattern, createdAt: this.game.ticks(), duration: this.game.config().allianceExtensionPromptOffset() - 3 * 10, // 3 second buffer allianceID: alliance.id, otherPlayerView: other, - otherPlayerWantsRenewal: alliance.hasExtensionRequest, + otherPlayerWantsRenewal: alliance.otherWantsToExtend, }); } } @@ -298,6 +379,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { playerSmallID: update.requestorID, playerName: requestor.name(), playerColor: color, + playerPattern: requestor.cosmetics.pattern, createdAt: this.game.ticks(), duration: this.game.config().allianceRequestDuration() - 20, // 2 second buffer requestorView: requestor, @@ -367,11 +449,37 @@ export class AllianceRequestPanel extends LitElement implements Layer { private handleFocus(indicator: AllianceIndicator) { const player = this.game.playerBySmallID(indicator.playerSmallID); - if (player) { - this.eventBus.emit(new GoToPlayerEvent(player as PlayerView)); + if (player.isPlayer()) { + this.eventBus.emit(new GoToPlayerEvent(player)); } } + // Helper to create SVG arc path for radial buttons + private describeArc(x: number, y: number, innerRadius: number, outerRadius: number, startAngle: number, endAngle: number): string { + const startRad = (startAngle * Math.PI) / 180; + const endRad = (endAngle * Math.PI) / 180; + + const x1 = x + innerRadius * Math.cos(startRad); + const y1 = y + innerRadius * Math.sin(startRad); + const x2 = x + outerRadius * Math.cos(startRad); + const y2 = y + outerRadius * Math.sin(startRad); + const x3 = x + outerRadius * Math.cos(endRad); + const y3 = y + outerRadius * Math.sin(endRad); + const x4 = x + innerRadius * Math.cos(endRad); + const y4 = y + innerRadius * Math.sin(endRad); + + const largeArc = Math.abs(endAngle - startAngle) > 180 ? 1 : 0; + + return [ + `M ${x1} ${y1}`, + `L ${x2} ${y2}`, + `A ${outerRadius} ${outerRadius} 0 ${largeArc} 1 ${x3} ${y3}`, + `L ${x4} ${y4}`, + `A ${innerRadius} ${innerRadius} 0 ${largeArc} 0 ${x1} ${y1}`, + 'Z' + ].join(' '); + } + shouldTransform(): boolean { return false; } @@ -388,7 +496,7 @@ export class AllianceRequestPanel extends LitElement implements Layer {
${this.indicators.map((indicator) => { const elapsed = this.game.ticks() - indicator.createdAt; @@ -577,6 +687,11 @@ export class AllianceRequestPanel extends LitElement implements Layer { const remainingSeconds = Math.max(0, Math.ceil(remaining / 10)); const percentExpired = Math.min(100, (elapsed / indicator.duration) * 100); + // Generate pattern preview if player has a pattern + const patternUrl = indicator.playerPattern + ? generatePatternPreviewDataUrl(indicator.playerPattern, 48) + : null; + return html`
this.handleFocus(indicator)} >
+ ${patternUrl + ? html`Player pattern` + : ""}
${indicator.type === "request" @@ -600,61 +718,65 @@ export class AllianceRequestPanel extends LitElement implements Layer { ${this.hoveredIndicator === indicator.id ? html`
(this.popupHovered = true)} @mouseleave=${() => this.closePopup()} > -
${indicator.playerName}
-
${translateText("events_display.seconds_remaining", { seconds: remainingSeconds })}
- ${indicator.type === "renewal" && indicator.otherPlayerWantsRenewal - ? html`
${translateText("events_display.wants_to_renew")}
` - : ''}} -
- ${indicator.type === "request" - ? translateText("events_display.request_alliance", { - name: indicator.playerName, - }) - : translateText("events_display.about_to_expire", { - name: indicator.playerName, - })} -
-
- - - + /> + ✕ + +
+ +
+
${indicator.playerName}
+
${remainingSeconds}s
+ ${indicator.type === "renewal" && indicator.otherPlayerWantsRenewal + ? html`
${translateText("events_display.wants_to_renew")}
` + : ""}
-
- ` + ` : ""}
`; diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index 7311cb60c2..e937032898 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -507,7 +507,7 @@ export class DefaultConfig implements Config { return 30 * 10; } allianceDuration(): Tick { - return 300 * 10; // 5 minutes. + return 45 * 10; // 45 seconds for testing } temporaryEmbargoDuration(): Tick { return 300 * 10; // 5 minutes. @@ -526,7 +526,8 @@ export class DefaultConfig implements Config { return 3; } numSpawnPhaseTurns(): number { - return this._gameConfig.gameType === GameType.Singleplayer ? 100 : 300; + // Always use 10 seconds (100 ticks) for spawn phase + return 100; } numBots(): number { return this.bots(); diff --git a/src/core/execution/nation/NationAllianceBehavior.ts b/src/core/execution/nation/NationAllianceBehavior.ts index cbf78304bf..bb1bd94cee 100644 --- a/src/core/execution/nation/NationAllianceBehavior.ts +++ b/src/core/execution/nation/NationAllianceBehavior.ts @@ -38,16 +38,30 @@ export class NationAllianceBehavior { handleAllianceExtensionRequests() { for (const alliance of this.player.alliances()) { - // Alliance expiration tracked by Events Panel, only human ally can click Request to Renew - // Skip if no expiration yet/ ally didn't request extension yet / nation already agreed to extend - if (!alliance.onlyOneAgreedToExtend()) continue; - const human = alliance.other(this.player); - if (!this.getAllianceDecision(human, true)) continue; - - this.game.addExecution( - new AllianceExtensionExecution(this.player, human.id()), - ); + + // Check if alliance is expiring soon (within the prompt offset window) + const isExpiringSoon = alliance.expiresAt() <= this.game.ticks() + this.game.config().allianceExtensionPromptOffset(); + + // Nations proactively request extension when alliance is about to expire + // This makes them very likely to request BEFORE the human does (for testing) + if (isExpiringSoon && !alliance.onlyOneAgreedToExtend() && !alliance.bothAgreedToExtend()) { + // 90% chance each tick to proactively request renewal + if (this.random.chance(2) && this.getAllianceDecision(human, true)) { + this.game.addExecution( + new AllianceExtensionExecution(this.player, human.id()), + ); + continue; + } + } + + // Also respond to human's extension request if they asked first + if (alliance.onlyOneAgreedToExtend()) { + if (!this.getAllianceDecision(human, true)) continue; + this.game.addExecution( + new AllianceExtensionExecution(this.player, human.id()), + ); + } } } @@ -59,8 +73,9 @@ export class NationAllianceBehavior { p.type() !== PlayerType.Bot; for (const enemy of borderingEnemies) { + // 20x more frequent: changed from chance(30) to chance(2) - roughly 50% chance per tick if ( - this.random.chance(30) && + this.random.chance(2) && isAcceptablePlayerType(enemy) && this.player.canSendAllianceRequest(enemy) && this.getAllianceDecision(enemy, false) diff --git a/src/core/game/AllianceImpl.ts b/src/core/game/AllianceImpl.ts index fa74ca766c..eb910fad21 100644 --- a/src/core/game/AllianceImpl.ts +++ b/src/core/game/AllianceImpl.ts @@ -62,6 +62,16 @@ export class AllianceImpl implements MutableAlliance { ); } + hasOtherRequestedExtension(player: Player): boolean { + // Check if the OTHER player (not the one passed in) has requested extension + if (this.requestor_ === player) { + return this.extensionRequestedRecipient_; + } else if (this.recipient_ === player) { + return this.extensionRequestedRequestor_; + } + return false; + } + public id(): number { return this.id_; } diff --git a/src/core/game/Game.ts b/src/core/game/Game.ts index 4ead6efe56..c14cec66e5 100644 --- a/src/core/game/Game.ts +++ b/src/core/game/Game.ts @@ -446,6 +446,7 @@ export interface MutableAlliance extends Alliance { id(): number; extend(): void; onlyOneAgreedToExtend(): boolean; + hasOtherRequestedExtension(player: Player): boolean; } export class PlayerInfo { diff --git a/src/core/game/GameUpdates.ts b/src/core/game/GameUpdates.ts index a8c6c53f68..ae34559308 100644 --- a/src/core/game/GameUpdates.ts +++ b/src/core/game/GameUpdates.ts @@ -183,6 +183,7 @@ export interface AllianceView { createdAt: Tick; expiresAt: Tick; hasExtensionRequest: boolean; + otherWantsToExtend: boolean; // True if the other player has requested to extend but we haven't yet } export interface AllianceRequestUpdate { diff --git a/src/core/game/GameView.ts b/src/core/game/GameView.ts index 15ce0d5648..a9a3777b49 100644 --- a/src/core/game/GameView.ts +++ b/src/core/game/GameView.ts @@ -612,10 +612,64 @@ export class GameView implements GameMap { this._cosmetics = new Map( this.humans.map((h) => [h.clientID, h.cosmetics ?? {}]), ); - for (const nation of this._mapData.nations) { + + // Test patterns for nations - give some nations player skins for testing + const testPatterns = [ + { + name: "stripes_v", + patternData: "ABMIVVU", + colorPalette: { + name: "blue_white", + primaryColor: "#3b82f6", + secondaryColor: "#ffffff", + }, + }, + { + name: "stripes_h", + patternData: "ABMIDw8", + colorPalette: { + name: "red_gold", + primaryColor: "#ef4444", + secondaryColor: "#fbbf24", + }, + }, + { + name: "checkerboard", + patternData: "ABMIpaU", + colorPalette: { + name: "green_black", + primaryColor: "#22c55e", + secondaryColor: "#1f2937", + }, + }, + { + name: "diagonal", + patternData: "AHE4AQACAAQACAAQACAAQACAAAABAAIABAAIABAAIABAAIA", + colorPalette: { + name: "purple_pink", + primaryColor: "#a855f7", + secondaryColor: "#ec4899", + }, + }, + { + name: "cross", + patternData: "AHE4AYACQAQgCBAQCCAEQAKAAYABQAIgBBAICBAEIAJAAYA", + colorPalette: { + name: "orange_white", + primaryColor: "#f97316", + secondaryColor: "#ffffff", + }, + }, + ]; + + for (let i = 0; i < this._mapData.nations.length; i++) { + const nation = this._mapData.nations[i]; // Nations don't have client ids, so we use their name as the key instead. + // Give every other nation a test pattern for skin testing + const pattern = i % 2 === 0 ? testPatterns[i % testPatterns.length] : undefined; this._cosmetics.set(nation.name, { flag: nation.flag, + pattern: pattern, } satisfies PlayerCosmetics); } } diff --git a/src/core/game/PlayerImpl.ts b/src/core/game/PlayerImpl.ts index 3b773576e8..b379df3d9c 100644 --- a/src/core/game/PlayerImpl.ts +++ b/src/core/game/PlayerImpl.ts @@ -174,6 +174,7 @@ export class PlayerImpl implements Player { a.expiresAt() <= this.mg.ticks() + this.mg.config().allianceExtensionPromptOffset(), + otherWantsToExtend: a.hasOtherRequestedExtension(this), }) satisfies AllianceView, ), hasSpawned: this.hasSpawned(), diff --git a/tests/AllianceRenewalPanel.test.ts b/tests/AllianceRenewalPanel.test.ts new file mode 100644 index 0000000000..781bbd82dc --- /dev/null +++ b/tests/AllianceRenewalPanel.test.ts @@ -0,0 +1,490 @@ +import { AllianceExtensionExecution } from "../src/core/execution/alliance/AllianceExtensionExecution"; +import { AllianceRequestExecution } from "../src/core/execution/alliance/AllianceRequestExecution"; +import { AllianceRequestReplyExecution } from "../src/core/execution/alliance/AllianceRequestReplyExecution"; +import { Game, Player, PlayerType, Tick } from "../src/core/game/Game"; +import { playerInfo, setup } from "./util/Setup"; + +let game: Game; +let player1: Player; +let player2: Player; +let player3: Player; + +/** + * Tests for the alliance renewal panel logic. + * + * The AllianceRequestPanel (UI component) manages indicators for: + * 1. Incoming alliance requests + * 2. Alliance renewals when alliances are about to expire + * + * These tests verify the underlying business logic that the panel uses, + * specifically around: + * - When renewal prompts should appear (based on allianceExtensionPromptOffset) + * - When alliance indicators should be deleted (already allied, alliance renewed, etc.) + * - Alliance expiration and extension timing + */ +describe("AllianceRenewalPanel Logic", () => { + beforeEach(async () => { + game = await setup( + "ocean_and_land", + { + infiniteGold: true, + instantBuild: true, + infiniteTroops: true, + }, + [ + playerInfo("player1", PlayerType.Human), + playerInfo("player2", PlayerType.Human), + playerInfo("player3", PlayerType.Human), + ], + ); + + player1 = game.player("player1"); + player2 = game.player("player2"); + player3 = game.player("player3"); + + while (game.inSpawnPhase()) { + game.executeNextTick(); + } + }); + + describe("Alliance expiration timing", () => { + test("alliance has expiresAt set to createdAt + allianceDuration", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + const ticksBefore = game.ticks(); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // ExpiresAt should be roughly createdAt + allianceDuration + const expectedExpiry = + alliance!.createdAt() + game.config().allianceDuration(); + expect(alliance!.expiresAt()).toBe(expectedExpiry); + }); + + test("extension prompt should appear before alliance expires (within offset window)", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + const promptOffset = game.config().allianceExtensionPromptOffset(); + const expiresAt = alliance!.expiresAt(); + + // The prompt should be shown when: expiresAt <= ticks + promptOffset + // Which means: ticks >= expiresAt - promptOffset + const promptShowsTick = expiresAt - promptOffset; + + // At promptShowsTick, the condition (expiresAt > ticks + promptOffset) should be false + expect(expiresAt).toBeLessThanOrEqual(promptShowsTick + promptOffset); + + // Before promptShowsTick, the prompt should NOT show + const beforePrompt = promptShowsTick - 1; + expect(expiresAt).toBeGreaterThan(beforePrompt + promptOffset); + }); + }); + + describe("shouldDeleteIndicator logic for requests", () => { + test("request indicator should be deleted when players become allied", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Send request but don't reply yet + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + // Players are not allied yet + expect(player1.isAlliedWith(player2)).toBeFalsy(); + + // Accept the alliance + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + // Now they are allied - indicator should be deleted + expect(player1.isAlliedWith(player2)).toBeTruthy(); + }); + + test("request indicator should remain if alliance request is rejected", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Send request + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + expect(player1.isAlliedWith(player2)).toBeFalsy(); + + // Reject the alliance + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, false), + ); + game.executeNextTick(); + + // Players are still not allied + expect(player1.isAlliedWith(player2)).toBeFalsy(); + }); + }); + + describe("shouldDeleteIndicator logic for renewals", () => { + test("renewal indicator should be deleted when alliance is renewed", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + const originalExpiry = alliance!.expiresAt(); + const promptOffset = game.config().allianceExtensionPromptOffset(); + + // Both players agree to extend + game.addExecution(new AllianceExtensionExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution(new AllianceExtensionExecution(player2, player1.id())); + game.executeNextTick(); + + // Alliance should be renewed - expiresAt should be in the far future + const newExpiry = player1.allianceWith(player2)!.expiresAt(); + expect(newExpiry).toBeGreaterThan(originalExpiry); + + // Renewal indicator delete condition: + // alliance.expiresAt > ticks + allianceExtensionPromptOffset + // After renewal, this should be true (expiresAt is far in future) + expect(newExpiry).toBeGreaterThan(game.ticks() + promptOffset); + }); + + test("renewal indicator should be deleted when alliance no longer exists (expired)", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // Verify the panel's delete condition logic: + // The panel deletes renewal indicator if alliance no longer exists + // Here we verify the alliance object methods work correctly + expect(alliance!.expiresAt()).toBeGreaterThan(alliance!.createdAt()); + + // Manually expire the alliance to test the condition + alliance!.expire(); + + // Now allianceWith should return null + expect(player1.allianceWith(player2)).toBeFalsy(); + }); + }); + + describe("Extension request tracking", () => { + test("alliance tracks when one player requests extension", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // Initially no one has requested extension + expect(alliance!.onlyOneAgreedToExtend()).toBeFalsy(); + expect(alliance!.bothAgreedToExtend()).toBeFalsy(); + + // Player 1 requests extension + game.addExecution(new AllianceExtensionExecution(player1, player2.id())); + game.executeNextTick(); + + // Now only one has agreed + expect(alliance!.onlyOneAgreedToExtend()).toBeTruthy(); + expect(alliance!.bothAgreedToExtend()).toBeFalsy(); + }); + + test("alliance tracks when both players request extension", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // Both players request extension + game.addExecution(new AllianceExtensionExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution(new AllianceExtensionExecution(player2, player1.id())); + game.executeNextTick(); + + // Both have agreed, so alliance should extend and reset the flags + expect(alliance!.onlyOneAgreedToExtend()).toBeFalsy(); + expect(alliance!.bothAgreedToExtend()).toBeFalsy(); + }); + + test("extension request flags reset after alliance is extended", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // Extend alliance + game.addExecution(new AllianceExtensionExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution(new AllianceExtensionExecution(player2, player1.id())); + game.executeNextTick(); + + // Flags should be reset + expect(alliance!.onlyOneAgreedToExtend()).toBeFalsy(); + expect(alliance!.bothAgreedToExtend()).toBeFalsy(); + + // Can request extension again + game.addExecution(new AllianceExtensionExecution(player1, player2.id())); + game.executeNextTick(); + + expect(alliance!.onlyOneAgreedToExtend()).toBeTruthy(); + }); + }); + + describe("Indicator duration and expiration calculations", () => { + test("request indicator duration is less than allianceRequestDuration by buffer", () => { + // The panel uses: duration = allianceRequestDuration() - 20 (2 second buffer) + const requestDuration = game.config().allianceRequestDuration(); + const expectedIndicatorDuration = requestDuration - 20; + + // Indicator should have a buffer to expire before the actual request + expect(expectedIndicatorDuration).toBeLessThan(requestDuration); + expect(expectedIndicatorDuration).toBe(requestDuration - 20); + }); + + test("renewal indicator duration is less than promptOffset by buffer", () => { + // The panel uses: duration = allianceExtensionPromptOffset() - 3 * 10 (3 second buffer) + const promptOffset = game.config().allianceExtensionPromptOffset(); + const expectedIndicatorDuration = promptOffset - 30; + + // Indicator should have a buffer to expire before the prompt window ends + expect(expectedIndicatorDuration).toBeLessThan(promptOffset); + expect(expectedIndicatorDuration).toBe(promptOffset - 30); + }); + }); + + describe("Duplicate indicator prevention", () => { + test("should not add duplicate indicators for same alliance request", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Sending the same request twice shouldn't create duplicate pending requests + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + expect(player1.outgoingAllianceRequests()).toHaveLength(1); + + // Sending another request while one is pending should not create a new one + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + expect(player1.outgoingAllianceRequests()).toHaveLength(1); + }); + }); + + describe("onAllianceRequestReplyEvent cleanup", () => { + test("accepting removes request from incoming requests", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Player1 sends request to player2 + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + expect(player2.incomingAllianceRequests()).toHaveLength(1); + + // Player2 accepts + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + // Request should be cleared + expect(player2.incomingAllianceRequests()).toHaveLength(0); + expect(player1.outgoingAllianceRequests()).toHaveLength(0); + }); + + test("rejecting removes request from incoming requests", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Player1 sends request to player2 + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + + expect(player2.incomingAllianceRequests()).toHaveLength(1); + + // Player2 rejects + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, false), + ); + game.executeNextTick(); + + // Request should be cleared + expect(player2.incomingAllianceRequests()).toHaveLength(0); + expect(player1.outgoingAllianceRequests()).toHaveLength(0); + }); + }); + + describe("Alliance prompt window edge cases", () => { + test("prompt offset is configurable and affects when renewal shows", () => { + const defaultOffset = game.config().allianceExtensionPromptOffset(); + + // The offset should be a positive number + expect(defaultOffset).toBeGreaterThan(0); + + // The offset represents ticks before expiration when the prompt appears + // A larger offset means earlier warning + }); + + test("once prompted for an alliance, should not prompt again within offset period", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // The panel tracks alliancesCheckedAt to avoid duplicate prompts + // Logic: if checkedAt >= ticks - promptOffset, skip + const promptOffset = game.config().allianceExtensionPromptOffset(); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // The map would store when we last checked, preventing duplicate notifications + // within the prompt offset window + }); + }); + + describe("Multiple alliances handling", () => { + test("can have multiple renewal indicators for different alliances", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player3, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance between player1 and player2 + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + // Create alliance between player1 and player3 + game.addExecution(new AllianceRequestExecution(player1, player3.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player3, true), + ); + game.executeNextTick(); + + // Player1 should have two alliances + expect(player1.alliances()).toHaveLength(2); + expect(player1.isAlliedWith(player2)).toBeTruthy(); + expect(player1.isAlliedWith(player3)).toBeTruthy(); + }); + }); + + describe("hasExtensionRequest flag for UI", () => { + test("alliance exposes extension request status for UI display", () => { + vi.spyOn(player1, "canSendAllianceRequest").mockReturnValue(true); + vi.spyOn(player2, "isAlive").mockReturnValue(true); + vi.spyOn(player1, "isAlive").mockReturnValue(true); + + // Create alliance + game.addExecution(new AllianceRequestExecution(player1, player2.id())); + game.executeNextTick(); + game.addExecution( + new AllianceRequestReplyExecution(player1.id(), player2, true), + ); + game.executeNextTick(); + + const alliance = player1.allianceWith(player2); + expect(alliance).toBeTruthy(); + + // Initially no extension request + expect(alliance!.onlyOneAgreedToExtend()).toBeFalsy(); + + // Player2 wants to extend (from player1's perspective, the "other" wants renewal) + game.addExecution(new AllianceExtensionExecution(player2, player1.id())); + game.executeNextTick(); + + // Now the other player has requested extension + expect(alliance!.onlyOneAgreedToExtend()).toBeTruthy(); + }); + }); +}); From 3369fcab71d6e42ab43fe65fefbfbdd766d7cefd Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Fri, 23 Jan 2026 21:20:35 -0500 Subject: [PATCH 5/8] Move to top left --- index.html | 2 +- .../graphics/layers/AllianceRequestPanel.ts | 332 ++++++++++++++---- src/core/configuration/DefaultConfig.ts | 1 - .../nation/NationAllianceBehavior.ts | 16 +- src/core/game/GameView.ts | 3 +- src/core/game/NationCreation.ts | 19 +- 6 files changed, 286 insertions(+), 87 deletions(-) diff --git a/index.html b/index.html index c85749ce47..fd3418c27d 100644 --- a/index.html +++ b/index.html @@ -249,7 +249,6 @@
-
@@ -275,6 +274,7 @@ + diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts index c14f81f7f9..bb6f084956 100644 --- a/src/client/graphics/layers/AllianceRequestPanel.ts +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -1,7 +1,7 @@ +import { Colord } from "colord"; import { base64url } from "jose"; import { html, LitElement } from "lit"; import { customElement, state } from "lit/decorators.js"; -import { Colord } from "colord"; import { EventBus } from "../../../core/EventBus"; import { Tick } from "../../../core/game/Game"; import { @@ -100,6 +100,8 @@ interface AllianceIndicator { otherPlayerWantsRenewal?: boolean; } +const MAX_VISIBLE_INDICATORS = 5; // TEST: normally 20 + @customElement("alliance-request-panel") export class AllianceRequestPanel extends LitElement implements Layer { public eventBus: EventBus; @@ -109,6 +111,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { @state() private indicators: AllianceIndicator[] = []; @state() private hoveredIndicator: string | null = null; @state() private popupHovered: boolean = false; + @state() private sidebarWidth: number = 0; // Queue of pending indicator additions while popup is open private pendingIndicators: AllianceIndicator[] = []; @@ -118,6 +121,9 @@ export class AllianceRequestPanel extends LitElement implements Layer { // allianceID -> last checked at tick (for renewal notifications) private alliancesCheckedAt = new Map(); + // ResizeObserver to track sidebar height changes + private sidebarObserver: ResizeObserver | null = null; + private updateMap = [ [GameUpdateType.AllianceRequest, this.onAllianceRequestEvent.bind(this)], [ @@ -131,11 +137,45 @@ export class AllianceRequestPanel extends LitElement implements Layer { this.indicators = []; } - init() {} + init() { + // Observe the game-left-sidebar for size changes + this.setupSidebarObserver(); + } + + private setupSidebarObserver() { + // Look for the aside element inside the sidebar (the actual visible element) + const sidebar = document.querySelector("game-left-sidebar aside"); + if (sidebar) { + this.sidebarObserver = new ResizeObserver((entries) => { + for (const entry of entries) { + this.sidebarWidth = entry.contentRect.width; + } + }); + this.sidebarObserver.observe(sidebar); + // Get initial width + this.sidebarWidth = sidebar.getBoundingClientRect().width; + } else { + // Sidebar not found yet, use default position + this.sidebarWidth = 0; + } + } + + disconnectedCallback() { + super.disconnectedCallback(); + if (this.sidebarObserver) { + this.sidebarObserver.disconnect(); + this.sidebarObserver = null; + } + } tick() { this.active = true; + // Try to set up sidebar observer if not already done + if (!this.sidebarObserver) { + this.setupSidebarObserver(); + } + const myPlayer = this.game.myPlayer(); if (!myPlayer || !myPlayer.isAlive()) { return; @@ -207,14 +247,14 @@ export class AllianceRequestPanel extends LitElement implements Layer { // Check if the alliance still exists and is still in expiration window const myPlayer = this.game.myPlayer(); if (!myPlayer) return true; - + const alliance = myPlayer .alliances() .find((a) => a.id === indicator.allianceID); - + // Alliance no longer exists (expired or broken) if (!alliance) return true; - + // Alliance was renewed (expiresAt is now far in the future) if ( alliance.expiresAt > @@ -242,7 +282,11 @@ export class AllianceRequestPanel extends LitElement implements Layer { const existingIndicator = this.indicators.find( (i) => i.type === "renewal" && i.allianceID === alliance.id, ); - if (existingIndicator && existingIndicator.otherPlayerWantsRenewal !== alliance.otherWantsToExtend) { + if ( + existingIndicator && + existingIndicator.otherPlayerWantsRenewal !== + alliance.otherWantsToExtend + ) { this.indicators = this.indicators.map((i) => i === existingIndicator ? { ...i, otherPlayerWantsRenewal: alliance.otherWantsToExtend } @@ -296,7 +340,10 @@ export class AllianceRequestPanel extends LitElement implements Layer { ) { this.indicators = this.indicators.map((i, idx) => idx === existingIndex - ? { ...i, otherPlayerWantsRenewal: indicator.otherPlayerWantsRenewal } + ? { + ...i, + otherPlayerWantsRenewal: indicator.otherPlayerWantsRenewal, + } : i, ); this.requestUpdate(); @@ -313,8 +360,16 @@ export class AllianceRequestPanel extends LitElement implements Layer { return; } - // Add to the front of the array so new indicators appear on the left - this.indicators = [indicator, ...this.indicators]; + // If we're at max capacity, queue the indicator instead of showing it + if (this.indicators.length >= MAX_VISIBLE_INDICATORS) { + if (!this.pendingIndicators.some((i) => i.id === indicator.id)) { + this.pendingIndicators.push(indicator); + } + return; + } + + // Add to the end of the array so new indicators appear on the right (row grows rightward) + this.indicators = [...this.indicators, indicator]; this.requestUpdate(); } @@ -324,6 +379,18 @@ export class AllianceRequestPanel extends LitElement implements Layer { return; } this.indicators = this.indicators.filter((i) => i.id !== id); + + // If we have pending indicators and now have room, add one + if ( + this.indicators.length < MAX_VISIBLE_INDICATORS && + this.pendingIndicators.length > 0 + ) { + const nextIndicator = this.pendingIndicators.shift()!; + if (!this.indicators.some((i) => i.id === nextIndicator.id)) { + this.indicators = [...this.indicators, nextIndicator]; + } + } + this.requestUpdate(); } @@ -336,15 +403,16 @@ export class AllianceRequestPanel extends LitElement implements Layer { this.pendingRemovals.clear(); } - // Apply any pending additions - if (this.pendingIndicators.length > 0) { - for (const indicator of this.pendingIndicators) { - // Double-check it doesn't already exist - if (!this.indicators.some((i) => i.id === indicator.id)) { - this.indicators = [indicator, ...this.indicators]; - } + // Apply any pending additions (up to the max limit) + while ( + this.pendingIndicators.length > 0 && + this.indicators.length < MAX_VISIBLE_INDICATORS + ) { + const indicator = this.pendingIndicators.shift()!; + // Double-check it doesn't already exist + if (!this.indicators.some((i) => i.id === indicator.id)) { + this.indicators = [...this.indicators, indicator]; } - this.pendingIndicators = []; } this.requestUpdate(); @@ -455,10 +523,17 @@ export class AllianceRequestPanel extends LitElement implements Layer { } // Helper to create SVG arc path for radial buttons - private describeArc(x: number, y: number, innerRadius: number, outerRadius: number, startAngle: number, endAngle: number): string { + private describeArc( + x: number, + y: number, + innerRadius: number, + outerRadius: number, + startAngle: number, + endAngle: number, + ): string { const startRad = (startAngle * Math.PI) / 180; const endRad = (endAngle * Math.PI) / 180; - + const x1 = x + innerRadius * Math.cos(startRad); const y1 = y + innerRadius * Math.sin(startRad); const x2 = x + outerRadius * Math.cos(startRad); @@ -467,17 +542,17 @@ export class AllianceRequestPanel extends LitElement implements Layer { const y3 = y + outerRadius * Math.sin(endRad); const x4 = x + innerRadius * Math.cos(endRad); const y4 = y + innerRadius * Math.sin(endRad); - + const largeArc = Math.abs(endAngle - startAngle) > 180 ? 1 : 0; - + return [ `M ${x1} ${y1}`, `L ${x2} ${y2}`, `A ${outerRadius} ${outerRadius} 0 ${largeArc} 1 ${x3} ${y3}`, `L ${x4} ${y4}`, `A ${innerRadius} ${innerRadius} 0 ${largeArc} 0 ${x1} ${y1}`, - 'Z' - ].join(' '); + "Z", + ].join(" "); } shouldTransform(): boolean { @@ -488,10 +563,18 @@ export class AllianceRequestPanel extends LitElement implements Layer { render() { // Don't show during spawn phase or if no indicators - if (!this.active || this.indicators.length === 0 || this.game.inSpawnPhase()) { + if ( + !this.active || + !this.game || + this.indicators.length === 0 || + this.game.inSpawnPhase() + ) { return html``; } + // Position to the right of the sidebar (16px base + sidebar width + 20px gap) + const leftPosition = 16 + this.sidebarWidth + 20; + return html`
${this.indicators.map((indicator) => { const elapsed = this.game.ticks() - indicator.createdAt; const remaining = indicator.duration - elapsed; const remainingSeconds = Math.max(0, Math.ceil(remaining / 10)); - const percentExpired = Math.min(100, (elapsed / indicator.duration) * 100); - + const percentExpired = Math.min( + 100, + (elapsed / indicator.duration) * 100, + ); + // Generate pattern preview if player has a pattern const patternUrl = indicator.playerPattern ? generatePatternPreviewDataUrl(indicator.playerPattern, 48) : null; - + return html`
this.handleFocus(indicator)} > -
+
${patternUrl - ? html`Player pattern` + ? html`Player pattern` : ""} -
+
${indicator.type === "request" ? html`
?
` - : html`
⏳
`} + : html`
+ ⏳ +
`} ${this.hoveredIndicator === indicator.id ? html`
this.closePopup()} > - + - - - + + + - - - + + + - + - ✓ - + > + ✓ + + - ✕ + > + ✕ +
-
${indicator.playerName}
+
+ ${indicator.playerName} +
${remainingSeconds}s
- ${indicator.type === "renewal" && indicator.otherPlayerWantsRenewal - ? html`
${translateText("events_display.wants_to_renew")}
` + ${indicator.type === "renewal" && + indicator.otherPlayerWantsRenewal + ? html`
+ ${translateText("events_display.wants_to_renew")} +
` : ""}
` - : ""} + : ""}
`; })} + ${this.pendingIndicators.length > 0 + ? html` +
+ +${this.pendingIndicators.length} + > +
+ ` + : ""}
`; } diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index e937032898..cb5e7c8224 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -4,7 +4,6 @@ import { Difficulty, Game, GameMode, - GameType, Gold, Player, PlayerInfo, diff --git a/src/core/execution/nation/NationAllianceBehavior.ts b/src/core/execution/nation/NationAllianceBehavior.ts index bb1bd94cee..805a5ddc26 100644 --- a/src/core/execution/nation/NationAllianceBehavior.ts +++ b/src/core/execution/nation/NationAllianceBehavior.ts @@ -39,13 +39,19 @@ export class NationAllianceBehavior { handleAllianceExtensionRequests() { for (const alliance of this.player.alliances()) { const human = alliance.other(this.player); - + // Check if alliance is expiring soon (within the prompt offset window) - const isExpiringSoon = alliance.expiresAt() <= this.game.ticks() + this.game.config().allianceExtensionPromptOffset(); - + const isExpiringSoon = + alliance.expiresAt() <= + this.game.ticks() + this.game.config().allianceExtensionPromptOffset(); + // Nations proactively request extension when alliance is about to expire // This makes them very likely to request BEFORE the human does (for testing) - if (isExpiringSoon && !alliance.onlyOneAgreedToExtend() && !alliance.bothAgreedToExtend()) { + if ( + isExpiringSoon && + !alliance.onlyOneAgreedToExtend() && + !alliance.bothAgreedToExtend() + ) { // 90% chance each tick to proactively request renewal if (this.random.chance(2) && this.getAllianceDecision(human, true)) { this.game.addExecution( @@ -54,7 +60,7 @@ export class NationAllianceBehavior { continue; } } - + // Also respond to human's extension request if they asked first if (alliance.onlyOneAgreedToExtend()) { if (!this.getAllianceDecision(human, true)) continue; diff --git a/src/core/game/GameView.ts b/src/core/game/GameView.ts index a9a3777b49..1f21e75821 100644 --- a/src/core/game/GameView.ts +++ b/src/core/game/GameView.ts @@ -666,7 +666,8 @@ export class GameView implements GameMap { const nation = this._mapData.nations[i]; // Nations don't have client ids, so we use their name as the key instead. // Give every other nation a test pattern for skin testing - const pattern = i % 2 === 0 ? testPatterns[i % testPatterns.length] : undefined; + const pattern = + i % 2 === 0 ? testPatterns[i % testPatterns.length] : undefined; this._cosmetics.set(nation.name, { flag: nation.flag, pattern: pattern, diff --git a/src/core/game/NationCreation.ts b/src/core/game/NationCreation.ts index b2bdc0b70b..1d767e5fb5 100644 --- a/src/core/game/NationCreation.ts +++ b/src/core/game/NationCreation.ts @@ -49,7 +49,24 @@ export function createNationsForGame( // For non-HumansVsNations modes, simply use the effective nations if (!isHumansVsNations) { - return effectiveNations.map(toNation); + // TEST: Generate extra nations to test alliance request panel overflow (30 total) + const baseNations = effectiveNations.map(toNation); + const targetNationCount = 30; + if (baseNations.length < targetNationCount) { + const usedNames = new Set(baseNations.map((n) => n.playerInfo.name)); + const additionalCount = targetNationCount - baseNations.length; + for (let i = 0; i < additionalCount; i++) { + const name = generateUniqueNationName(random, usedNames); + usedNames.add(name); + baseNations.push( + new Nation( + undefined, + new PlayerInfo(name, PlayerType.Nation, null, random.nextID()), + ), + ); + } + } + return baseNations; } // HumansVsNations mode: balance nation count to match human count From b0b5c582d3ff54925e55c854289c159c35cd26e4 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Fri, 23 Jan 2026 21:22:38 -0500 Subject: [PATCH 6/8] Move request panel down a bit --- src/client/graphics/layers/AllianceRequestPanel.ts | 2 +- tests/AllianceRenewalPanel.test.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts index bb6f084956..0f38422cbf 100644 --- a/src/client/graphics/layers/AllianceRequestPanel.ts +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -794,7 +794,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { } .alliance-panel-container { position: fixed; - top: 16px; + top: 24px; z-index: 1000; transition: left 0.3s ease; } diff --git a/tests/AllianceRenewalPanel.test.ts b/tests/AllianceRenewalPanel.test.ts index 781bbd82dc..62cdc3961f 100644 --- a/tests/AllianceRenewalPanel.test.ts +++ b/tests/AllianceRenewalPanel.test.ts @@ -1,7 +1,7 @@ import { AllianceExtensionExecution } from "../src/core/execution/alliance/AllianceExtensionExecution"; import { AllianceRequestExecution } from "../src/core/execution/alliance/AllianceRequestExecution"; import { AllianceRequestReplyExecution } from "../src/core/execution/alliance/AllianceRequestReplyExecution"; -import { Game, Player, PlayerType, Tick } from "../src/core/game/Game"; +import { Game, Player, PlayerType } from "../src/core/game/Game"; import { playerInfo, setup } from "./util/Setup"; let game: Game; From c45a4f368770546dc68b4b1e8ee5627e77b98608 Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Fri, 23 Jan 2026 21:28:01 -0500 Subject: [PATCH 7/8] small ui changes --- .../graphics/layers/AllianceRequestPanel.ts | 12 ++--- src/core/configuration/DefaultConfig.ts | 2 +- .../nation/NationAllianceBehavior.ts | 3 +- src/core/game/GameView.ts | 53 ------------------- src/core/game/NationCreation.ts | 19 +------ 5 files changed, 9 insertions(+), 80 deletions(-) diff --git a/src/client/graphics/layers/AllianceRequestPanel.ts b/src/client/graphics/layers/AllianceRequestPanel.ts index 0f38422cbf..9fd85c86a6 100644 --- a/src/client/graphics/layers/AllianceRequestPanel.ts +++ b/src/client/graphics/layers/AllianceRequestPanel.ts @@ -100,7 +100,7 @@ interface AllianceIndicator { otherPlayerWantsRenewal?: boolean; } -const MAX_VISIBLE_INDICATORS = 5; // TEST: normally 20 +const MAX_VISIBLE_INDICATORS = 10; @customElement("alliance-request-panel") export class AllianceRequestPanel extends LitElement implements Layer { @@ -592,7 +592,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { cursor: pointer; position: relative; transition: transform 0.15s ease; - border: 2px solid #444; + border: 2px solid #475569; overflow: hidden; } .alliance-indicator-bg { @@ -653,13 +653,13 @@ export class AllianceRequestPanel extends LitElement implements Layer { .radial-arc-accept { fill: url(#acceptGradient); - stroke: rgba(68, 68, 68, 0.8); + stroke: rgba(71, 85, 105, 0.9); stroke-width: 1.5; } .radial-arc-reject { fill: url(#rejectGradient); - stroke: rgba(68, 68, 68, 0.8); + stroke: rgba(71, 85, 105, 0.9); stroke-width: 1.5; } @@ -732,7 +732,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { font-size: 14px; font-weight: bold; color: white; - border: 1.5px solid #555; + border: 1.5px solid #64748b; z-index: 10; pointer-events: none; } @@ -750,7 +750,7 @@ export class AllianceRequestPanel extends LitElement implements Layer { font-size: 13px; font-weight: bold; color: white; - border: 1.5px solid #555; + border: 1.5px solid #64748b; z-index: 10; pointer-events: none; } diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index cb5e7c8224..0af90ece62 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -506,7 +506,7 @@ export class DefaultConfig implements Config { return 30 * 10; } allianceDuration(): Tick { - return 45 * 10; // 45 seconds for testing + return 300 * 10; // 5 minutes } temporaryEmbargoDuration(): Tick { return 300 * 10; // 5 minutes. diff --git a/src/core/execution/nation/NationAllianceBehavior.ts b/src/core/execution/nation/NationAllianceBehavior.ts index 805a5ddc26..cb091843fe 100644 --- a/src/core/execution/nation/NationAllianceBehavior.ts +++ b/src/core/execution/nation/NationAllianceBehavior.ts @@ -79,9 +79,8 @@ export class NationAllianceBehavior { p.type() !== PlayerType.Bot; for (const enemy of borderingEnemies) { - // 20x more frequent: changed from chance(30) to chance(2) - roughly 50% chance per tick if ( - this.random.chance(2) && + this.random.chance(30) && isAcceptablePlayerType(enemy) && this.player.canSendAllianceRequest(enemy) && this.getAllianceDecision(enemy, false) diff --git a/src/core/game/GameView.ts b/src/core/game/GameView.ts index 1f21e75821..2ee2109fde 100644 --- a/src/core/game/GameView.ts +++ b/src/core/game/GameView.ts @@ -613,64 +613,11 @@ export class GameView implements GameMap { this.humans.map((h) => [h.clientID, h.cosmetics ?? {}]), ); - // Test patterns for nations - give some nations player skins for testing - const testPatterns = [ - { - name: "stripes_v", - patternData: "ABMIVVU", - colorPalette: { - name: "blue_white", - primaryColor: "#3b82f6", - secondaryColor: "#ffffff", - }, - }, - { - name: "stripes_h", - patternData: "ABMIDw8", - colorPalette: { - name: "red_gold", - primaryColor: "#ef4444", - secondaryColor: "#fbbf24", - }, - }, - { - name: "checkerboard", - patternData: "ABMIpaU", - colorPalette: { - name: "green_black", - primaryColor: "#22c55e", - secondaryColor: "#1f2937", - }, - }, - { - name: "diagonal", - patternData: "AHE4AQACAAQACAAQACAAQACAAAABAAIABAAIABAAIABAAIA", - colorPalette: { - name: "purple_pink", - primaryColor: "#a855f7", - secondaryColor: "#ec4899", - }, - }, - { - name: "cross", - patternData: "AHE4AYACQAQgCBAQCCAEQAKAAYABQAIgBBAICBAEIAJAAYA", - colorPalette: { - name: "orange_white", - primaryColor: "#f97316", - secondaryColor: "#ffffff", - }, - }, - ]; - for (let i = 0; i < this._mapData.nations.length; i++) { const nation = this._mapData.nations[i]; // Nations don't have client ids, so we use their name as the key instead. - // Give every other nation a test pattern for skin testing - const pattern = - i % 2 === 0 ? testPatterns[i % testPatterns.length] : undefined; this._cosmetics.set(nation.name, { flag: nation.flag, - pattern: pattern, } satisfies PlayerCosmetics); } } diff --git a/src/core/game/NationCreation.ts b/src/core/game/NationCreation.ts index 1d767e5fb5..b2bdc0b70b 100644 --- a/src/core/game/NationCreation.ts +++ b/src/core/game/NationCreation.ts @@ -49,24 +49,7 @@ export function createNationsForGame( // For non-HumansVsNations modes, simply use the effective nations if (!isHumansVsNations) { - // TEST: Generate extra nations to test alliance request panel overflow (30 total) - const baseNations = effectiveNations.map(toNation); - const targetNationCount = 30; - if (baseNations.length < targetNationCount) { - const usedNames = new Set(baseNations.map((n) => n.playerInfo.name)); - const additionalCount = targetNationCount - baseNations.length; - for (let i = 0; i < additionalCount; i++) { - const name = generateUniqueNationName(random, usedNames); - usedNames.add(name); - baseNations.push( - new Nation( - undefined, - new PlayerInfo(name, PlayerType.Nation, null, random.nextID()), - ), - ); - } - } - return baseNations; + return effectiveNations.map(toNation); } // HumansVsNations mode: balance nation count to match human count From cd3d685e0bf9e56e0a06505f0732e0425e10d9bb Mon Sep 17 00:00:00 2001 From: zimri-leisher Date: Fri, 23 Jan 2026 21:32:22 -0500 Subject: [PATCH 8/8] revert testing changes --- src/core/configuration/DefaultConfig.ts | 6 ++-- .../nation/NationAllianceBehavior.ts | 36 +++++-------------- src/core/game/GameView.ts | 3 +- 3 files changed, 12 insertions(+), 33 deletions(-) diff --git a/src/core/configuration/DefaultConfig.ts b/src/core/configuration/DefaultConfig.ts index 0af90ece62..7311cb60c2 100644 --- a/src/core/configuration/DefaultConfig.ts +++ b/src/core/configuration/DefaultConfig.ts @@ -4,6 +4,7 @@ import { Difficulty, Game, GameMode, + GameType, Gold, Player, PlayerInfo, @@ -506,7 +507,7 @@ export class DefaultConfig implements Config { return 30 * 10; } allianceDuration(): Tick { - return 300 * 10; // 5 minutes + return 300 * 10; // 5 minutes. } temporaryEmbargoDuration(): Tick { return 300 * 10; // 5 minutes. @@ -525,8 +526,7 @@ export class DefaultConfig implements Config { return 3; } numSpawnPhaseTurns(): number { - // Always use 10 seconds (100 ticks) for spawn phase - return 100; + return this._gameConfig.gameType === GameType.Singleplayer ? 100 : 300; } numBots(): number { return this.bots(); diff --git a/src/core/execution/nation/NationAllianceBehavior.ts b/src/core/execution/nation/NationAllianceBehavior.ts index cb091843fe..cbf78304bf 100644 --- a/src/core/execution/nation/NationAllianceBehavior.ts +++ b/src/core/execution/nation/NationAllianceBehavior.ts @@ -38,36 +38,16 @@ export class NationAllianceBehavior { handleAllianceExtensionRequests() { for (const alliance of this.player.alliances()) { - const human = alliance.other(this.player); - - // Check if alliance is expiring soon (within the prompt offset window) - const isExpiringSoon = - alliance.expiresAt() <= - this.game.ticks() + this.game.config().allianceExtensionPromptOffset(); + // Alliance expiration tracked by Events Panel, only human ally can click Request to Renew + // Skip if no expiration yet/ ally didn't request extension yet / nation already agreed to extend + if (!alliance.onlyOneAgreedToExtend()) continue; - // Nations proactively request extension when alliance is about to expire - // This makes them very likely to request BEFORE the human does (for testing) - if ( - isExpiringSoon && - !alliance.onlyOneAgreedToExtend() && - !alliance.bothAgreedToExtend() - ) { - // 90% chance each tick to proactively request renewal - if (this.random.chance(2) && this.getAllianceDecision(human, true)) { - this.game.addExecution( - new AllianceExtensionExecution(this.player, human.id()), - ); - continue; - } - } + const human = alliance.other(this.player); + if (!this.getAllianceDecision(human, true)) continue; - // Also respond to human's extension request if they asked first - if (alliance.onlyOneAgreedToExtend()) { - if (!this.getAllianceDecision(human, true)) continue; - this.game.addExecution( - new AllianceExtensionExecution(this.player, human.id()), - ); - } + this.game.addExecution( + new AllianceExtensionExecution(this.player, human.id()), + ); } } diff --git a/src/core/game/GameView.ts b/src/core/game/GameView.ts index 2ee2109fde..166bfe2a30 100644 --- a/src/core/game/GameView.ts +++ b/src/core/game/GameView.ts @@ -613,8 +613,7 @@ export class GameView implements GameMap { this.humans.map((h) => [h.clientID, h.cosmetics ?? {}]), ); - for (let i = 0; i < this._mapData.nations.length; i++) { - const nation = this._mapData.nations[i]; + for (const nation of this._mapData.nations) { // Nations don't have client ids, so we use their name as the key instead. this._cosmetics.set(nation.name, { flag: nation.flag,