mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-21 23:11:55 +00:00
Evan
b4a14f9b9d
## Description: Replaces the DOM-based `AttackingTroopsOverlay` with `AttackingTroopsController`, rendering attack troop counts through `WorldTextPass` instead of a separate fixed-position DOM container. ## Summary - New `AttackingTroopsController` polls `attackClusteredPositions()` every 200ms and pushes labels to the WebGL view each frame, lerping cluster positions over 250ms for smooth front-line movement (replaces the old CSS `transform 0.25s` transition). - `WorldTextPass` gains `setAttackTroopLabels()` and renders them at a fixed on-screen size (zoom-independent) using `screenScale / zoom`. - World text now draws on top of `NamePass` so attack callouts aren't hidden behind centered player names. - Fragment shader adds a soft quadratic dark halo around every world-text label; extent uses the remaining SDF range after the hard outline so it fades smoothly to zero (no rectangular clipping). - Deletes `AttackingTroopsOverlay.ts`; existing unit tests repointed to the controller's exported `alignClusterOrder`. <img width="369" height="395" alt="Screenshot 2026-05-24 at 4 43 51 PM" src="https://github.com/user-attachments/assets/4dbffe20-77f9-4c0f-b956-ecf543538f8d" /> ## 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 ## Please put your Discord username so you can be contacted if a bug or regression is found: evan
77 lines
2.4 KiB
TypeScript
77 lines
2.4 KiB
TypeScript
import { describe, expect, test } from "vitest";
|
|
import {
|
|
alignClusterOrder,
|
|
Slot,
|
|
} from "../../../../src/client/controllers/AttackingTroopsController";
|
|
import { Cell } from "../../../../src/core/game/Game";
|
|
|
|
// Slots only need the `dst` fields populated for `alignClusterOrder` — it
|
|
// compares the new positions against the previous targets to decide whether
|
|
// the worker reordered same-size clusters.
|
|
const slot = (x: number, y: number): Slot => ({
|
|
curX: x,
|
|
curY: y,
|
|
srcX: x,
|
|
srcY: y,
|
|
dstX: x,
|
|
dstY: y,
|
|
startMs: 0,
|
|
});
|
|
|
|
describe("alignClusterOrder", () => {
|
|
const c = (x: number, y: number) => new Cell(x, y);
|
|
|
|
test("preserves order when direct mapping is closer", () => {
|
|
const next = [c(10, 10), c(100, 100)];
|
|
const prev = [slot(12, 11), slot(98, 102)];
|
|
alignClusterOrder(next, prev);
|
|
expect(next[0].x).toBe(10);
|
|
expect(next[1].x).toBe(100);
|
|
});
|
|
|
|
test("swaps when the worker reordered same-size clusters", () => {
|
|
// prev[0] is near (10,10), prev[1] is near (100,100); the worker returned
|
|
// them in the opposite order. Expect swap so each label sticks to its front.
|
|
const next = [c(101, 99), c(11, 12)];
|
|
const prev = [slot(10, 10), slot(100, 100)];
|
|
alignClusterOrder(next, prev);
|
|
expect(next[0].x).toBe(11);
|
|
expect(next[1].x).toBe(101);
|
|
});
|
|
|
|
test("does not swap on a tie (strict less-than)", () => {
|
|
const next = [c(0, 0), c(10, 0)];
|
|
const prev = [slot(5, 0), slot(5, 0)];
|
|
alignClusterOrder(next, prev);
|
|
expect(next[0].x).toBe(0);
|
|
expect(next[1].x).toBe(10);
|
|
});
|
|
|
|
test("no-op when fewer than two new positions", () => {
|
|
const single = [c(99, 99)];
|
|
alignClusterOrder(single, [slot(0, 0), slot(1000, 1000)]);
|
|
expect(single[0].x).toBe(99);
|
|
|
|
const empty: Cell[] = [];
|
|
alignClusterOrder(empty, [slot(0, 0), slot(1000, 1000)]);
|
|
expect(empty.length).toBe(0);
|
|
});
|
|
|
|
test("no-op when fewer than two previous slots (initial render)", () => {
|
|
const next = [c(100, 100), c(0, 0)];
|
|
alignClusterOrder(next, [slot(0, 0)]);
|
|
expect(next[0].x).toBe(100);
|
|
expect(next[1].x).toBe(0);
|
|
|
|
alignClusterOrder(next, []);
|
|
expect(next[0].x).toBe(100);
|
|
expect(next[1].x).toBe(0);
|
|
});
|
|
|
|
test("no-op when more than two new positions (assumed cap)", () => {
|
|
const next = [c(100, 0), c(0, 0), c(50, 0)];
|
|
alignClusterOrder(next, [slot(0, 0), slot(100, 0)]);
|
|
expect(next.map((p) => p.x)).toEqual([100, 0, 50]);
|
|
});
|
|
});
|